微信小程序的組件web-view推出有一段時間了,這個組件的推出可以說是微信小程序開發(fā)的一個重要事件,讓微信小程序不會只束縛在微信圈子里了,打開了一個口子,這個口子或許還比較小,但未來有無限可能。

簡單思考
1.通過web-view嵌入網(wǎng)頁功能開放,給微信小程序的發(fā)展帶來無限的可能,有好,也有壞,但利大于弊。好處在于讓微信的開放性更強(qiáng),無論將來混合模式和還是純H5都有更多的機(jī)會在微信這個大舞臺有表演機(jī)會。壞處可能就是也打開了漏洞之門,會有更多魚龍混雜情況出現(xiàn),這對微信的生態(tài)圈是個挑戰(zhàn)。
2.這個口子的打開,再關(guān)上的可能性就不大了,而且只能越大越開,按照微信的節(jié)奏,微信應(yīng)該有足夠把握才會開放這個功能,一切都在微信的掌控當(dāng)中。
3.大量基于h5的網(wǎng)站或應(yīng)用都會被“小程序化”,微信這個“大”瀏覽器成為移動互聯(lián)網(wǎng)海量流量的入口。微信搜索會不會成為移動搜索的絕對先進(jìn)的搜索?
4.對前端工程師這個職業(yè)帶來巨大的影響,降低了開發(fā)小程序的成本,讓前端工程師更關(guān)注網(wǎng)頁的架構(gòu),減小微信小程序的總體開發(fā)壓力。
5.讓熱部署、熱更新更為簡單,原來調(diào)整小程序風(fēng)格和布局需要重新審核和發(fā)布,這個周期有些長。有了
web-view
后,基于它開發(fā)的頁面,可以隨時改變外觀、布局、數(shù)據(jù)。
簡單實踐
1.web-view里內(nèi)嵌的域名域名在小程序管理后臺設(shè)置業(yè)務(wù)域名,注意是
業(yè)務(wù)域名
,不是服務(wù)器域名。另外個人小程序目前是沒有這個設(shè)置,因此也就無法使用這個功能。
2.一個頁面(wml)只能放置一個web-view,且會覆蓋其他的組件鋪滿屏幕,這時候你就當(dāng)微信小程序是個瀏覽器好了。
3.web-view打開的頁面必須是支持https的。
4。目前支持的jssdk接口還比較少,只支持“圖像接口”,“音頻接口”,“智能接口”,“設(shè)備信息”,“地理位置”,“搖一搖周邊”,“微信掃一掃”,“微信卡券”,“長按識別”,比如獲取用戶信息,微信支付之類都不行,我猜以后會慢慢放開,逐步達(dá)到微信公眾號的開放程度。
5.支持iframe ,最開始還不需要域名白名單(業(yè)務(wù)域名),后來把這個漏洞給補(bǔ)上了,不給人濫用的口子了。如果你頁面上有g(shù)oogle adsense可以要注意了,如果使用的蘋果版微信,用web-veiw打開含有g(shù)oogle adsense就會報錯(有的安卓偶爾也會報錯,原因不明),因為google adsense會虛擬一個iframe出來,google的域名自然不會在你的業(yè)務(wù)域名里,就會報錯。
6.如果你的網(wǎng)站做了302跳轉(zhuǎn),跳轉(zhuǎn)的域名也要設(shè)置在業(yè)務(wù)域名里,別想著雞賊,能躲過這個配置。
7.通過內(nèi)嵌網(wǎng)頁的功能可以實現(xiàn)站內(nèi)鏈接的跳轉(zhuǎn),當(dāng)然不是小程序頁面的跳轉(zhuǎn),而是在小程序里打開網(wǎng)頁,雖然感覺上有些別扭,不過總算彌補(bǔ)了無法跳轉(zhuǎn)的麻煩,對資訊類的小程序是很好的功能。
8.通過在onload里的options.url 參數(shù)可以解決分享web-view頁面加載的問題,不過需要對options.url 通過decodeURIComponent進(jìn)行解碼,因為在分享轉(zhuǎn)發(fā)的時候,微信小程序?qū)rl的特殊字符進(jìn)行了十六進(jìn)制編碼,因此需要通過decodeURIComponent來解碼,小程序的web-view頁面才能正常加載。
9.web-veiw頁面有時候無法觸發(fā)onShareAppMessage方法,原因不明。如果有非web-view的頁面和web-view同時存在的小程序,如果是非web-view的頁面跳轉(zhuǎn)到web-view頁面,在轉(zhuǎn)發(fā)web-view頁面的時候無法觸發(fā)onShareAppMessage方法。如果有非web-view的頁面和web-view同時存在的小程序,如果是非web-view的頁面跳轉(zhuǎn)到web-view頁面,在轉(zhuǎn)發(fā)web-view頁面的時候無法觸發(fā)onShareAppMessage方法。
10.web-veiw頁面 無法使用“打開調(diào)試”功能,如果需要看調(diào)試,需要返回上一個不使用web-view的頁面查看。
11.web-view 嵌入的網(wǎng)頁里如果有白名單以外的域名鏈接,點(diǎn)擊后會報錯。
12.web-view不支持微信支付,但web-view內(nèi)嵌的頁面使用了公眾號授權(quán)的微信支付,是可以在內(nèi)嵌的頁面使用微信支付的。換句話說,如果如果用web-view內(nèi)嵌公眾號的h5頁面,利用JSSDK是可以使用微信支付的。