微信小程序web-view不支持打开非业务域名https //XXXX 请重新配置

原创 已于 2022-10-19 16:52:52 修改 · 1w 阅读 · 5 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#微信小程序 #webview

于 2022-03-31 22:03:53 首次发布
本文揭示了微信公众平台个人类型小程序使用web-view的挑战，需注意业务域名配置，并解释了企业小程序的必要性。

微信小程序提供web-view，可以在小程序中加载网页
我在微信公众平台中的开发管理—》开发设置中对于服务器域名中的request合法域名进行了正确设置，但是在微信开发者工具中仍然无法跳转网页，显示不支持打开非业务域名https //XXXX 请重新配置
在这里插入图片描述
## 解决方法
网上查找了很久资料，后来在官方文档中发现了问题所在，配置服务器域名是不够的，需要管理后台中配置业务域名
官方介绍文档在这里
在这里插入图片描述
但是还有一个最大的问题,个人类型的小程序暂不支持使用 orz 我的小程序是个人类型，web-view仅支持企业小程序，个人的小程序是不能使用的…
在这里插入图片描述
个人在未发布前，是可以在微信开发者工具中将下图选项勾选，使用web-view的，但是如果想要上线发布还是需要有企业小程序
在这里插入图片描述

微信小程序 - 详细解决web-view公众号文章或第三方网站分享转发后打开失败，页面显示“无法打开该页面，不支持打开“、“页面不存在“报错提示，苹果IOS系统手机打开是空白页，安卓手机系统会有提示！
🏆 前端领域优质创作者
08-22 1万+
微信小程序，公众号文章，第三方H5网页，内嵌网站分享后打不开，web-view，页面分享，小程序里公众号文章转发后无法打开，白屏，页面空白什么都没有，不支持打开，无法打开该页面，页面不存在，业务域名配置好了还是不行，公众号和小程序已经关联，iOS端苹果真机打开空白页，安卓手机，页面分享后，用户打不开提示错误，提示页面不存在，如何解决页面提示无法打开该页面，微信小程序web-view无法打开该页面不支持打开的解决方法，无法打开该页面不支持打开，最新详细解决方案，分享之后无法打开页面，提示无法打开该页面,不支持
【微信小程序】webview不支持打开非业务域名
疾术客
06-11 2万+
webview标签是一个内置组件，用途：承载网页的容器。会自动铺满整个小程序页面。 谨记：个人类型的小程序暂不支持使用。并且打开的链接必须是https开头的，否则还是会报错。 当你写好代码之后准备测试跳转的时候BUG出来了，它会提示你无法打开如下图 此时你只需要进入微信公众平台 然后找到一个业务域名的配置区域就可以了，配置好域名之后你就可以，打开你要跳转的H5页面链接了。对了...
微信小程序web-view组件 打开外部url
Cindy
07-30 2万+
在测试时需要给swiper组件添加外部链接问题。今天我来说一下怎么解决的？ 思路：小程序里没有办法直接给swiper组件添加链接，点击时用api wx.navigateTo实现的。 微信小程序团队推出一个新组件web-view， 可以在这个组件中打开你的html5网页， 而且可以在web-view里面打开网页的a标签， 也就是说可以实现链接跳转。 例如： wxml 内容 <...
微信小程序开发实战指南（三）-- Webview访问总结
dazhong2012的专栏
10-15 1793
微信小程序开发中，业务域名配置和Webview使用存在严格限制。业务域名必须使用HTTPS协议且完成ICP备案，个人账号不支持web-view组件。配置需通过小程序后台验证文件，最多可配置200个域名。访问微信公众号文章时，传统方法受限，应使用wx.openOfficialAccountArticle API。开发中需注意H5通信、性能优化和安全问题，如预加载策略、缓存管理和敏感信息保护。常见问题包括校验文件访问和备案生效延迟等，建议采用官方方案并做好兼容性处理。
小程序web-view无法打开该页面的解决方法
我是小鹏呀的博客
06-28 1万+
把文件给后端，后端部署服务器，部署完后，可以直接访问该文件。例如：业务域名为https://baidu.com，下载下来的文件名为test.txt，后端部署完成后，可以确保https://baidu.com/test.txt可以访问。问题：开发者工具可以正常打开，正式上线版小程序使用 web-view 组件测试时提示：“无法打开该页面，不支持打开。解决方法：需要配置业务业务域名，在微信公众平台-开发-开发管理-业务域名。，请在“小程序右上角更多->反馈与投诉”中和开发者反馈。
小程序使用web-view无法打开该H5页面不支持打开的解决方法
文龙刚的博客
12-19 1万+
（4）校验文件放置好后，点击保存按钮。校验成功后，输入的域名就会显示在业务域名中了，这就表示业务域名配置成功了。注意：业务域名（即需要跳转的域名）需经过ICP备案，新备案域名需24小时后才可配置，并且是以https开头的。后，才能支持跳转任意外部链接。（需要跳转到哪个外部链接，就将那个链接配置为业务域名。（3）输入需要跳转的域名，然后点击下载校验文件，并将文件放置在需要跳转的域名的根目录下。（2）然后进入【开发-开发设置-业务域名】中，开始配置业务域名。（1）从微信公众平台，登录微信小程序的帐号。
【小程序】小程序webview不支持打开非业务域名请重新配置
程序员老狼专注开发aigc或客服系统应用
08-10 2391
当我在项目里面使用webview内嵌一个我自己的页面时，报错 小程序不支持打开非业务域名请重新配置 首先必须是企业小程序，才能使用webview，个人的不支持使用 可以在本地打开去掉验证进行测试，上线时使用企业小程序 需要在后台的业务域名中增加配置 ...
微信小程序提示「不支持打开非业务域名」的几个常见原因和分析解决方案
上善若水-架构师编程乐园
03-04 2万+
1. 问题提出 最近在微信小程序开发群里碰到不少哥们碰到这个问题： 微信小程序提示「不支持打开非业务域名」的问题，现象如下图： But，这里必须有个But，但是很多人都说自己已经在小程序的MP后台配置了业务域名，如下图： 2. 问题分析 咱们自己看下提示信息： 注意看是提示的域名是http://xxxx.xxx.com这种格式，而后台配置的是https 诉主也明确表示，他web-view里的src就是用https://xxxx.xxx.com的访问方式的，所以不应该出现http域名的提
微信小程序 - 不在以下 uploadFile 合法域名列表中，请参考文档，微信小程序已经配置了uploadFile合法域名但还是报这个错误（小程序授权给第三方以后，不在uploadFile合法域名）
🏆 前端领域优质创作者
11-09 3770
开发微信小程序时，提示不在以下 uploadFile 合法域名列表中怎么办，不在以下合法域名列表中，请参考文档：https，小程序 错误提示： “xxxx 不在以下 request/uploadFile 合法域名列表中，请参考文档 xxx”运行程序的时候提示如下错误，uniapp微信小程序报错不在以下uploadFile合法域名列表中，明明已经配置了还不行，微信小程序授权给第三方以后，报错不在uploadFile合法域名列表，求救不在以下 uploadFile 合法域名列表中怎么解决，这个错误通常发生在上传
合法域名和业务域名的微信小程序
m0_64012205的博客
11-08 527
在微信小程序的开发过程中，当需要请求第三方网站数据时，都是直接调用wx.request接口的： xxxx:function(){ wx.request({ url: 'xxxxxxxxxx', data: {}, header: { 'content-type': 'application/json' }, success: function (res) { console.log("success!"); } }) } 10
微信小程序开发之webview组件内网页实现微信原生支付
u013401630的专栏
01-06 2万+
前言、背景 本人目前的工作岗位是安卓工程师，在这之前对于前端和后台的知识基本是白纸，只是在日常的工作项目中有需要和小伙伴进行对接的时候接触了那么一丢丢，对于前端和后台的一些专业描述和理解有不当之处还请各位指正。 目前部门的主营项目是一个电商项目，在本人入职之前整个项目系统的主营业务流程已经完备，也已经在正式运营，不过因为各种原因平台主要是在PC端和微信公众号进行运营。小程序其实出来的挺
豆包 微信小程序嵌入 HTML5（网页）主要通过 web-view 组件 实现，这是小程序官方提供的唯一原生方案
最新发布
m0_37843156的博客
12-26 532
web-view 是小程序承载网页的容器，可直接加载在线 HTML5 页面（不支持本地 HTML 文件），支持大部分 H5 特性，且能实现小程序与 H5 的双向通信。2. 点击「修改」，上传微信官方提供的 校验文件 （需将文件放在 H5 域名的根目录，如 https://xxx.com/MP_verify_xxxx.txt ）；// web-view 唯一标识。- 仅支持配置过的「业务域名」下的链接，不支持第三方域名（如 https://baidu.com ，除非添加到白名单）；
微信小程序webview打开第三方页面
张营的技术博客
12-19 3163
微信小程序webview打开第三方页面
微信小程序通过Webview打开外部网站
蒙双眼看世界
11-06 8594
微信小程序是支持访问第三方网站，但前提是第三方网站得允许访问，因此要在第三方网站的根目录下添加“业务域名”这个时候，就可以在小程序内通过web-view来访问第三方网站了。登陆小程序后台，找到开发设置，添加要访问的第三方网站。先配置校验文件到第三方网站根目录下。
微信小程序使用webview打开第三方地址
qq_43039004的博客
06-17 3502
（地址后拼接参数需要转码）
微信小程序 web-view 无法外链 和 不支持打开非业务域名
木木夕石 的博客
10-20 1万+
微信小程序 web-view 无法外链 和 不支持打开非业务域名 这个问题搞了我一下午啊, 终于解决了, 简直太菜了, 还是要多学习啊. 首先, 链接组件主要有两个: navigator 和 web-view navigator 只能跳转到小程序内的页面, 不能直接跳转外链 (例如: 百度, 淘宝什么的网页都不能跳). 说白了, 就是只能小程序内部跳来跳去的. web-view 可以跳转小程序外的页面, 但有个前提, 需要在微信公众平台先设置好 业务域名 + 校验文件 (就是你要跳的网站域名). 这
微信小程序使用web-view页面显示打开外部链接
fanglege的博客
09-20 830
微信小程序跳转外部链接需通过web-view组件实现，但需满足https协议、配置业务域名并上传校验文件。开发者可先弹窗询问用户是否跳转，确认后将链接存入缓存并导航至web-view页面。若无法满足配置条件，建议将链接复制到剪切板，由用户在外部浏览器打开。具体操作包括：在业务域名配置校验文件，并使用wx.navigateTo跳转含web-view的页面，或通过wx.setClipboardData复制链接供用户手动访问。
在微信小程序中展示 H5 页面
热门推荐
花铛
11-27 3万+
承载网页的容器，会自动铺满整个小程序页面。web-view中导航栏的标题是取的页面<title>标签的内容。web-view中无法调起微信支付。
微信小程序web-view无法打开该页面不支持打开的解决方法
qq_42351675的博客
01-24 1万+
我在正式上线版小程序使用web-view组件测试时提示：“无法打开该页面，不支持打开 https://xxxxxx，请在“小程序右上角更多->反馈与投诉”中和开发者反馈。” 奇怪的是，“真机调试”、“开发模式”都可以使用web-view组件访问我需要的路径。只有“体验版”、“线上版本”会出现这个错误提示。
微信小程序，如何配置，实现内网访问，接口是ip地址+端口号
02-26
<think>嗯，用户问的是如何在微信小程序里配置实现内网访问，接口是IP地址加端口号。这个问题看起来涉及到小程序的网络请求配置和服务器设置。首先，我需要回想一下微信小程序的限制，尤其是关于网络请求的部分。 微信小程序要求后端接口必须使用HTTPS，并且域名需要备案，还要在小程序管理后台的request合法域名中添加。但是用户提到的是内网访问，也就是可能使用本地IP和端口，比如192.168.x.x或者localhost。这时候可能的问题是小程序在真机调试时能否访问本地服务，或者有没有办法绕过域名的限制。 我记得在小程序开发工具中，可以勾选“不校验合法域名、web-view（业务域名）、TLS 版本以及HTTPS证书”，这样在开发工具里可以访问本地服务。但真机调试的时候，这个选项可能不起作用，还是需要配置合法域名。不过用户可能需要内网测试，可能没有备案的域名，这时候可能需要其他方法。 另外，微信小程序对于本地IP和未备案的域名是不允许的，所以常规方法可能行不通。可能的解决方案包括： 1. 使用内网穿透工具，比如ngrok、frp，将本地服务映射到一个外网域名，并配置HTTPS。这样可以将内网的IP+端口转换为一个合法的域名，然后在小程序后台配置这个域名。但需要用户有外网服务器或者使用第三方服务。 2. 在微信开发者工具中设置代理，或者修改小程序的请求地址为本地IP，但真机上可能无效，只能在开发阶段使用。 3. 如果是企业或学校内网，可能有内部域名和HTTPS证书，可以申请内部域名并配置到小程序后台。 不过用户可能是在开发阶段需要真机调试访问内网服务，这时候可能需要开启开发工具的不校验选项，并且在手机和电脑连接同一局域网的情况下，使用电脑的IP地址加端口。例如，在开发工具中设置项目设置里的“不校验合法域名”，然后在代码里写http://电脑IP:端口号/api，这样在真机调试时，手机通过局域网访问电脑的服务。 但需要注意，小程序真机调试时，手机必须和服务器在同一局域网，且服务器的防火墙要允许该端口访问。同时，微信可能会在后续版本中加强限制，这种方法可能不稳定。 另外，用户可能需要了解如何配置小程序的网络请求，比如在app.js中设置全局的baseUrl，根据环境切换开发和生产环境的接口地址。或者使用条件编译，在开发环境下使用IP地址，生产环境使用正式域名。 可能还需要提醒用户，正式上线的小程序必须使用备案过的HTTPS域名，内网访问仅限于开发和测试阶段，不能用于线上环境。如果用户需要长期内网使用，可能需要通过企业微信的小程序或其他私有化部署方案，但具体情况可能更复杂。 总结来说，解决方案可能包括使用内网穿透工具配置合法域名，或者在开发阶段通过修改设置和同一局域网访问。需要分步骤指导用户如何操作，并指出可能的限制和注意事项。</think>在微信小程序中实现内网访问（使用 IP 地址 + 端口号的接口），需注意小程序的网络安全限制。以下是具体配置方法和注意事项： --- ### **核心限制与解决方案** 1. **微信小程序的网络请求限制** - **必须使用 HTTPS**：小程序要求所有网络请求必须通过 HTTPS 协议（本地开发可临时关闭校验）。 - **域名白名单**：需在[微信公众平台](https://mp.weixin.qq.com)的 **开发管理 → 开发设置 → 服务器域名** 中添加合法域名（不支持 IP + 端口）。 **因此，直接使用 `http://192.168.x.x:8080` 会报错**。需通过以下方式绕过限制： --- ### **方法 1：开发环境临时调试（仅限本地测试）** #### **步骤** 1. **启用开发工具不校验域名** - 在微信开发者工具中，进入 **详情 → 本地设置**，勾选以下选项： ✅ 不校验合法域名、Web-view（业务域名）、TLS 版本及 HTTPS 证书 ![微信开发者工具设置](https://example.com/path/to/image) *（注：此处仅为示意）* 2. **配置本地服务支持 HTTPS**（可选但推荐） - 若后端接口为 HTTP，可通过工具（如 `mkcert`）生成本地 HTTPS 证书，或使用反向代理（如 Nginx）将 HTTP 转为 HTTPS。 3. **手机真机调试** - 确保手机与电脑在同一局域网。 - 在代码中使用电脑的局域网 IP（非 `localhost`），例如： ```javascript wx.request({ url: 'https://192.168.1.100:8080/api/data', // 替换为实际 IP 和端口 // ... }) ``` - 手机扫描开发者工具中的“真机调试”二维码，完成测试。 --- ### **方法 2：内网穿透 + 域名映射（长期方案）** 若需长期内网访问（如团队测试），需将内网服务映射为外网域名，并配置 HTTPS。 #### **步骤** 1. **使用内网穿透工具** - 工具示例：**Ngrok**、**frp**、**花生壳**等。 - 以 Ngrok 为例： ```bash ngrok http 8080 # 将本地 8080 端口映射为公网域名（如 https://xxxx.ngrok.io） ``` 2. **配置合法域名** - 将生成的域名（如 `https://xxxx.ngrok.io`）添加到微信公众平台的 **服务器域名** 白名单中。 3. **小程序代码中调用** ```javascript wx.request({ url: 'https://xxxx.ngrok.io/api/data', // 使用映射后的域名 // ... }) ``` --- ### **方法 3：企业级私有化部署（高级场景）** 适用于企业内网正式环境，需结合以下方案： 1. **自建 HTTPS 证书**：在内网部署受信任的 CA 证书。 2. **域名解析**：在内网 DNS 服务器中配置私有域名（如 `api.internal.com`）。 3. **小程序后台配置**：将域名添加到微信公众平台的服务器白名单。 --- ### **注意事项** 1. **正式环境必须使用备案域名**，仅限开发或企业内网场景临时使用 IP。 2. **避免使用常见端口（如 80、443）**，防止与系统服务冲突。 3. **真机预览/体验版仍受域名限制**，需通过内网穿透或合法域名解决。 --- ### **示例代码（本地调试）** ```javascript // app.js const isDev = true; // 开发环境开关 const BASE_URL = isDev ? 'https://192.168.1.100:8080' : 'https://api.yourdomain.com'; wx.request({ url: `${BASE_URL}/api/data`, method: 'GET', success(res) { console.log('请求成功:', res.data); } }); ``` --- 通过上述方法，可实现在微信小程序中访问内网 IP + 端口号的接口。建议开发阶段使用方法 1 快速调试，正式环境优先使用方法 2 或 3。
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
表情包 代码片
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

几度热忱

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值