apk ionic打包ios
2017-05-31 20:03:00 weixin_34273481 阅读数 9

夜深人静的时候恰是总结的好时候,对于ios打包,从一个小白,到各种踩坑,再到最后打包好ipa文件,到手机测试经历了无数的困难和挫折,总结下踩过的坑,为后面的小伙伴走的更顺更快些。

整个过程耗时将近两周,现在就差一个企业开发者账号就能安装到客户的手机上了。

整个过程涉及到的软件众多:

1 虚拟机 2 mac ox系统(10.11.1) 3 mac终端命令 4 nodeJs(5.9.1) 5 npm(4.6.1) 6 cnpm  7 cordova(7.0.1) 8 ionic(1.7.15) 9 xcode(7.3.1) 10 iTunes (12.6.1.25)11 App Store 12 vm tools 13 真机测试问题 

刚开始接到这个搭建环境打包ios的任务的时候感觉很简单 网上搜教程 一步一步操作就可以,哪成想,根本不是那么回事,各种版本不兼容不匹配,这里强调的是版本一定要控制好,不然后面反复装 反复试 很麻烦。

我遇到的问题:

1 之前没怎么用过虚拟机,别人靠给我的虚拟机,一看没有镜像文件,就自己去下载了,很耗时间的(除非你的网速快),就算别人考给你了 涉及个人appleId的问题就不太方便了。最后还是自己下载的mac ox系统装了一个。补充一点 windows装mac系统要求的配置要高,至少8g内存,再小了你会疯掉的。我是8g的就感觉卡疯了。老大16g的挺流畅的。

2 下载mac系统 不管下载哪个版本的系统 后面的软件都要匹配上,中间遇到一个苹果开机的加载页面,需要在修改一段代码

3终端命令超级权限要加sudo 文件不能拖拽的  需要新建一个文件夹 不要桌面新建 才可以拖拽

4 安装nodes nam cordova ionic 

5 白屏问题的解决 浏览器 代码检查 看错误日志 删除掉编译后的文件重新编译 

6 手机测试运行 在相应的路径下  添加相应的配置文件的包 

7 ionic中sources文件的图片和闪屏都是ionic resources命令生成的 

正方形709*709 无圆角 png-8

欢迎页2208*2208  1200*1200 外面纯色的背景  png-8

8 命令编译 xcode运行

大体遇到的问题就这些后续再添加。

转载于:https://www.jianshu.com/p/ddd93e2eb7f1

2016-09-09 16:57:30 qianzichao123 阅读数 1528
首先,让我先吐槽一下,作为一个新手,我花了大半个月,终于把app导入了手机,我大学英语考试12分,所以不要以看不懂英文座位理由 


第一步,你要有一个苹果系统,土豪支持真机吧,我这里装的虚拟机 
http://bbs.ionic-china.com/bbs-post-run?fid=9 
http://www.33lc.com/article/4344.html 
结合这两个帖子就可以成功装配成苹果系统 


第二步,你需要一个xcode,因为在mac os上打包app必须有xcode(这个仅仅代表自己的观点) 
ps:注意一点,xcode要下6.2的,但是在之前 你需要将你装的虚拟机升级成10.9.5,我是通过上面装的虚拟机然后升级的。 
(xcode6.2的原因是因为,xcode貌似是10.9.5能装的最高的版本,并且它能够支持ios8.2的系统,我目前测试手机是8.2更高就不知道了。我在这里卡了三天,公司网差 不让下。别绕路了) 
http://www.cocoachina.com/bbs/read.php?tid-1693836.html 
ps:别用迅雷,下载速度为10KB,用浏览器下都能达到400KB 


第三步,把你的项目移动到虚拟机的mac os系统中, 
sudo ionic platfrom add ios 
sudo ionic platfrom list 


第四步,在你的项目中走这个路径platforms\ios,这个ios就是你要编译然后装进手机中的app 


第五步,把app,按照苹果的规则导进iphone手机 
http://www.cocoachina.com/ios/20160711/17004.html 






结束语:大概到这里就结束了,我只是把我完成的流程放在这上面,大半个月才完成,但是也很有成就感,因为英语才12分,真心很感谢很多人,感谢我们的前辈愿意分享,我只是作为一个整理的人,所以不敢说原创
2017-02-08 22:02:25 chenzao1220 阅读数 2412

一,ios打包配置
1.状态栏重叠

第一次打包发现状态栏重叠,网上搜索的原生代码无效。最后通过在config.xml里设置实现。

  <preference name="StatusBarOverlaysWebView" value="false" />(重要)
  <preference name="StatusBarStyle" value="default" />
  <preference name="StatusBarBackgroundColor" value="#72C147"/>

第二次打包发现顶部好了.但是header下面有一段margin,找到ionic.css(9600+行) 全部注释。

