uniapp与webview进行数据通信：
<!DOCTYPE html>
<html><head><meta charset="utf-8" /><meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" /><title>网络网页</title><style type="text/css">.btn {display: block;margin: 20px auto;padding: 5px;background-color: #007aff;border: 0;color: #ffffff;height: 40px;width: 200px;}.btn-red {background-color: #dd524d;}.desc {padding: 10px;color: #999999;}.post-message-section {visibility: hidden;}</style>
</head><body><div class="post-message-section"><p class="desc">网页向应用发送消息，注意：小程序端应用会在此页面后退时接收到消息。</p><div class="btn-list"><label>账户:</label><input type="text" name="user" required><br><label>密码：</label><input type="text" name="pwd" required><br><div class="post-message-section"><!-- HTML 内容 --><p id="receivedMessage">Received Message Will Appear Here</p></div><br><button class="btn btn-red" type="button" id="postMessage1">跳转1</button><button class="btn btn-red" type="button" id="postMessage2">跳转2</button><button class="btn btn-red" type="button" id="postMessage">postMessage</button><button class="btn btn-red" type="button" id="getMessage">点击获取GetMessage</button><button class="btn btn-red" type="button" id="getMessage">获取相机权限</button></div><p id="receivedMessage"></p></div><script type="text/javascript">var userAgent = navigator.userAgent;if(!/toutiaomicroapp/i.test(userAgent)) {document.querySelector('.post-message-section').style.visibility = 'visible';}</script><!-- uni 的 SDK --><!-- 需要把 uni.webview.1.5.5.js 下载到自己的服务器 --><script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.min.js"></script><script type="text/javascript" src="uni.webview.1.5.5.js"></script><script type="text/javascript">// 待触发 `UniAppJSBridgeReady` 事件后，即可调用 uni 的 API。document.addEventListener('UniAppJSBridgeReady', function () {uni.getEnv(function (res) {console.log('当前环境111：' + JSON.stringify(res));});});
var customKey = 'key'; // 自定义的键值，可以根据需要修改// postMessage参数document.getElementById('postMessage').addEventListener('click', function () {var userValue = document.getElementsByName('user')[0].value;var pwdValue = document.getElementsByName('pwd')[0].value;var deviceInfo = navigator.userAgent; // 获取设备信息// var customValue = 'nnn'; // 自定义的第二个键值var customValue = 'nnn'; // 自定义的第二个键值// 添加自定义的键值对 uniPostMessage(customKey,customValue); });// 监听postMessage事件// 监听来自 UniApp 的消息document.addEventListener('message', function(event) {console.log('Message received in test.html:', event.data);var receivedMessageElement = document.getElementById('receivedMessage');receivedMessageElement.textContent = 'Received message: ' + event.data;alert('Received message: ' + event.data);});// getMessage参数document.getElementById('getMessage').addEventListener('click', function () {var storage = window.plus.storage;// 获取本地存储 var customKey = 'key'; // 自定义的键值，可以根据需要修改var yourData = storage.getItem(customKey);alert(yourData);return;var parsedData = JSON.parse(yourData);if(parsedData === null) {console.log('本地存储为空');} else {console.log('Data from storage:', yourData);var parsedData = JSON.parse(yourData);document.getElementsByName('user')[0].value = parsedData.data.user || '';document.getElementsByName('pwd')[0].value = parsedData.data.pwd || '';}// 获取所有存储staoragevar keys = plus.storage.getAllKeys();var data = {};// 遍历所有的键，并将键值对添加到对象中keys.forEach(function (key) {var value = window.plus.storage.getItem(key);data[key] = value;});console.log('Data:', JSON.stringify(data));});// 获取传递过来的值console.log('获取数据:',getQuery('data')); //获取 uni-app 传来的值//取url中的参数值function getQuery(name) {// 正则：[找寻'&' + 'url参数名字' = '值' + '&']（'&'可以不存在）let reg = new RegExp("(^|&)"+ name +"=([^&]*)(&|$)");let r = window.location.search.substr(1).match(reg);console.log('获取到的r值',r);if(r != null) {// 对参数值进行解码return decodeURIComponent(r[2]);}return null;}</script>
</body><script>// 获取按钮父元素var buttonContainer = document.body;// 添加点击事件监听器到父元素buttonContainer.addEventListener("click", function (event) {// 确保点击的是按钮if(event.target.tagName === 'BUTTON') {// 根据按钮ID进行区分if(event.target.id === 'postMessage1') {// 处理按钮1的点击事件console.log("点击了跳转1按钮");// 这里可以添加其他处理逻辑window.location.href = 'jump1.html';} else if(event.target.id === 'postMessage2') {// 处理按钮2的点击事件console.log("点击了跳转2按钮");// 这里可以添加其他处理逻辑}}});
</script></html>
