3***@qq.com
3***@qq.com
  • 发布:2019-07-31 16:58
  • 更新:2019-12-10 10:54
  • 阅读:5986

求助大神,uni-app用web-view链接的用uni-app写的h5页面,怎么实现通信(有偿提问)

分类:uni-app

求助大神,uni-app用web-view链接的用uni-app写的h5页面,怎么实现通信(有偿提问)

2019-07-31 16:58 负责人:无 分享
已邀请:
HenryLiu

HenryLiu

使用h5原生的,这种方法只在h5端有效,注意加上条件编译

//子页面(webview里的页面)向父级页面传递信息

window.parent.postMessage({  
    key1:"key1的内容"  
}, '*');

//父级页面接收信息

window.addEventListener('message', function(e) {           
    console.log(data.key1)  
},false)
  • 蹦豆儿

    可以在微信公众号端实现吗?

    2020-06-17 16:47

x***@datainsights.biz

x***@datainsights.biz

我写了一个web-view文件选择(非视频/图片),想把文件静态路径传回vue文件上传服务器,用官方的postMessage怎么都实现不了。
后来干脆将uni.getStorageSync保存的用户Id传给html文件,在html文件做上传。
部分代码:
.vue文件

<template>  
    <view>  
        <web-view :src="url" style="width: 100%;"></web-view>  
    </view>  
</template>  
<script>  
    export default {  
        data() {  
            return {  
                url: '/hybrid/html/local.html?data=' + uni.getStorageSync("Id")  
            }  
        }  
    }  
</script>

local.html文件

document.addEventListener('UniAppJSBridgeReady', function() {  
                uni.getEnv(function(res) {  
                    console.log('当前环境:' + JSON.stringify(res));  
                });  
                uni.postMessage({  
                    data: {  
                        action: getReg('data')  
                    }  
                })  
            })  

function getReg(data) {  
                let dataReg = new RegExp("(^|&)" + data + "=([^&]*)(&|$)");  
                let regValue = window.location.search.substr(1).match(dataReg)  
                if (regValue != null) {  
                    return unescape(regValue[2]);  
                }  
                return null;  
            }  

console.log(getReg('data'))  // uni.getStorageSync("Id")的值

对你有帮助就行,有好的方法希望能分享给我,web-view通信真的搞得好烦

  • j***@163.com

    通过web-view怎么获取文件的准确路径呢,我也要做这个功能,但是h5里面的input上传文件获取不到准确路径

    2020-02-12 15:30

SimpleJalon

SimpleJalon - 个人承接PHP、uniapp项目,有案例,联系QQ 615773740,不接受外地工作,可付费提供技术支持。添加QQ时务必备注来意以及添加渠道,渠道可以写:`uniapp`

没法实时通讯 我也研究了好久了。
有一种注入webview的js 绕过 社区好像有人发了,但是不优雅 也不咋好用,,

  • 3***@qq.com

    我也是这个问题,请问你怎么解决的?有解决的方法么

    2019-09-19 17:09

  • SimpleJalon

    回复 3***@qq.com: nvue 的webview可以

    2019-09-19 17:39

  • w***@126.com

    回复 SimpleJalon: 你好,你可以再nvue页面中webview进行通信吗?我的不行,怎么告知下是怎么处理的吗?

    2019-12-17 11:42

该问题目前已经被锁定, 无法添加新回复