前置条件:
IPAD 与 桌面应用的nodejs微服务的通讯问题
我最近的需求是 ipad向 桌面端发起http协议的的内网指令
但是! ipad 之前因为安全问题 是部署在https的服务器上的,本地调试正常
但是如果发版在服务器上发送指令 会 报错:
xhr.js:177 Mixed Content: The page at 'https:xxx' was loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint 'http://xxx'. This request has been blocked; the content must be served over HTTPS.
dispatchXhrRequest @ xhr.js:177
xhrAdapter @ xhr.js:13
dispatchRequest @ dispatchRequest.js:52
Promise.then (async)
request @ Axios.js:61
wrap @ bind.js:9
resolve @ screen.vue?./node_modules/cache-loader/dist/cjs.js??ref--12-0!./node_modules/babel-loader/lib!./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/vue-loader/lib??vue-loader-options:478
p.then.res @ screen.vue?./node_modules/cache-loader/dist/cjs.js??ref--12-0!./node_modules/babel-loader/lib!./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/vue-loader/lib??vue-loader-options:477
Promise.then (async)
goDetail @ screen.vue?./node_modules/cache-loader/dist/cjs.js??ref--12-0!./node_modules/babel-loader/lib!./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/vue-loader/lib??vue-loader-options:452
click @ screen.vue?./node_modules/cache-loader/dist/cjs.js?{"cacheDirectory":"node_modules/.cache/vue-loader","cacheIdentifier":"b21e42dc-vue-loader-template"}!./node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/vue-loader/lib??vue-loader-options:41
invokeWithErrorHandling @ vue.runtime.esm.js:1853
invoker @ vue.runtime.esm.js:2178
original._wrapper @ vue.runtime.esm.js:6907
createError.js:16 Uncaught (in promise) Error: Network Error
at createError (createError.js:16)
at XMLHttpRequest.handleError (xhr.js:84)
是因为https的安全协议阻拦。
开发至目前有两种解决方式
(从部署端解决或者从前端解决):
部署端:
首先正常部署thhps,另起一个挂http协议的模块,然后里面什么都不用写,直接镜像或者跳转直部署在https里的iapd项目路径就行。
然后ipad编译这个http的地址来显示。
这样部署后会从http协议内发送http请求,就会正常发送指令。
这样其实能满足大多数安全团队的检测了,常用的几种抓包工具都抓不到,有测试验证。
从前端:
if (window.webkit && window.webkit.messageHandlers && window.webkit.messageHandlers.sendCmdHandler) {
window.webkit.messageHandlers.sendCmdHandler.postMessage({
"url":url
});
}
window.entryScreen = function(type){
console.log(type)
}
从ipad编译壳儿上入手,通讯端代码写至ipad端,然后指令什么的都发给壳儿,然后ipad外壳儿接到指令后进行转发通讯,绕开https的安全协议,返回值通过内置方法进行反馈。
**注:**通讯需要通过window方法进行通讯,所以里面没有this。
以上:编辑不易,点个赞吧!