微信小程序中webview嵌套第三方页面无法打开。

20250622102142188-375ce58092bc28d66a038d175f9dcb7

根据了解,小程序官方webview有一些要求:

1、非个人用户 ,不开放给个人用户,需要企业主体认证。

2、需要https域名,不支持ip+端口,ICP备案24小时以上。

3、需要添加业务域名,添加业务域名需要将校验文件放到域名根目录。

官方解决办法:添加业务域名

1、打开微信公众平台,登录需要对应的小程序,找到开发管理-业务域名。

20250622102323787-56ad0a4df794f836bd64d1e5064f8be

2、点击添加或者修改按钮,管理员账号扫码验证后下载校验文件,将校验文件放到需要添加的业务域名的根目录,之后点击保存便会进行业务域名校验,如果校验通过便能保存成功,不通过会提示对应的校验信息。

20250622102431523-image

3、如果以上步骤都完成那么业务域名就正常添加,之后便可以从小程序中使用web-view了。

<template>
    <view>
    <!-- 用百度举例-->
    <web-view src="https://www.baidu.com"></web-view>
    <view>
<template>

使用以上代码便可直接展示百度的主页。

官方方法标准且好用!

但是,如果如果真的是百度、腾讯等第三方真的会给提供业务域名校验吗?不是所有第三方都这么友好吧,接下来我就说下第二种方法,也是我实际应用而且有效的方法。

Nginx转发(非官方)

举例,我自己的域名是https://mywebsite.com,我要从通过web-view打开百度官网https://www.baidu.com

1、按照官方的方法将自己的域名https://mywebsite.com添加到小程序的业务域名。

2、配置nginx,当小程序访问https://mywebsite.com是时经过转发实际访问的是https://www.baidu.com,如果第三方页面页面有一些子目录和路径传递的参数也可以。

20250622102706466-image

3、nginx配置完成后重新加载nginx的配置文件

./nginx -s reload

4、小程序访问第三方页面前,将第三方的域名替换为自己服务器的域名。

onLoad() {
    this.url.replace('www.baidu.com', 'mywebsite.com');
  },

经过以上步骤就可以正常访问第三方页面了。

需要注意,如果访问的第三方页面是域名的子目录,比如www.baidu.com/h5,而这个页面中有一些css、js、以及图片文件,所在的目录是www.baidu.com/css等目录,也需要将这些的静态资源目录从nginx中转发,如果不配置页面中的内容无法正常展示(能打开页面不会提示无法打开,但因为没有css样式和图片可能显示空白页面,只有一个标题)

20250622102810495-image

 

还有就是nginx配置不能使用重定向,如果使用重定向微信小程序还是能够检测出来没有添加业务域名,同样无法访问,nginx配置完成之后可以先从浏览器访问下地址,如果访问之后浏览器地址栏地址没有变化说明没有重定向。

以上就是我前几天遇到的问题以及处理方式,目前小程序中使用web-view可以正常使用,也没有添加第三方的业务域名。

以上内容如果有误希望大佬可以批评指正。

🎀 🌸

📜 重要提示:
如有解压密码:看下载页、看下载页、看下载页。
源码工具资源类具有可复制性: 建议具有一定思考和动手能力的用户购买。
请谨慎考虑: 小白用户和缺乏思考动手能力者不建议赞助。
虚拟商品购买须知: 虚拟类商品,一经打赏赞助,不支持退款。请谅解,谢谢合作!
邻兔跃官网:lt.lintuyue.com(如有解压密码看下载页说明)。

文章版权声明 1、本网站名称:邻兔跃lT
2、本站永久网址:https://lt.lintuyue.com/
3、本站内容主要来源于互联网优质资源整合、网友积极投稿以及部分原创内容,仅供内部学习研究软件设计思想和原理使用,学习研究后请自觉删除,请勿传播,因未及时删除所造成的任何后果责任自负,如有侵权,请联系站长进行删除处理。
4、本站一切资源不代表本站立场,并不代表本站赞同其观点和对其真实性负责。
5、本站一律禁止以任何方式发布或转载任何违法的相关信息,访客发现请向站长举报
6、本站资源大多存储在云盘,如发现链接失效,请联系我们我们会第一时间更新。
© 版权声明
THE END
喜欢就支持一下吧
点赞12 分享
评论 抢沙发

请登录后发表评论

    暂无评论内容