微信小程序 web-view 無法外鏈 和 不支持打開非業務域名

這個問題搞了我一下午啊, 終于解決了, 簡直太菜了, 還是要多學習啊.

首先, 鏈接組件主要有兩個: navigator 和 web-view
navigator 只能跳轉到小程序內的頁面, 不能直接跳轉外鏈 (例如: 百度, 淘寶什么的網頁都不能跳). 說白了, 就是只能小程序內部跳來跳去的.

web-view 可以跳轉小程序外的頁面, 但有個前提, 需要在微信公眾平臺先設置好 業務域名 + 校驗文件 (就是你要跳的網站域名). 這也意味著, 想要跳轉到指定網頁, 必須將校驗文件放到業務域名的服務器根目錄下才行. 說白了: 只能跳轉到自家的web服務器頁面, 想跳別人的家網頁, 除非你能把校驗文件給放進去

小結: 想要用外鏈, 就使用 web-view

---

用了外鏈后, 錯誤提示: 不支持打開非業務域名.....
解決方案: 只要在微信公眾平臺綁定一下外鏈 (業務域名)就可以了

解決步驟:

確認要跳轉的業務域名
我要跳轉的外鏈是 https://www.omso2o.com/xxxxxxx, 所以業務域名為 https://www.omso2o.com

登錄微信公眾平臺
地址: https://mp.weixin.qq.com
依次找到 開發 -> 開發設置 -> 業務域名

上圖中, 一定要先把 檢驗文件 上傳到業務域名所在的服務器根目錄下, 才能點上傳, 否則一直提示你失敗, 檢驗不通過.

跳轉代碼
情景: 點擊文件A的鏈接跳轉到外部網頁
文件A不能直接使用 web-view 組件, 因為這樣不用點擊, 就會自動跳轉到網頁.
所以, 先創建一個目錄, 比如outUrl目錄, 并新建一個文件Bprotocal.vue, 文件中里面用 web-view 跳轉到外部網頁
文件B : 文件A 則通過navigator 跳轉到outUrl 目錄下的protocal.vue文件, 這樣就可以了

文件A :

---

順便說一下我遇到的其他問題:

Appid 不要在用測試Appid了, 一定要用小程序的真實的Appid. 我當時用測試Appid嗨了半天.

如果上面的操作完了, 但依舊提示不支持打開非業務域名..., 可以嘗試重啟微信開發者工具

總結

以上是生活随笔為你收集整理的微信小程序 web-view 无法外链 和 不支持打开非业务域名的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。