/*.platform-ios.platform-cordova:not(.fullscreen) .bar-header:not(.bar-subheader) {
  height: 64px; }*/
/*  .platform-ios.platform-cordova:not(.fullscreen) .bar-header:not(.bar-subheader).item-input-inset .item-input-wrapper {
    margin-top: 19px !important; }
  .platform-ios.platform-cordova:not(.fullscreen) .bar-header:not(.bar-subheader) > * {
    margin-top: 20px; }*/

/*.platform-ios.platform-cordova:not(.fullscreen) .tabs-top > .tabs,
.platform-ios.platform-cordova:not(.fullscreen) .tabs.tabs-top {
  top: 64px; }

.platform-ios.platform-cordova:not(.fullscreen) .has-header,
.platform-ios.platform-cordova:not(.fullscreen) .bar-subheader {
  top: 64px; }

.platform-ios.platform-cordova:not(.fullscreen) .has-subheader {
  top: 108px; }

.platform-ios.platform-cordova:not(.fullscreen) .has-header.has-tabs-top {
  top: 113px; }

.platform-ios.platform-cordova:not(.fullscreen) .has-header.has-subheader.has-tabs-top {
  top: 157px; }
*/

2.隐藏启动页的加载图标
config.xml里面

 <preference name="ShowSplashScreenSpinner" value="false"/>

3.强制竖屏
config.xml里面

  <preference name="orientation" value="portrait" />

二。bug修复

1.ios input会出现blur时把顶部顶到不见的情况
一般情况下在 内加入 overflow-scroll=”false”可以解决。

2.yhh项目的ajax的采用angular的$http封装,不再采用之前封装的jquery的ajax,但是传输方式有点变化,需要在app.js 的 config

$httpProvider.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded; charset=UTF-8';
$httpProvider.defaults.transformRequest = function(data){
       if (data === undefined) {
           return data;
       };
       return $.param(data);
 };

封装时 $http设置

headers: { 'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8'}。

3.

4.android4.4以下webview的表现很差,于是集成crosswalk
直接安装插件:

cordova plugin add cordova-plugin-crosswalk-webview

5.ios上无法格式化‘2005-01-12’的时间格式,需要替换成‘2005/01/12’的格式。

.replace(/-/g,"/"))

6.轮播图更新后需要手动调用

$ionicSlideBoxDelegate.update();//更新
$ionicSlideBoxDelegate.loop(true);//循环

7.debug包可以连接电脑开启调试模式,要求系统>=4.4

谷歌浏览器输入:chrome://inspect

8.ios键盘挡住输入框。特别是底部单独有一个输入框的情况的解决方法
http://blog.csdn.net/lovelyelfpop/article/details/52033045
ios 的配置 config.xml 加入以下配置

<preference name="KeyboardShrinksView" value="true" />  
<preference name="DisableScrollingWhenKeyboardShrinksView" value="true" />  
2017-08-11 17:43:47 qq_36423909 阅读数 1139

Android更新原理

        1、获取服务器端的APP版本
     2、获取当前版本
     3、判断两个版本是否相等,不相等提示更新,否则不更新

准备cordova插件

 cordova plugin add cordova-plugin-app-version // 获取APP版本
 cordova plugin add cordova-plugin-file// 文件系统
 cordova plugin add cordova-plugin-file-transfer //文件传输系统
 cordova plugin add cordova-plugin-file-opener2 //文件打开系统

更新方法步骤:

第一步:在app.js的run方法里:

