vue 钉钉微应用的正确打开方式

使用vue开发钉钉微应用，下载钉钉开放平台官网提供的demo(vue-fed-oapage+nodejs-server-todo),地址：https://github.com/open-dingtalk/which-language-demo，会出现不能发送网络请求、页面空白等问题。需要解决项目中存在的问题才能成功运行。以下是修改的内容：

---

vue-fed-oapage

第一步：设置服务端地址，把lib/env.js下的
OPENAPIHOST = ‘’;
设置为OPENAPIHOST = ‘http://www.xxx.com:3000‘;（注意：‘http://’千万不能省略，否则会报跨域错误）
第二步：修改ding-web.js

axios.interceptors.request.use(function(config){
// msgLog(config.url); (该方法的wpo未定义，导致报错，注释掉以后就可以调用axios方法)
return config;
},function (error) {
return Promise.reject(error);
});

第三步：修改index.html

<script src="https://g.alicdn.com/dingding/open-develop/1.6.9/dingtalk.js" charset="utf-8"></script>

（dingtal.js版本太低，鼠标停留在这里，输入“Alt+Enter”安装library）
第四步：修改src/components/complexAPP.vue
注释掉以下代码（因为模拟数据中val变量未定义，导致安卓手机上页面空白）

<!-- <div class="cell-mount">{{ item.formatNumber.val }}</div>
 <div class="cell-unit">{{ item.formatNumber.unit }}</div>
 <div class="cell-app-type-container">
     <div class="cell-app-type">智能报表</div>
 </div>-->

第五步：npm install
第六步：npm run dev
在浏览器的网址中添加corpId:?corpId=xxx（微应用的corpid）

---

nodejs-server-todo

第一步：将env.js 中的CorpID以及CorpSecret设置为自己的：

CorpID: 'xxx',
CorpSecret: 'xxx',

这两个值可以登录钉钉开放平台（http://open-dev.dingtalk.com），在应用开发/开发账号管理下查看。
第二步：修改app/request/getJsApiTicket.js

if (ticket){
if((ticket.timestamp - currentTime) > (200*100)){
return {
ticket: ticket.ticket, (原来是ticket：ticket）
errcode: 0
}
}else {
logger.log('warn', 'ticket cache overdue');
return sendTicketRequest();
}
}

第三步：npm install
第四步：npm run serve

---

想要了解更多关于使用钉钉demo开发vue微应用的填坑过程，可加微信“weixin2015523”交流