中提到,web-view组件是一个可以用来承载网页的容器,会自动铺满整个小程序页面。web-view的出现,可以缓解小程序size告急的问题。
web-view的使用方法:!--wxml--!--指向微信公众平台首页的web-view--web-viewsrc="https://mp.weixin.qq.com/"/web-viewsrc是一个网站的url,默认值是none,webview指向网页的链接。
web-view是如何进行小程序和h5通信的:1.小程序到web-view:本质上WEB-VIEW也是小程序的一个页面,所以小程序到web-view是正常的小程序间的通信,通过wx.navigateTo、wx.redirectTo,带上url参数,query参数就像正常url的参数一样跟着后面,然后在web-view的页面的Page实例里面通过onLoad的方法的参数来获取url的值,设置给web-view的src属性为改值即可。
//点击banner进入页面详情goPageDetail(e){const{url,h5}=e.currentTarget.dataset;if(url!=='/'){wx.navigateTo({url});}else{wx.navigateTo({url:`/pages/article/webview/index?h5=${h5}`});}},
2.web-view到小程序:由于在web-view的跳转通常是在src对应的网页中的操作来处理的,所以需要结合jssdk来处理,不需要wx.config配置,直接通过script标签来引入https://res.wx.qq.com/open/js/jweixin-1.3.0.js,就可以使用wx.miniProgram.navigateTo、wx.miniProgram.navigateBack、wx.miniProgram.switchTab、wx.miniProgram.reLaunch、wx.miniProgram.redirectTo接口,就像小程序之间的跳转一样,单是只能在当前小程序页面内跳转。
!DOCTYPEhtmlhtmllang="en"headmetacharset="UTF-8"metaname="viewport"content="width=device-width,initial-scale=1.0"metahttp-equiv="X-UA-Compatible"content="ie=edge"titleh5跳转到小程序页面/title/headbodydivpthisish5页面。/pbuttontype="button"id="btn"返回小程序/button/divscriptsrc="https://test.com/jquery.js"/scriptscriptsrc="https://res.wx.qq.com/open/js/jweixin-1.3.0.js"/scriptscript/eslint-disable/$(function(){$('#btn').on('click',function(s){wx.miniProgram.navigateTo({url:'/pages/index/index?id=xxx',success:function(){console.log('success')},fail:function(){console.log('fail');},complete:function(){console.log('complete');}});});});/script/body/htmlweb-view中踩的坑:1.打开的域名没有在小程序管理后台设置业务域名(注意是业务域名,不是服务器域名)2.打开的页面必须为https服务3.打开的页面302过去的地址也必须设置过业务域名4.web-view空白问题,请升级微信客户端到6.5.165.页面可以包含iframe,但是iframe的地址必须为业务域名6.web-view不支持支付能力,web-view的API能力见web-view的文档说明7.开发者自己检查自己的https服务是否正常,测试方法:普通浏览器打开对应的地址8.如果web-view使用了公众号授权的服务,开发者工具提示网页开发者的问题,请见:
最新资讯
-

小程序制作平台选型踩坑记录:2026年五大主流方案横向对比
2026 年微信小程序月活达 10.7 亿、覆盖 108 个行业,本次横向对比即速应用、乔拓云、凡科、有赞、微盟五大主流平台,分三阶段给出选型结论,核心聚焦成本、扩展性、运营能力三大维度。 -

即速应用,赋能企业玩转微信小程序智慧经营
作为国内领军的智慧商业经营服务商,即速应用始终秉承“让每个企业都拥有自己的智慧店铺”的愿景,持续赋能更多企业玩转智慧经营。即速应用旗下拥有“小程序搭建工具-即速应用”、“私域流量专家-即客云”等产品,帮助商家打通互联网全生态营销闭环。 -

即客云2.0重磅更新,让微信小程序运营更简单!
即客云作为一款基于企业微信的第三方工具,现从多维度提供超过30种功能,自上线以来,已服务多家企业,受到一致好评。近期,我们根据客户反馈和市场调研正式推出升级版 即客云2.0!更新了私域运营SOP,群日历功能,批量拓客,客户雷达,消息推送,个人欢迎语,帮助企业更好运用企业微信;同时提升了社群运营工作标准化,提升运营效率,帮助企业实现客户增长,玩转私域流量。