.run(function ($ionicPlatform, $ionicPopup, $rootScope, $location, $ionicHistory, $http, $ionicLoading, Storage, UtilService, Constant, $ionicActionSheet, $timeout, $cordovaAppVersion, $cordovaFileTransfer, $cordovaFile, $cordovaFileOpener2){
/**
     * android与IOS版本更新
     */
    $ionicPlatform.ready(function ($rootScope) {
        // Hide the accessory bar by default (remove this to show the accessory bar above the keyboard
        // for form inputs)
        if (window.cordova && window.cordova.plugins.Keyboard) {
            cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
        }
        if (window.StatusBar) {
            // org.apache.cordova.statusbar required
            StatusBar.styleDefault();
        }
        checkUpdate();
        //检测更新
        function checkUpdate(){
            document.addEventListener("deviceready", getVersionUpdate, false); //更新的方法和函数$cordovaFileTransfer
        }
    });

    /**
     * 第一步访问后台拿到:版本信息
     */
    function getVersionUpdate(){
        UtilService.showLoading($ionicLoading);
        //访问网络拿到显示数据
        var url = Constant.url + "app/refresh/appUploadVersionControllerByApp.do";
        var username = UtilService.getMD5Str("APP_Refresh") + UtilService.getMD5Str("July_Three");
        $http({
            url: url,
            method: Constant.post,
            timeout: Constant.timeout,
            params: {
                username: DES3.encrypt(username,Constant.key),
                type: DES3.encrypt('商城',Constant.key)
            }
        }).success(function (data) {//响应成功
            UtilService.hideLoading($ionicLoading);
            var result = angular.fromJson(DES3.decrypt(data.data, Constant.key));
            if (result.flag === 'success') {
                var res =  result.result[0];
                console.log(res);
                onHardwareMenuKeyDown(res);
            } else {
                UtilService.showAlert($ionicPopup, "提示", "操作失败");
            }
        }).error(function (data, header, config, status) {//处理响应失败
            UtilService.hideLoading($ionicLoading);
            UtilService.showAlert($ionicPopup, "提示", "网络错误,稍后重试");
        });
    }

    /**
     * 第二步:拿到后台最新版本和本地版本进行比较进行决定是否更新
     */
    function onHardwareMenuKeyDown(versionMesage) {
        var type = navigator.connection.type; //获取网络的信息是通过cordova的插件来实现的
        //var serverAppVersion = "1.0.0"; //从服务端获取最新版本
        var serverAppVersion = versionMesage.VERSION_NAME; //从服务端获取最新版本
        //获取本地版本
        cordova.getAppVersion.getVersionNumber().then(function (version) {
            console.log(version);
            console.log(serverAppVersion);
            //如果本地与服务端的APP版本不符合
            if (version != serverAppVersion) {
                if (type === 'wifi') {
                    $ionicPopup.confirm({
                        title: '版本更新',
                        template: '<div style="text-align: center">发现新版本</div>',
                        cancelText: '稍后再说',
                        okText: '立即更新'
                    }).then(function (res) {
                        if (res) {
                            //如果是安卓平台,直接下载apk安装升级
                            if($cordovaDevice.getPlatform()=== 'Android'){
                                UpdateForAndroid(versionMesage.DOWNLOAD_PATH);
                                return;
                            }
                            //如果是IOS平台,更新升级需要跳转到苹果商店进行
                            if($cordovaDevice.getPlatform()=== 'iOS'){
                                UpdateForIOS();
                            }
                        } else {
                            //取消更新
                        }
                    });
                } else {
                    $ionicPopup.confirm({
                        title: '建议您在WIFI条件下进行更新,是否确认更新?',
                        template: '发现新版本',
                        cancelText: '稍后再说',
                        okText: '立即更新'
                    }).then(function (res) {
                        if (res) {
                            UpdateForAndroid(versionMesage.DOWNLOAD_PATH);
                        } else {
                            //取消更新
                        }
                    });
                }
            }
        });
    }
    //iOS版实现更新升级需要跳转到苹果商店进行
    function UpdateForIOS(){
        console.log('https://www.apple.com/');
        $window.open('https://www.apple.com/');//跳转到APP商店,这样即可
    }
    //android版本直接下载apk安装升级
    function UpdateForAndroid(downloadPath) {
        $ionicLoading.show({
            template: "已经下载:0%"
        });
        var url = Constant.url + downloadPath; //可以从服务端获取更新APP的路径
        var targetPath = "/sdcard/Dafa/mall.apk"; //APP下载存放的路径,可以使用cordova file插件进行相关配置
        var trustHosts = true;
        var options = {};
        console.log(url);
        $cordovaFileTransfer.download(url, targetPath, options, trustHosts).then(function (result) {
            // 打开下载下来的APP
            $cordovaFileOpener2.open(targetPath, 'application/vnd.android.package-archive'
            ).then(function () {
                // 成功
            }, function (err) {
                // 错误
            });
            $ionicLoading.hide();
        }, function (err) {
            console.log(err);
            alert('下载失败');
        }, function (progress) {
            //进度,这里使用文字显示下载百分比
            $timeout(function () {
                var downloadProgress = (progress.loaded / progress.total) * 100;
                $ionicLoading.show({
                    template: "已经下载:" + Math.floor(downloadProgress) + "%"
                });
                if (downloadProgress > 99) {
                    $ionicLoading.hide();
                }
            })
        });
    }
})
另加:数据库信息:
第三步:APP打包(签名打包):
	1、打开Android Studio,并且在Android Studio里选择file->Open打开platforms里的android
	2、点击Build:
3、Android签名打包详情去参照:http://blog.csdn.net/wwj_748/article/details/44622343
第四步:上传新版本:
1、定义版本号:

	2、上传新版本
	
	3、安装应用到手机,提示更新

2018-06-29 10:10:42 weixin_40136051 阅读数 2401

1.打开ios项目目录,配置证书


2.


3.将运行设备选择,如下图


4.选择:Product -> Scheme -> Edit Scheme


5.


6.选择:Product -> Archive


7.成功后,会跳转到下面的页面,点击Export


8.根据自己的需要,选择不同的类型


9.


10.


11.


12.


13.


14.


没有更多推荐了,返回首页