小程序解析html網(wǎng)頁標(biāo)簽岔乔,有3種方法:
1:使用 wxParse 解析html
2:?jiǎn)为?dú)解析 html標(biāo)簽
3:使用最新的小程序組件 web-view
前段時(shí)間,微信正式宣布為方便開發(fā)者靈活配置小程序遭京,小程序現(xiàn)開放內(nèi)嵌 Web 頁面能力,但這個(gè)開放的能力也具有一定的局限性泞莉,小程序如果想要內(nèi)嵌網(wǎng)頁哪雕,那域名只能是自己公司的,對(duì)這個(gè)網(wǎng)站擁有控制權(quán)才可以鲫趁。
參考文檔:https://mp.weixin.qq.com/debug/wxadoc/dev/component/web-view.html
在小程序里面放入企業(yè)官網(wǎng)的步驟
1:新建項(xiàng)目
2:填寫小程序appid和文件在磁盤的位置
3:新建一個(gè)wxml
加入這段代碼:<web-view src="http://www.intmote.com/"></web-view>
問題:
小程序設(shè)置web-view業(yè)務(wù)域名斯嚎,解決“不支持打開非業(yè)務(wù)域名,請(qǐng)重新配置”問題
原因:我用的是個(gè)人的小程序
如果:“ 個(gè)人類型與海外類型的小程序暫不支持使用挨厚”てВ”
你需要先配置業(yè)務(wù)域名,但是個(gè)人類型的小程序疫剃,還不支持這個(gè)功能钉疫。
踩坑完畢
現(xiàn)在開始登陸公司小程序,加入公司小程序appid巢价,重復(fù)以上步驟牲阁,新建一個(gè)wxml
加入這段代碼:<web-view src="http://www.intmote.com/"></web-view>
無法打開是因?yàn)闃I(yè)務(wù)域名還沒有配置,那么進(jìn)入平臺(tái)壤躲,開始配置業(yè)務(wù)域名城菊。
在小程序官方后臺(tái)設(shè)置web-view的業(yè)務(wù)域名
繼續(xù)換了公司注冊(cè)的服務(wù)號(hào)小程序進(jìn)行測(cè)試
1:設(shè)置web-view域名前要做的準(zhǔn)備
- 需要小程序管理員掃碼驗(yàn)證
- 業(yè)務(wù)域名需要ICP備案
- ftp或者filezilla上傳工具:小程序需要驗(yàn)證你業(yè)務(wù)域名的所有權(quán),驗(yàn)證方法是碉克,上傳驗(yàn)證文件到你域名的根目錄凌唬。
2: 設(shè)置web-view域名流程和方法
1) 登錄小程序后臺(tái),依次選擇‘設(shè)置/開發(fā)設(shè)置’
2)在網(wǎng)頁中間會(huì)看到‘業(yè)務(wù)域名’板塊棉胀,小程序業(yè)務(wù)域名位置法瑟,點(diǎn)擊‘開始配置’按鈕
3) 填寫小程序業(yè)務(wù)域名
如果你有多個(gè)域名要添加冀膝,可以點(diǎn)擊 + 號(hào),我填寫的是:公司官網(wǎng):http://www.intmote.com
4)填寫好后霎挟,點(diǎn)擊‘下載檢驗(yàn)文件’
5)然后通過filezilla 把下載的文件上傳到前面填寫的網(wǎng)站根目錄
6)驗(yàn)證通過后窝剖,點(diǎn)擊‘保存’按鈕,即可完成業(yè)務(wù)域名配置
具體如下:
業(yè)務(wù)域名:www.inxxxxxte.com
校驗(yàn)文件名:pN76ECLf7Q.txt
校驗(yàn)文件已經(jīng)放到域名根目錄酥夭,且通過http://www.inxxote.com/pN76xxxxf7Q.txt可以訪問到文件內(nèi)容
http://www.intxxxote.com/pNxxECLf7Q.txt
7)小程序業(yè)務(wù)域名添加成功
8)引入官網(wǎng)之后的效果圖
注意:
可能會(huì)出現(xiàn)以下這樣的問題:保存時(shí)還是提示校驗(yàn)文件失敗赐纱。
可能原因
1.校驗(yàn)文件內(nèi)容錯(cuò)誤。校驗(yàn)文件內(nèi)容一般是非HTML數(shù)據(jù)熬北,如果下載下來的校驗(yàn)文件內(nèi)容為HTML數(shù)據(jù)疙描,一般為登錄態(tài)過期。請(qǐng)重新登錄小程序下載校驗(yàn)文件讶隐。
2.https證書過期起胰。請(qǐng)確保https證書處于有效期內(nèi)。
3.使用curl 測(cè)試鏈接巫延,確保curl能夠正常訪問鏈接效五。
4.請(qǐng)確保url中的文件名與下載下來的文件名大小寫一致。
如下載的文件是pN76ECLf7Q.txt炉峰,確保url是http://www.intmote.com/pN76ECLf7Q.txt畏妖,不能是http://www.intmote.com/pn76eclf7q.txt
自薦文章:
進(jìn)階攻略|前端最全的框架總結(jié)
web開發(fā)快速提高工作效率的一些資源
程序員如何利用空閑時(shí)間掙零花錢
幾款在線腦圖制作工具
一個(gè)前端妹子的悲歡編程之路
【程序員交友】祈澈姑娘:假裝文藝與代碼齊飛的前端妹子
進(jìn)階攻略|前端完整的學(xué)習(xí)路線
原文作者:祈澈姑娘
技術(shù)博客:http://www.reibang.com/u/05f416aefbe190后前端妹子,愛編程疼阔,愛運(yùn)營(yíng)戒劫,愛折騰。
堅(jiān)持總結(jié)工作中遇到的技術(shù)問題婆廊,堅(jiān)持記錄工作中所所思所見迅细,歡迎大家加入群聊,一起探討交流否彩。