react-native-webview使用postMessage后H5不能监听问题(iOS和安卓的兼容问题)

/* 监听rn消息 */
const eventListener = nativeEvent => {//解析数据actionType、extraconst {actionType, extra} = nativeEvent.data && JSON.parse(nativeEvent.data) || {}
}
//安卓用document,ios用window
window.addEventListener('message', eventListener);
document.addEventListener('message', eventListener);

import uaParser from 'ua-parser-js'let timer
let ua = uaParser(navigator.userAgent)const handleWatchRNMessage = () => {if (window.ReactNativeWebView) {window.ReactNativeWebView.postMessage(JSON.stringify({ type: 'getToken' }))}const eventListener = (e) => {console.log('message', e.data)let payload = e.data ? JSON.parse(e.data) : {}let type = payload.typeif (type === 'getToken') {localStorage.setItem('token', payload.token)} else if (type === 'getBrowserInfo') {const { browser } = uawindow.ReactNativeWebView.postMessage(JSON.stringify({ type, browser }))}}if (window.platform === 'rn') {if (ua.os.name === 'iOS') {window.addEventListener('message', eventListener)} else {window.document.addEventListener('message', eventListener)}}
}handleWatchRNMessage()

 

参考链接:

https://blog.csdn.net/liuxingyuzaixian/article/details/125199131

https://chat.xutongbao.top/ 

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/43284.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Jenkins-发送邮件配置

在Jenkins构建执行完毕后,需要及时通知相关人员。因此在jenkins中是可以通过邮件通知的。 一、Jenkins自带的邮件通知功能 找到manage Jenkins->Configure System,进行邮件配置: 2. 配置Jenkins自带的邮箱信息 完成上面的配置后&#xf…

DiffusionDet: Diffusion Model for Object Detection

DiffusionDet: Diffusion Model for Object Detection 论文概述不同之处整体流程 论文题目:DiffusionDet: Diffusion Model for Object Detection 论文来源:arXiv preprint 2022 论文地址:https://arxiv.org/abs/2211.09788 论文代码&#xf…

kubesphere 使用流水线对接 sonar

官方文档:使用图形编辑面板创建流水线 创建凭证 创建 sonar 凭证 创建 gitlab 凭证 创建流水线 创建流水线,编辑流水线 自定义流水线 拉取代码 代理选 kubernetes,label 填maven 添加步骤 - git 填写 git 地址,选…

CSS 背景属性

前言 背景属性 属性说明background-color背景颜色background-image背景图background-repeat背景图平铺方式background-position背景图位置background-size背景图缩放background-attachment背景图固定background背景复合属性 背景颜色 可以使用background-color属性来设置背景…

【计算机设计大赛】国赛一等奖项目分享——基于多端融合的化工安全生产监管可视化系统

文章目录 一、计算机设计大赛国赛一等奖二、项目背景三、项目简介四、系统架构五、系统功能结构六、项目特色(1)多端融合(2)数据可视化(3)计算机视觉(目标检测) 七、系统界面设计&am…

前端打开后端返回的HTML格式的数据

前端打开后端返回的 HTML格式 的数据: 后端返回的数据格式如下示例: 前端通过 js 方式处理(核心代码如下) console.log(回调, path); // path 是后端返回的 HTML 格式数据// 必须要存进localstorage,否则会报错&am…

步入React正殿 - State进阶

目录 扩展学习资料 State进阶知识点 状态更新扩展 shouldComponentUpdate PureComponent 为何使用不变数据【保证数据引用不会出错】 单一数据源 /src/App.js /src/components/listItem.jsx 状态提升 /src/components/navbar.jsx /src/components/listPage.jsx src/A…

Uniapp连接蓝牙设备

一、效果图 二、流程图 三、实现 UI <uni-list><uni-list :border="true"><!-- 显示圆形头像 -->

C语言案例 判断是否为回文数-06.1

题目&#xff1a;随机输入一个5位数&#xff0c;判断它是不是回文数 步骤一&#xff1a;定义程序的目标 编写C程序&#xff0c;随机输入一个5位数&#xff0c;判断它是不是回文数 步骤二&#xff1a;程序设计 原理&#xff1a;即12321是回文数&#xff0c;个位与万位相同&#…

