小程序WebView實踐記錄

前言

小程序不能使用WebView一直是很大的痛點,終于在11月3日,開通了WebView支持的能力,于是開始了我的爬坑之旅。

文檔

web-view

業務域名

在配置業務域名的時候,下載了校驗文件,也放置在了網站根目錄,校驗碼已經可以訪問,但是審核驗證一直不通,如下圖所示:

0.png
0.jpeg

通過各種方式測試,猜測其驗證的內部機制。

1. 通過域名訪問,獲取到服務器ip地址
2. 通過ip下載校驗文件,比對校驗
3. 提交業務域名

因此,如果通過rancher等動態分配ip的docker化服務器,上述流程走不通的。
解決辦法:固定IP

WebView開發環境調試

現在已經可以通過小程序工具勾選web-view開發調試選項解決

之前解決思路

準備工具: charles

  1. 開啟charles -> proxy settings -> 設置proxy(比如:127.0.0.1:8888)
  2. 微信開發工具 -> 設置 -> 代理設置 -> 手動設置代理為(127.0.0.1:8888)
  3. 本地啟動一個https服務器,可以用webpack devserver實現
devServer: {
    hot: true,
    https: true,
    contentBase: path.resolve(root, 'dist'),
    publicPath: '/',
    port: 8080,
    proxy: {   //此處用來轉發webview中網絡請求,解決跨域問題
      '/api': {
        target: 'https://api.example.com',   
        changeOrigin: true,
      }
    },
    historyApiFallback: true,
    disableHostCheck: true
  }
  1. charles把安全的業務域名,映射到本地
1. charles -> mapRemote  https://m.example.com:443  到 https://m.example.com:8080
2. 修改本地host    127.0.0.1  m.example.com
最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容

  • Spring Cloud為開發人員提供了快速構建分布式系統中一些常見模式的工具(例如配置管理,服務發現,斷路器,智...
    卡卡羅2017閱讀 134,993評論 19 139
  • 目錄 - 簡書 楔子 那一年,我十七,他十八。以為愛了,那便是天長地久。卻忘了愛情從來都不是只有兩個人的世界。愛與...
    予渺閱讀 352評論 1 1
  • 健康一直是人們關注的問題,我校要舉行以“關愛健康”為主題的主題班會,請根據以下內容談談你的看法。 1.保持健康的重...
    咚呱英語培訓閱讀 286評論 0 0
  • 磚頭記 請你別擋住傻子的燦爛陽光,讓他快樂的歌唱!愿做一個流浪天涯的傻子,快樂地瘋癲人間。 關鍵詞:自食其力,樂觀...
    一枚冰兒閱讀 537評論 0 0
  • 這幾天,扎克伯格又火了,不論是至二女兒的那封“我負責改變世界,你負責享受童年”的信,還是與普莉希拉勢均力...
    媛滿閱讀 257評論 0 0