1）微信公眾平臺(tái)，登錄小程序賬號(hào)

2）左側(cè)-設(shè)置-開發(fā)設(shè)置-業(yè)務(wù)域名-配置

3）小程序管理員微信掃碼
 

4）填寫小程序業(yè)務(wù)域名，域名需ICP備案
 

5）下載校檢文件上傳至服務(wù)器指定目錄，保存

6）小程序業(yè)務(wù)域名配置完成

7）打開微信開發(fā)者工具，添加小程序項(xiàng)目





進(jìn)入開發(fā)畫面

我們修改當(dāng)前的index畫面

將其他代碼都刪除

在容器中,添加一個(gè)web-view

給這個(gè)web-view添加src屬性

這里添加一篇百度經(jīng)驗(yàn)的地址

完成的web-view代碼如下

<web-view src="https://jingyan.baidu.com/article/0a52e3f4f60facbf63ed7269.html">

</web-view>

1）業(yè)務(wù)域名需ICP備案，新域名備案24小時(shí)后即可配置，域名不支持IP地址及端口號(hào)

2）下載校檢文件，上傳至服務(wù)器指定根目錄

3）開發(fā)者工具最新版-基礎(chǔ)庫版本1.6.4


觀看此功能視頻教程請(qǐng)點(diǎn)擊：https://www.zhihu.com/question/67564075/answer/258773999

參考圖文教程：https://jingyan.baidu.com/article/3f16e0032402b42591c103bd.html

微信小程序源碼可以使用官方的demo修改：https://developers.weixin.qq.com/miniprogram/dev/demo.html

也可以使用 WebchatShare項(xiàng)目 該項(xiàng)目是帶分享頁面功能的 并且可以跳轉(zhuǎn)網(wǎng)頁分享的頁面

需要修改一下頁面配置 這個(gè)主頁進(jìn)入是歡迎頁
  http://www.aicontent.cn/jzzs/685.html

另外還可以直接使用狐靈科技這邊打包好的 這是對(duì)于不想研究的 直接使用的
可以看這篇地址的文末有下載地址
http://www.aicontent.cn/hulianwang/688.html
 

另外總結(jié)一下使用web-view的心得


1、內(nèi)嵌網(wǎng)頁的域名需要在小程序管理后臺(tái)設(shè)置為業(yè)務(wù)域名，也就是需要先加入白名單 
一個(gè)小程序最多可以添加 20 個(gè)業(yè)務(wù)域名，且一年只可修改 50 次業(yè)務(wù)域名。 

2、內(nèi)嵌的網(wǎng)頁用起來跟微信內(nèi)打開體驗(yàn)差不多，下拉也會(huì)顯示“網(wǎng)頁由 XX 域名提供” 

3、內(nèi)嵌的網(wǎng)頁可以播放視頻，但是視頻必須是在白名單域名內(nèi)的 
我測(cè)試把視頻放在七牛，就無法播放，一直在加載中。 

3、內(nèi)嵌的網(wǎng)頁可以嵌入 iframe，而且 iframe 打開的頁面可以不在白名單內(nèi) 
iframe 我試了百度首頁，淘寶寶貝詳情頁，我自己的另一個(gè)不在白名單域名下頁面，都能夠打開。 
這應(yīng)該是 bug 而不是 feature。 

4、內(nèi)嵌網(wǎng)頁想與小程序通信，只能通過 JSSDK，但是目前只開放了部分接口，具體看開發(fā)文檔 
也就是如果你之前基于微信服務(wù)號(hào)授權(quán)做的頁面，就沒辦法直接在小程序內(nèi)嵌網(wǎng)頁使用了，因?yàn)闆]辦法授權(quán)。 

5、但是，如果已經(jīng)微信打開并且授權(quán)過的頁面，在小程序打開也是登錄狀態(tài) 
也就是說，微信內(nèi)置瀏覽器和小程序內(nèi)置瀏覽器其實(shí)是同一個(gè)實(shí)例，至少都共享 cookie 了 
我剛才特意測(cè)試過，一開始用小程序內(nèi)嵌網(wǎng)頁打開一個(gè)需要服務(wù)號(hào)授權(quán)的頁面，結(jié)果一片空白，然后退出小程序，用微信打開頁面，授權(quán)之后，再打開小程序，就是已授權(quán)狀態(tài)了