微信小程序 - webview 动态加载(网页) 以及加载域名的限制

本文涉及的产品
.cn 域名,1个 12个月
简介: 微信小程序 - webview 动态加载(网页) 以及加载域名的限制

  • 在微信小程序开发的时候,webview 能打开的链接为: 1、小程序关联的公众号文章连接(一个小程序可以关联多个公众号),但是不支持公众号里面的专辑链接 2、业务域名(小程序开发后台中配置的业务域名,业务域名需要在域名根目录添加效验文件)


  • 在微信小程序开发的时候封装一个动态加载指定URL的webview,但是发现设置好动态 src 之后打开 webview 页面空白一片。


  • 解决办法:重启微信小程序开发工具,再次打开即可动态加载出来指定网页,记得确定 url 是有效的网页地址。


  • index.js ``` // pages/web/index.js Page({ /**


  • 页面的初始数据 */ data: { // 将要打开的链接 url: "" },

/**


  • 生命周期函数--监听页面加载 */ onLoad: function (options) { this.setData({ // 传入的URL参数 url: options.url // 设置URL // url: "http://mp.weixin.qq.com/s?__biz=MzA5OTI4NTkxNg==&mid=100000654&idx=1&sn=2ce1460e8d9328b6d0a4d9724f418c63&chksm=1085ed7d27f2646bf6d181b9111577586d8cd88307c9708a55f529b8a65495c27801b2b9cf7c#rd" }) } }) ```


  • index.wxml


<!--pages/web/index.wxml--> <web-view src="{{url}}"></web-view>

相关文章
|
3月前
|
缓存 小程序 UED
如何利用小程序的生命周期函数实现数据的加载和更新?
如何利用小程序的生命周期函数实现数据的加载和更新?
99 4
|
4月前
|
小程序 Android开发 iOS开发
ISO钉钉小程序小程序webview打开nextjs应用异常
ISO钉钉小程序小程序webview打开nextjs应用异常
65 3
|
5月前
|
监控 小程序 数据处理
揭秘支付宝小程序性能优化秘籍:从加载到运行,每一步都快人一步!
【8月更文挑战第27天】本文深入探讨了支付宝小程序性能优化的关键技术和策略,包括减少网络请求、利用CDN加速、代码按需加载、图片压缩、懒加载以及性能监控等多方面内容,并提供了实用的示例代码,帮助开发者显著提升小程序的加载速度与运行效率,创造更佳用户体验。
102 1
|
5月前
|
域名解析 网络协议
WeCom——通过企业微信来搭建自己的域名邮箱
WeCom——通过企业微信来搭建自己的域名邮箱
219 0
|
7月前
|
Android开发 UED Kotlin
kotlin webview 加载网页失败后如何再次重试
在Kotlin中,当使用WebView加载网页失败时,可通过设置WebViewClient并覆盖`onReceivedError`方法来捕获失败事件。在该回调中,可以显示错误信息或尝试使用`reload()`重试加载。以下是一个简要示例展示如何处理加载失败
|
7月前
|
安全 JavaScript 前端开发
kotlin开发安卓app,JetPack Compose框架,给webview新增一个按钮,点击刷新网页
在Kotlin中开发Android应用,使用Jetpack Compose框架时,可以通过添加一个按钮到TopAppBar来实现WebView页面的刷新功能。按钮位于右上角,点击后调用`webViewState?.reload()`来刷新网页内容。以下是代码摘要:
|
7月前
|
JavaScript 前端开发 Android开发
kotlin安卓在Jetpack Compose 框架下使用webview , 网页中的JavaScript代码如何与native交互
在Jetpack Compose中使用Kotlin创建Webview组件,设置JavaScript交互:`@Composable`函数`ComposableWebView`加载网页并启用JavaScript。通过`addJavascriptInterface`添加`WebAppInterface`类,允许JavaScript调用Android方法如播放音频。当页面加载完成时,执行`onWebViewReady`回调。
|
6月前
|
小程序 开发者
【微信小程序】 微信小程序报错不在以下request合法域名列表中
【微信小程序】 微信小程序报错不在以下request合法域名列表中
1091 0
|
7月前
|
Web App开发 移动开发 前端开发
52. 【Android教程】网页视图:WebView
52. 【Android教程】网页视图:WebView
110 1
|
6月前
|
小程序 前端开发
【微信小程序-原生开发】实用教程22 - 绘制图表(引入 echarts,含图表的懒加载-获取到数据后再渲染图表,多图表加载等技巧)
【微信小程序-原生开发】实用教程22 - 绘制图表(引入 echarts,含图表的懒加载-获取到数据后再渲染图表,多图表加载等技巧)
324 0