继续浏览精彩内容
慕课网APP
程序员的梦工厂
打开
继续
感谢您的支持,我会继续努力的
赞赏金额会直接到老师账户
将二维码发送给自己后长按识别
微信支付
支付宝支付

iOS版Cordova安装开发

PIPIONE
关注TA
已关注
手记 921
粉丝 147
获赞 701

之前有个做ffmpeg的大神。由于公司开发app的过程中需要有音视频播放(后期会有直播)这一块,老总是一位5,60岁的超级大佬,不用网上的第三方云服务(百度云,七牛云...)播放音视频.无奈自己去研究ffmpeg这一块。由于在ffmpeg这一块”略懂“,在群里就碰到上面说的ffmpeg大神。推荐我先了解下Cordova插件,后期自己自定义插件。然后我就有幸接触这一块。本着多学一些技多不压身的态度去看看学学。

Cordova:

在介绍Cordova之前,必须先提一下PhoneGap。PhoneGap 是Nitobi软件公司2008年推出的一个框架,旨在弥补web 和iOS 之间的不足,使得web 和 iPhone SDK 之间的交互更容易。后来又加入了Android SDK 和BlackBerry SDK,再然后又陆续加入了更多的平台。但是在2011年,Nitobi公司被Adobe收购,PhoneGap也被提交到Apache Incubator。由于Adobe现在拥有PhoneGap商标,PhoneGap v2.0版产品就更名为Apache Cordova。据说Cordova是Nitobi团队当时坐落的街道名称,用此名来纪念Nitobi团队的贡献。Apache Cordova是从PhoneGap中抽出的核心代码,是驱动PhoneGap的核心引擎。

提供了一组设备相关的API,通过这组API,移动应用能够以JavaScript访问原生的设备功能,如摄像头、麦克风等。Cordova还提供了一组统一的JavaScript类库,以及为这些类库所用的设备相关的原生后台代码。Cordova支持如下移动操作系统:iOS, Android,ubuntu phone os, Blackberry, Windows Phone, Palm WebOS, Bada 和 Symbian。

什么是Cordova插件?

插件就是一些附加代码用来提供原生组件的JavaScript接口,他允许你的App可以使用原生设备的能力,超越了纯粹的Web App。

Cordova工程结构

从下面这幅图可以看出Cordova工程的结构,以及与Native API 之间的关系。

700

由上图可以看出,其实Cordova的使用分为上面几个框架结构,在Native与web之间交互。

Cordova的安装

安装cordova命令行工具,贴出官网的步骤:(可以去官网看看)

$ npm install -g cordova

$ cordova create MyApp

$ cd MyApp

$ cordova platform add ios

$ cordova run ios

官网就是官网的,对于小白来说还是看不懂。

下面贴出自己的实践过程:

1.下载Node.js

我下载的是最新版本8.1.0

700

Mac 电脑,下载后双击,一直next

下载后在终端:sudo npm install -g cordova

579

sudo npm install -g cordova

572

sudo npm install -g cordova

2.sudo cordova create myDemo com.ztt.myDemo.hello HelloWorld

(下面的2个图片是没有加sudo权限的cordova create myDemo com.ztt.myDemo.hello HelloWorld,直接提示我

localhost:~ hqtech$ cordova/usr/local/lib/node_modules/cordova/node_modules/configstore/index.js:53 

throw err;

^

Error: EACCES: permission denied, open'/Users/hqtech/.config/configstore/update-notifier-cordova.json'

You don't have access to this file.

不能访问这个文件,因为没权限,解决的办法:

A.直接在每个命令前+sudo

B.切换到su权限下,以后的命令就不要+sudo了

663

606

A.直接在每个命令前+sudo

577

sudo cordova create myDemo com.ztt.mydemo.hello HelloWorld

B.切换到su权限下,以后的命令就不要+sudo了

436

sudo passwd root 作者更倾向于第一种方法,看的直观

3.cd myDemo

573

cd myDemo

4.cordova platform add ios(此处的ios都是小写的)

587

cordova platform add iOS

5.sudo cordova build

624

sudo cordova build

620

到这里cordova的创建算是告一段落

打开工程

700

700

640

cordova安装的坑(勿踩)

1.The file “HelloWorld.xcworkspace” could not be unlocked.

700

选中工程文件夹点右键,在 “显示简介"——>"共享与权限"——>"-+"号。 添加本用户(就是你登录的那个账号),授予读写权限,并点击下方的设置符号选择"应用到包含的项目",操作如下图:

304

2.Error: Path already exists and is not empty: /Users/zhaotong/Desktop/cordova/Demo

589

原因是在cordova的目录下已经存在一个名为Demo 的文件夹

3.Error:Unexpeced token H in JSON at position 0

573

Error:Unexpeced token H in JSON at position 0

解决:创建的命令检查下

对的:sudo cordova create myDemo com zit.mydemo.hello HelloWorld

输入密码时:是英文的输入法(犯了低级)

4.就是权限问题,每次命令时我的都要+sudo

配置后的demo工程地址:https://github.com/mrzhao12/cordovaDemo

总的来说cordova的第一次接触坑还是很多了,至于以后的cordova自定义插件,还是慢慢学吧,阿弥陀佛



作者:ttdiOS
链接:https://www.jianshu.com/p/fb7201008fc9


打开App,阅读手记
1人推荐
发表评论
随时随地看视频慕课网APP