前言:
最近开始进军uni-app混合开发的坑,已采坑无数,每跨过一个坑,实力就能提升一点点。现在需要企业版app ipa包需要部署到自己的服务器下载。
所有的ipa包部署自己的服务器最终都有如下4个文件:
test.ipa、manifest.plist、test.mobileprovision(描述文件)、index.html(下载页面)
1.test.ipa包生成的方式有很多 Xcode打包、HbuilderX打包等等
2.manifest.plist生成的方式也有很多第8区plist文件制作、Xcode打包自动会生成plist文件
plist文件配置查看:
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
<plist version="1.0">
<dict>
<key>items</key>
<array>
<dict>
<key>assets</key>
<array>
<dict>
<key>kind</key>
<string>software-package</string>
<key>url</key>
<string>https://www.dapeis.com/apps/test.ipa</string>
</dict>
<dict>
<key>kind</key>
<string>display-image</string>
<key>url</key>
<string>https://www.dapeis.com/apps/icon57.png</string>
</dict>
<dict>
<key>kind</key>
<string>full-size-image</string>
<key>url</key>
<string>https://www.dapeis.com/apps/icon512.png</string>
</dict>
</array>
<key>metadata</key>
<dict>
<key>bundle-identifier</key>
<string>io.dcloud.dpc</string>
<key>bundle-version</key>
<string>1.0.0</string>
<key>kind</key>
<string>software</string>
<key>title</key>
<string>搭配钱包</string>
</dict>
</dict>
</array>
</dict>
</plist>
3.index.html页面地址代码如下:
<template>
<div class="page tc">
<div class="header">
<img src="/static/apps/img/icon512.png" class="logo-img">
</div>
<h3>搭配钱包</h3>
<a
:href="appDwonUrl"
target="_self"
class="download-btn"
>APP下载安装</a>
<div class="tip">适用于苹果和安卓手机</div>
<a v-if="!isAndroid" href="https://dibaqu.com/guide.html" class="no-believe">未受信任的企业级开发者"的解决办法</a>
<!-- ios证书信任方法 -->
<a
v-if="!isAndroid" href="/static/apps/dev/dpcProfile.mobileprovision"
class="to-believe"
>信任开发者</a>
<br>
<div class="wx-show" v-if="isShowWx">
<img :src="wxTipUrl" class="wx-show-tip">
</div>
</div>
</template>
<script>
export default {
data() {
return {
isShowWx:false,//微信提示是否显示
isAndroid:false,//是否是安卓系统
appDwonUrl:'itms-services://?action=download-manifest&url=https://www.dapeis.com/static/apps/dev/manifest.plist',//app下载地址
wxTipUrl:'/static/apps/img/ios.png'//微信提示
};
},
mounted() {
document.title = "搭配钱包";
this.init();
},
methods: {
init() {
var isWeixin = function() {
//判断是否是微信
var ua = navigator.userAgent.toLowerCase();
return ua.match(/MicroMessenger/i) == "micromessenger";
};
if (isWeixin()) {
console.log("wx");
this.isShowWx=true;
}
// if (navigator.userAgent.match(/(iPhone|iPod|iPad);?/i)) {
// //判断是否是iOS
// console.log("ios");
// }
if (navigator.userAgent.match(/android/i)) {
this.isAndroid=true;
this.wxTipUrl='/static/apps/img/android.png';
this.appDwonUrl='/static/apps/dev/dpcDev.apk';
//判断是否是Android
console.log("android");
}
},
readFile: function(event) {}
}
};
</script>
<style lang="less">
@import "./appDwonload";
</style>
appDwonload.less文件
.page{
.header {
position: relative;
background-image: url(/static/apps/img/bg.jpg);
height: 130px;
margin-bottom: 100px;
}
.logo-img {
position: absolute;
left: 50%;
bottom: -90px;
transform: translateX(-50%);
width: 150px;
height: 150px;
border: 1px solid #e5e5e5;
border-radius: 15px;
box-shadow: 0 0 10px rgba(0, 0, 0, .2);
}
h3 {
font-size: 20px;
font-weight: 600;
margin-top: 10px;
margin-bottom: 8px;
}
.download-btn,
.to-believe {
display: inline-block;
padding: 0 35px;
line-height: 40px;
background: #157df1;
margin: 30px auto 10px;
color: #fff;
font-size: 16px;
border-radius: 5px;
text-decoration: none;
}
.to-believe {
background-color: #40acf1;
border: 1px solid #40acf1;
}
.no-believe {
display: block;
color: #157df1;
margin-top: 10px;
}
.tip {
color: #999;
font-size: 16px;
}
/* 微信显示 */
.wx-show {
position: fixed;
left: 0;
top: 0;
width: 100%;
height: 100%;
background: #666666;
}
.wx-show-tip {
width: 100%;
max-width: 100%;
max-height: 100%;
}
}
4.test.mobileprovision(描述文件),这个文件需要有开发者账号才能获取,怎么获取可自己查询比较简单,不会可以留言。这个文件主要作用是index.html证书信任使用,有了这个可以自动跳转到手机信任页面,不需要用户查询怎么去信任