微信小程序和webview使用postMessage交互

8月前作者：我有一棵树分类：Toy博客阅读(43) 违法举报

这篇具有很好参考价值的文章主要介绍了微信小程序和webview使用postMessage交互。希望对大家有所帮助。如果存在错误或未考虑完全的地方，请大家不吝赐教，您也可以点击"举报违法"按钮提交疑问。

小程序和webview能交互，但是没有你想的那个完美

小程序向webview传递参数只能使用url携带参数

webview向小程序传递参数可以使用postMessage, 但是注意了，postMessage只会在特定的时机执行，请看官方文档

微信小程序 invokeappservice postmessage,前端工程化,前端,Powered by 金山文档

由此可见，如果你想点击webview中的一个按钮A，然后给小程序发消息，然后由小程序执行后续操作，但是,又不退出/不分享当前的webview页面是无法实现的。【至少到目前为止20230227是不可以实现的】

那么我们就只能退而求其次，点击webview中的按钮A，跳转（wx.miniProgram.navigateTo）到小程序的页面B【此时会销毁webview】，然后把一些变量通过url参数携带给B，进而实现功能。

综上所述，小程序和webview的交互，不如原生app和webview交互方便，原生app使用jsBridge已经能够很好的实现交互了。小程序在多数应用场景只能用url传递参数。文章来源地址https://www.toymoban.com/news/detail-786604.html

到了这里，关于微信小程序和webview使用postMessage交互的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：如若内容造成侵权/违法违规/事实不符，请点击违法举报进行投诉反馈，一经查实，立即删除！

分享到：

领支付宝红包赞助服务器费用

微信小程序使用webview后点击左上角返回按钮一次性返回小程序

当我们来到webview标签对应的网页地址的时候，在该页面内进行几次跳转后，发现点击小程序左上角返回按钮返回的是上一次跳转的内容，并没有达到我们返回小程序的需求，而是要一直点，然后才能返回小程序。我的情况是webview标签放在一个单独的页面下宽高100%占比显示，

2024年02月05日
浏览(48)
uni-app 使用webview加载H5打开微信小程序

最近公司有个需求要求在app里点击一个功能打开小程序，并且关闭小程序回到app，模仿平安保险app。毕竟我也是刚学习uni-app，找了很多资料，找到了一个天天外链的网站可以生成一个小程序的链接，使用uni的webview去加载这个链接，很好，需求满足，但是收费，那能不能自己

2023年04月18日
浏览(59)
小程序webview组件，小程序和webview交互，小程序内联h5页面，小程序webview内网页实现微信支付

小程序支持webview以后，我们开发的好多h5页面，就可以直接在小程序里使用了，比如我们开发的微信商城，文章详情页，商品详情页，就可以开发一套，多处使用了。我们今天来讲一讲。在小程序的webview里实现微信支付功能。因为微信不允许在小程序的webview里直接调起微信

2024年02月09日
浏览(46)
微信小程序使用webview内嵌h5页面 wx.miniProgram.getEnv失效问题

背景最近接到一个h5需求，和普通的h5不一样，这个h5页面是嵌入到小程序中使用的，需求简单来说就是展示一个跳转按钮，判断如果是小程序环境下就进行跳转到其他小程序页面。实现思路核心逻辑其实就是判断小程序环境这一块，我们可以直接使用wxsdk来进行判断小程序

2024年02月09日
浏览(56)
uniapp vue3中使用webview在微信小程序中实现双向通讯

直接上图，注意事项是这里官网链接: https://uniapp.dcloud.net.cn/component/web-view.html 传递方法的话好像只能通过url来传，其它方式不支持，，，我这个参数没做处理，用的话记得把参数做一下处理也就是说传递数据之后需要 uni.redirectTo({ url: \\\'/pages/testFabric/index\\\' }) 特定时机，当然用

2024年04月13日
浏览(40)
微信小程序数据交互------WXS的使用

🎬 艳艳耶✌️：个人主页 🔥 个人专栏：《Spring与Mybatis集成整合》《Vue.js使用》 ⛺️ 越努力，越幸运

2024年02月05日
浏览(50)
“编辑微信小程序与后台数据交互与微信小程序wxs的使用“

在现代移动应用开发中，微信小程序已经成为了一个非常流行和广泛使用的平台。为了使小程序能够展示丰富的内容和实现复杂的功能，与后台数据的交互是至关重要的。同时，微信小程序还提供了一种特殊的脚本语言——wxs，用于增强小程序的业务逻辑处理能力。本篇博客

2024年02月08日
浏览(44)
【微信小程序】后台数据交互于WX文件使用

目录一、前期准备 1.1 数据库准备 1.2 后端数据获取接口编写 1.3 前端配置接口 1.4 封装微信的request请求二、WXS文件的使用 2.1 WXS简介 2.2 WXS使用三、后台数据交互完整代码 3.1 WXML 3.2 JS 3.3 WXSS 效果图创建数据库：注意：字符集选择 utf8mb4 ，因为可能用存储用户信息，

2024年02月08日
浏览(42)
vue页面内嵌iframe使用postMessage进行数据交互（postMessage跨域通信）

什么是postMessage postMessage 是 html5 引入的 API ,它允许来自不同源的脚本采用异步方式进行有效的通信 ,可以实现跨文本文档,多窗口,跨域消息传递.多用于窗口间数据通信,这也使它成为跨域通信的一种有效的解决方案. vue父页面（嵌入iframe的页面）在vue中要使用iframe上的pos

2023年04月25日
浏览(56)
微信小程序之首页-后台交互及WXS的使用

目录前言一. 前后台数据交互及封装request 1.准备后台 1.1 配置数据源 1.2 部分后台获取数据方法编写 2.准备前端 2.1封装Request 2.2 前端JS方法编写 2.3 前端页面展示index.wxml 二.WXS的使用 1.简介 2.WXS优化OA系统 2.1 使用及定义 2.2 导入要使用的项目 2.3 优化会议状态 2.4 优化人

2024年02月08日
浏览(46)