SpringBoot + Vue 微人事(十)

职位管理前后端接口对接 先把table中的数据展示出来&#xff0c;table里面的数据实际上是positions里面的数据&#xff0c;就是要给positions:[] 赋上值 可以在methods中定义一个initPosition方法 methods:{//定义一个初始化positions的方法initPositions(){//发送一个get请求…

web JS高德地图标点、点聚合、自定义图标、自定义窗体信息、换肤等功能实现和高复用性组件封装教程

文章目录 前言一、点聚合是什么&#xff1f;二、开发前准备三、API示例1.引入高德地图2.创建地图实例3.添加标点4.删除标点5.删除所有标点&#xff08;覆盖物&#xff09;6.聚合点7.自定义聚合点样式8.清除聚合9.打开窗体信息 四、实战开发需求要求效果图如下&#xff1a;封装思…

(二)Git在公司中团队内合作和跨团队合作和分支操作的全部流程(一篇就够)

&#xff08;一&#xff09;Git连接GitHub的全部流程https://blog.csdn.net/m0_65992672/article/details/132333727 团队内协作 项目经理通过git push将代码推送到远程仓库【也就是git、gitee等代码托管中心】,推完以后组员可以通过git clone克隆下来代码&#xff0c;如果组…

redis主从复制

随着项目访问量的增加&#xff0c;对Redis服务器的操作也越加频繁&#xff0c;虽然Redis读写速度都很快&#xff0c;但是一定程度上也会造成一定的延时&#xff0c;那么为了解决访问量大的问题&#xff0c;通常会采取的一种方式是主从架构Master/Slave&#xff0c;Master 以写为…

C运行时错误——error realloc(): invalid next size

在LeetCode做题时遇到一个运行时错误&#xff0c;将引起问题的原因记录一下备忘&#xff1a; 我们在malloc或calloc等API分配内存时&#xff0c;libc库除了分配给我们在参数中设定大小的内存&#xff08;可能会有内存对齐&#xff0c;实际分配的比参数设定的要多&#xff09;&…

填充柄功能

单元格右下角十字符号 顺序式填充 输入1,2&#xff0c;直接拉取即可实现顺序1到10. 复制式填充 CtrlD或者拉取&#xff0c;选择右下角复制单元格。 规律式填充 输入星期一&#xff0c;星期二&#xff0c;下拉一直可以到星期日 自定义填充 选择文件-》选项-》自定义序列 输…

【python办公自动化】PysimpleGUI中的popup弹窗中的按钮设置居中

PysimpleGUI中的popup弹窗中的按钮设置居中 背景问题解决背景 默认的popup弹窗中的OK按钮是在最下面偏左侧一些,有时需要将按钮放置居中 问题解决 首先找到pysimplegui源代码文件中popup的部分 然后定位到19388行,源文件内容如下 关于popup弹窗OK按钮的设置,将pad属性…

STM32——SPI外设总线

一、SPI外设简介 STM32内部集成了硬件SPI收发电路&#xff0c;可以由硬件自动执行时钟生成、数据收发等功能&#xff0c;减轻CPU的负担【硬件电路自动生成时序】 可配置8位/16位数据帧、高位先行/低位先行 时钟频率&#xff1a; fPCLK / (2, 4, 8, 16, 32, 64, 128, 256)【SP…

面试之快速学习STL- vector

1. vector底层实现机制刨析&#xff1a; 简述&#xff1a;使用三个迭代器表示的&#xff1a; &#xfffc; 这也就解释了&#xff0c;为什么 vector 容器在进行扩容后&#xff0c;与其相关的指针、引用以及迭代器可能会失效的原因。 insert 整体向后移 erase 整体向前移…

53.Linux day03 文件查看命令,vi/vim常用命令

今天进行了新的学习。 目录 1.cat a.查看单个文件的内容&#xff1a; b.查看多个文件的内容&#xff1a; c.将多个文件的内容连接并输出到一个新文件&#xff1a; d.显示带有行号的文件内容&#xff1a; 2.more 3.less 4.head 5.tail 6.命令模式 7.插入模式 8.图…