多应用+插件架构,代码干净,二开方便,首家独创一键云编译技术,文档视频完善,免费商用码云13.8K 广告
[TOC] # Cordova 原生插件 这里举一个获取手机相册的例子,输入以下代码安装 imagepicker 插件 ~~~ $ ionic cordova plugin add add cordova-plugin-telerik-imagepicker ~~~ 之后在需要用到的页面,使用以下方法即可调用手机相册 ~~~ showAlbum() { this.platform.ready().then(() => { (<any>window).imagePicker.getPictures(photo => { console.log(photo[0]); }); }); ~~~ # Ionic Native Ionic Native 与原生 Cordova 插件不同,它的安装需要进行两步。以 ActionSheet 插件举例 ~~~ $ ionic cordova plugin add cordova-plugin-actionsheet $ npm install --save @ionic-native/action-sheet ~~~ **第一个步骤和之前安装插件完全相同,第二步则是安装 Ionic 封装的代码**。所以不需要的时候我们也要输入两条指令**才能彻底删除**。 ~~~ $ ionic cordova plugin rm cordova-plugin-actionsheet $ npm uninstall --save @ionic-native/action-sheet ~~~ Ionic Native 的使用方法,官方文档写的已经很简单了,我简单举一个例子。 ~~~ showActionSheet() { let buttonLabels = ['你好', '确定']; const options: ActionSheetOptions = { title: '你好Ionic', buttonLabels: buttonLabels, addCancelButtonWithLabel: '取消', androidTheme: this.actionSheet.ANDROID_THEMES.THEME_HOLO_LIGHT, destructiveButtonLast: true }; this.actionSheet.show(options); } ~~~ # 地图插件 cordova-plugin-amaplocation ## 导航 [cordova_plugin_amap_navigation](https://github.com/Mobishift/cordova_plugin_amap_navigation) # 图片处理 ## 压缩 ## [ionic-img-viewer](https://github.com/Riron/ionic-img-viewer) Twitter的灵感体验来可视化图片: ## [cordova-plugin-crop](https://github.com/ihadeed/cordova-plugin-crop) ## [cordova-plugin-ImagePicker](https://github.com/giantss/cordova-plugin-ImagePicker) cordova相册仿微信多选插件 [ionic3图片选择+照相 目前最好用的插件+BUG修复](https://www.jianshu.com/p/d84ac72c386c) ## [DmcSDK/cordova-plugin-mediaPicker](https://github.com/DmcSDK/cordova-plugin-mediaPicker) ~~~ ionic cordova plugin add cordova-plugin-mediapicker-dmcbig --variable IOS_PHOTO_LIBRARY_USAGE_DESCRIPTION="to upload photo as avatar or product image" ~~~ # 支付 支付宝 : ``` cordova plugin add https://github.com/hhjjj1010/cordova-plugin-alipay-v2.git --variable APP_ID=[your AppId] ``` 微信支付: 银联: # WebView ## [x5webview for cordova](https://github.com/runner525/x5webview-cordova-plugin) x5webview-cordova-plugin 是腾讯浏览服务(TBS)为cordova框架提供的用于android平台的cordova插件,旨在为android平台提供更好的webview浏览体验. ## [Edc.zhang](https://github.com/Edc-zhang) # 扫描插件 [cordova-gizwits-scan-qrcode](https://github.com/gizwits/cordova-gizwits-scan-qrcode) cordova扫码插件 [ionic3 使用QR Scaner 扫描](https://www.jianshu.com/p/45f8b44b9a42) 使用 qr-scanner 背景是白屏的 ? ion-app元素, 添加属性: `background: none transparent` (仔细看作者的demo) # 分享插件 https://github.com/Luomusha/cordova-plugin-sharesdk (具有授权登录功能) QQURLSCHEME:QQ回调Scheme。例如:QQ41DF25B4,“QQ”+腾讯QQ互联应用appId转换成十六进制(不足8位前面补0),例如“QQ05FC5B14” WBREDIRECTURL 第三方应用授权回调页面。授权回调页对移动客户端应用来说对用户是不可见的,所以定义为何种形式都将不影响,但是没有定义将无法使用SDK认证登录。建议使用默认回调页https://api.weibo.com/oauth2/default.html (可以在新浪微博开放平台->我的应用->应用信息->高级应用->授权设置->应用回调页中找到)。 ## 微信分享签名 应用部署完成后,需要用于获取安装到手机的第三方应用签名的apk包。点击下载 [签名生成工具](https://res.wx.qq.com/open/zh_CN/htmledition/res/dev/download/sdk/Gen_Signature_Android2.apk), 安装完成后执行, 输入自己应用的包名, 就可以获得一串签名了. 小心仔细地把签名填写到微信平台 Android 下的相关位置并提交. 到这里, 应该就没有大问题了, 注意需要调试微信相关功能的时候记得用加上 `--release`, wishes~ ``` https://github.com/behring/cordova-plugin-sharesdk (具有单个分享功能) ``` **注意**:腾讯提供了许多个的开放平台。差不多每个大的产品都提供了开放平台,比如微信、QQ邮箱,财付通等。这里面有2个比较易混的,一个是[QQ互联](http://connect.qq.com/),一个是[腾讯开放平台](http://open.qq.com/)。QQ互联主要是为了给第三方网站或移动应用提供登录信息。而腾讯开发平台,则是为托管型的应用(平台应用和移动应用)提供服务的。不过现在QQ互联正在往腾讯开发平台上迁移,**要在QQ互联平台上关联开放平台应用**。 [MOB 微信分享闪退 errCode -6](https://blog.csdn.net/feitian145623/article/details/51752093) ::原因是微信开放平台的md5签名跟手机签名不一致了。用MD5签名生成器生成下替换下就OK啦 ## 总结 最后在这里发现了最新的sharesdk~ https://github.com/kuaimacode/cordova-plugin-sharesdk (此插件有会报错,但是具有最新的一键登录功能,修改后可用) 在结合以上两者!开发了分享 和 第三方登陆功能 功能! 自己上传到了自己的github上! ionic 3 安装命令: ~~~ ionic cordova plugin add "git-url或者下载到本地路径安装" --save --variable Mob_AppKey="266ed2972d02e" --variable Mob_AppSecret="eb9260ab7819beb9c7b0be96dbb67eaf" --variable QQAPPID_ANDROID=1106978986 --variable QQAPPKEY_ANDROID=Ywh2vbqjpxMM0qG9 --variable QQAPPID_IOS=1106978986 --variable QQAPPKEY_IOS=Ywh2vbqjpxMM0qG9 --variable QQURLSCHEME=QQ41FB28AA --variable WECHATAPPID=wxdb9054c450b74988 --variable WECHATAPPSECRET=71ec8c720e159a1ffbb56615039ddecc --variable WBAPPKEY=1130956472 --variable WBAPPSECRET=9229ebda36c619fd952a0c9938200e06 --variable WBREDIRECTURL=http://www.baidu.com/auth ~~~ # 图片 [PhotoViewer](https://github.com/sarriaroman/photoviewer) ~~~ 根据Url显示图片 支持手势,可放大缩小 带分享按钮,可分享图片 带关闭按钮 加载错误时自动关闭组件 支持Base64 ~~~ # 原生HTTP请求 ## [cordova-plugin-native-http](https://github.com/zyra/cordova-plugin-native-http) # Deep Linking ## [cordova-ionic-phonegap-branch-deep-linking](https://github.com/BranchMetrics/cordova-ionic-phonegap-branch-deep-linking) # [Microsoft ace](http://microsoft.github.io/ace) 微软公司提供的插件,可以使用html和js非常容易的创建原生UI并调用原生代码。 # 参考 [Cordova 社区 ](https://cordova.apache.org/plugins/) Cordova 社区提供上千个插件,支持各种设备平台的各类硬件特性。 [Github](https://github.com) 作为最大的程序员同性交友网站,在这里也可以搜索到的很多插件。 [Ionic Native](https://ionicframework.com/docs/native/) Ionic 官方提供的插件地址,它与原生 Cordova 插件有所不同,后面会讲到。 # 国内资源平台 http://dacatec.com/jdcloud-site/