vue前端开发ios系统：https发http请求 网络通讯之间的安全问题

前置条件：
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)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18

是因为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)
            }
1
2
3
4
5
6
7
8

从ipad编译壳儿上入手，通讯端代码写至ipad端，然后指令什么的都发给壳儿，然后ipad外壳儿接到指令后进行转发通讯，绕开https的安全协议，返回值通过内置方法进行反馈。
**注：**通讯需要通过window方法进行通讯，所以里面没有this。

以上：编辑不易，点个赞吧！