微信小程序和Html交互实现方法

微信小程序与Html实现方法的交互

微信小程序访问html页面由小程序中的WebView实现为网页托管容器。 WebView的src属性配置为加载html页面。当html返回小程序时，需要引用小程序类库，并调用指定的接口进行跳转。目前，小程序与html交互，数据通过跳转链接参数的拼接传输。

小程序跳转到html

1，小程序跳转到html，需要配置跳转地址到指定的域名白名单。

2.在白名单中配置的域名服务器的根目录中添加签名文件。文件名为mAPifgWWWz.txt，内容为e1756a5045b2504b499cc1cce1d2c6053。将webView组件添加到页面并配置地址：

Index.wxml index.js data: {urlPath:'https://visualstreet.cn/website/index.html?path=web-view&mytest=showWebView'}，

当小程序调用html时，你可以在WebView的src中写入html地址;例如:https://res.wx.qq.com/index.html;当小程序调用html登录时，需要将登录信息作为参数传递。要html;例如:https://res.wx.qq.com/index.html?user=111&unionId=222;html页面window.onload将触发参数的获取：

Window.onload=function（）{console.log（document.location）;的console.log（window.location的）;的document.getElementById（ 'txtMsg'）的innerText=document.location.href。 document.getElementById（'txtDetail'）.innerText=window .__ wxjs_environment;}

并且可以通过

窗口.__ wxjs_environment

获取小程序

的来源 Html跳转到小程序

webView中的html页面可以跳回到指定的小程序页面，也就是说，html页面可以进行一系列操作并将结果参数返回给小程序;使用html返回小程序以引用返回的html页面中的小程序类

调用小程序类中的指定接口返回

wx.miniProgram.navigateTo（）wx.miniProgram.navigateBack（）wx.miniProgram.switchTab（）wx.miniProgram.reLaunch（）wx.miniProgram.redirectTo（）wx.miniProgram.postMessage（）wx.miniProgram.getEnv（）

当html跳回到小程序时，您可以通过转到小程序指定路由器以获取此页面上的参数信息;

例如: wx.miniProgram.navigateTo（'login/index？htmlvalue=12dasf＆amp; htmlvalue2=231'）

＆lt; 汇海（www.hvihi.com）是国内知名的商城系统和商城网站建设提供商，其中汇海技术小程序系统提供小程序商城开发，小程序配送系统，微分配系统，商城系统，电子商务网站建设， 微信发行系统，小程序商城及其他多端商场和电子商务行业解决方案＆gt;

确认：这个文件和图像源网络编辑器的网站部分，如果有侵权及时通信删除。 汇海hvihi.com网站原创文章，请注明出处。