当前位置： 首页 > news >正文

uniapp webview实现双向通信

news 文章来源：https://blog.csdn.net/weixin_44114415/article/details/133125072 2024/10/31 13:23:26

需求：uniapp webview嵌套一个h5 实现双向通信

  • uniapp 代码
<template><view><web-view src="http://192.168.3.150:9003/" @message="onMessage"></web-view></view>
</template><script>export default {data(){return{currentWebview:null}},mounted() {const self = this;self.currentWebview = self.$scope.$getAppWebview().children()[0]let info = {name:'hello'}self.currentWebview.evalJS(`uniEvent(${JSON.stringify(info)})`);setInterval(() => {self.currentWebview.evalJS(`uniEvent(${JSON.stringify(info)})`);},1000)},methods: {onMessage(e) {console.log('来自页面的消息', e.detail.data);uni.showToast({title: e.detail.data, icon: 'none'});}}}
</script>
  • h5 页面代码
<!DOCTYPE html>
<html>
<head><meta http-equiv="content-type" content="text/html; charset=utf-8" /><title>测试</title><script type="text/javascript" src="https://js.cdn.aliyun.dcloud.net.cn/dev/uni-app/uni.webview.1.5.2.js"></script>
</head>
<body onload="addUniEvenPassthrough()"><div class="margin-top:200px;"></div><button onclick="sendMessage()">Send message to uniapp</button><button onclick="sendMessage()">Send message to uniapp</button><button onclick="sendMessage()">Send message to uniapp</button><button onclick="sendMessage()">Send message to uniapp</button><button onclick="sendMessage()">Send message to uniapp</button><button onclick="sendMessage()">Send message to uniapp</button><button onclick="sendMessage()">Send message to uniapp</button><script>function sendMessage() {uni.postMessage({data: 'Hello from web page!'});}function addUniEvenPassthrough() {window.uniEvent = function(info) {console.log('webview通信', JSON.stringify(info));}}</script>
</body>
</html>
  • 效果
    在这里插入图片描述
    在这里插入图片描述

相关文章：

uniapp webview实现双向通信

需求&#xff1a;uniapp webview嵌套一个h5 实现双向通信 uniapp 代码 <template><view><web-view src"http://192.168.3.150:9003/" message"onMessage"></web-view></view> </template><script>export defau…...

编程日记 2023/9/21 11:48:50

Linux动态库

定义&#xff1a;动态函数库&#xff0c;是在程序执行时动态&#xff08;临时&#xff09;由目标程序去调用 优点&#xff1a; 调用时不复制&#xff0c;程序运行时动态加载到内存&#xff0c;供程序调用&#xff0c;系统只加载一次&#xff0c;多个程序可以共用&#xff0c;…...

编程日记 2023/9/21 11:46:48

ESP-IDF学习——1.环境安装与hello-world

ESP-IDF学习——1.环境安装与hello-world 0.前言一、环境搭建1.官方IDE工具2.vscode图形化配置 二、示例工程三、自定义工程四、点灯五、总结 0.前言 最近在学习freertos&#xff0c;但由于买的书还没到&#xff0c;所以先捣鼓捣鼓ESP-IDF&#xff0c;因为这个比Arduino更接近底…...

编程日记 2023/9/21 11:45:46

【算法】二分答案

文章目录 相关链接什么时候使用二分答案&#xff1f;题目列表最大化最小化相关题目列表&#x1f4d5;2439. 最小化数组中的最大值解法1——二分答案解法2——分类讨论O(n) 2513. 最小化两个数组中的最大值&#xff08;二分答案lcm容斥原理&#xff09;&#x1f402;好题&#x…...

编程日记 2023/9/21 11:42:43

阿曼市场最全开发攻略，看这一篇就够了

中东是一个充满外贸机遇的市场&#xff0c;已经成为很多外贸人重点开发的市场。 阿曼的海岸南方和东方临阿拉伯海&#xff0c;东北方则抵阿曼湾。阿曼因为扼守着世界上最重要的石油输出通道——波斯湾和阿曼湾之间的霍尔木兹海峡&#xff0c;所以地理位置非常重要&#xff0c;…...

编程日记 2023/9/21 11:41:42

探讨UUID和Secrets：确保唯一性与数据安全的利器

&#x1f600;前言 在现代软件开发中&#xff0c;唯一标识符&#xff08;UUID&#xff09;和机密信息的处理是至关重要的。UUID是用于唯一标识数据记录和对象的128位值&#xff0c;确保了全球范围内的唯一性。同时&#xff0c;Python的secrets模块为处理机密信息提供了强大的随…...

编程日记 2023/9/21 11:40:42

06-Redis缓存高可用集群

上一篇&#xff1a;05-Redis高可用集群之水平扩展 1.集群方案比较 哨兵模式 在redis3.0以前的版本要实现集群一般是借助哨兵sentinel工具来监控master节点的状态&#xff0c;如果master节点异常&#xff0c;则会做主从切换&#xff0c;将某一台slave作为master&#xff0c…...

编程日记 2023/9/21 11:37:37

LCP 18.早餐组合

​​题目来源&#xff1a; leetcode题目&#xff0c;网址&#xff1a;LCP 18. 早餐组合 - 力扣&#xff08;LeetCode&#xff09; 解题思路&#xff1a; 按序遍历饮料数组&#xff0c;二分查找符合要求 staple 中满足要求的最大值所在位置。最后返回所有*&#xff08;最大位置…...

编程日记 2023/9/21 11:35:35

Tomcat调优【精简版】

Tomcat调优 优化Tomcat内存分配 调整Tomcat启动脚本contalina.sh,设置tomcat启动时分配的内存很可使用的最大内存; CATALINA_OPTS 调整Tomcat线程池 Tomcat默认使用的线程池:ThreadPoolExecutor 可以通过修改server.xml的 Connector 节点下的 maxThreads、minSpareThread…...

编程日记 2023/9/21 11:32:32

通过NDK编译C程序运行在iMX6q开发板上

在之前想要在Ubuntu系统中编译c语言程序为可执行文件并放在装有Android6.0.1系统的imx6q开发板上运行&#xff0c;采用gcc编译器进行编译的时候&#xff0c;虽然可以生成可执行文件但是却出现了错误&#xff0c;最终采用手段仍然无法在板子上运行&#xff0c;但是转换思路后&am…...

编程日记 2023/9/21 11:29:29

【学习笔记】Java 一对一培训（2.1）Java基础语法

【学习笔记】Java 一对一培训&#xff08;2.1&#xff09;Java基础语法 关键词&#xff1a;Java、Spring Boot、Idea、数据库、一对一、培训、教学本文主要内容含Java简介、Java基础语法、Java对象和类、Java基本数据类型、Java变量类型、Java修饰符计划2小时完成&#xff0c;…...

编程日记 2023/9/21 11:23:23

外贸独立站哪家好？推荐的独立站建站平台？

如何选外贸独立站搭建系统&#xff1f;创建贸易网站的工具有哪些&#xff1f; 在如今全球贸易不断蓬勃发展的背景下&#xff0c;外贸独立站成为许多企业拓展国际市场的首选之一。然而&#xff0c;要想在竞争激烈的市场中脱颖而出&#xff0c;选择一家合适的外贸独立站服务提供…...

编程日记 2023/9/21 11:22:22

六、变量与常量

变量与常量 1.变量与常量1.1标识符和关键字1.1.1.标识符1.1.2.关键字 1.2.声明变量1.3.声明常量1.4.变量的有效范围1.4.1.成员变量1.4.2.局部变量 1.5.训练11.6.训练2 —————————————————————————————————————————————————— …...

编程日记 2023/9/21 11:21:21

Fork() 函数：“父” 与 “子” 进程的交互（进程的创建）

阅读导航 前言一、fork函数初识1. 基本概念2. fork函数返回值 二、fork函数的写时拷贝三、总结温馨提示 前言 前面我们讲了C语言的基础知识&#xff0c;也了解了一些数据结构&#xff0c;并且讲了有关C的一些知识&#xff0c;也学习了一些Linux的基本操作&#xff0c;也了解并…...

编程日记 2023/9/21 11:19:18

JupyterNotebook设置Python环境的方法步骤

不多说&#xff0c;看链接。 https://stackoverflow.com/questions/39604271/conda-environments-not-showing-up-in-jupyter-notebook conda activate myenv pip install ipykernel python -m ipykernel install --user --name myenv --display-name "Python (myenv)&q…...

编程日记 2023/9/21 11:17:17

腾讯云阿里云云服务器 Linux 操作系统 BT 宝塔面板快速建站教程

宝塔面板概述 宝塔面板是一款服务器管理软件&#xff0c;支持Windows和Linux系统&#xff0c;可以通过Web端轻松管理服务器&#xff0c;提升运维效率。总体来说&#xff0c;宝塔面板具有操作简单、功能丰富、安全可靠等特点&#xff0c;是一款非常实用的服务器管理软件。 宝塔…...

编程日记 2023/9/21 11:16:15

【Linux】死锁理解

什么是死锁 因为资源调度的方式不合理或者资源的稀缺性&#xff0c;导致进程间的相互等待。 死锁的四个必要条件&#xff1a;互斥条件&#xff0c;请求和保持条件&#xff0c;环路等待条件&#xff0c;不可剥夺条件。 死锁的预防只要破坏死锁产生的四个必要条件。通常采用预…...

编程日记 2023/9/21 11:14:13

基于Java所涉及的人工智能的框架

11 References: [1] Java中人工智能的框架_永远的12的博客-CSDN博客...

编程日记 2023/9/21 11:13:11

【力扣】三角形最小路径和

目录 题目 例子 示例 1&#xff1a; 示例 2&#xff1a; 前言 思路 思想 代码 调用的函数 主函数 所有代码 力扣提交的代码 运行结果 小结 题目 给定一个三角形 triangle &#xff0c;找出自顶向下的最小路径和。 每一步只能移动到下一行中相邻的结点上。相邻的结…...

编程日记 2023/9/21 11:08:06

【Linux】指针常量和常量指针

这个是指针常量&#xff0c;不能修改指向【其实就是引用的原型】&#xff1a;可以理解为const是否限制了星号 这个是常量指针&#xff0c;可以改指向&#xff0c;不能改值&#xff1a;...

编程日记 2023/9/21 11:07:05

LCP 22.黑白方格画

​题目来源&#xff1a; leetcode题目&#xff0c;网址&#xff1a;LCP 22. 黑白方格画 - 力扣&#xff08;LeetCode&#xff09; 解题思路&#xff1a; 分别计算当涂0行&#xff0c;1行&#xff0c;2行.......时能否满足要求&#xff0c;若能&#xff…...

编程日记 2023/9/21 11:06:04

Java并发编程第8讲——ThreadLocal详解

ThreadLocal无论是在项目开发还是面试中都会经常碰到&#xff0c;它的重要性可见一斑&#xff0c;本篇文章就从ThreadLocal的使用、实现原理、核心方法的源码、内存泄漏问题等展开介绍一下。 一、什么是ThreadLocal ThreadLocal是java.lang下面的一个类&#xff0c;在JDK 1.2版…...

编程日记 2023/9/21 10:57:56

2023复旦大学计算机科学技术（网络空间安全）保研记录

BG&#xff1a;中九rank前5&#xff05;、科研经历少、无竞赛 复旦大学计算机科学与技术--网络空间安全方向&#xff0c;参营4天&#xff08;6.26-6.29&#xff09;&#xff0c;管午饭&#xff0c;住宿自理 6.26--报道听会&#xff0c;6.27--听会&#xff0b;实验室参观 给了…...

编程日记 2023/9/21 10:54:53

linux系统通过docker安装python的jieba，如何找到jieba路径替换分词文件

1、安装python镜像 python镜像名为 jetz_python3.7.131、进入容器 首次安装镜像后，容器启动，进入容器中，其中py37是容器名称，后面会一直用到 docker run -it --name py37 jetz_python3.7.13 /bin/bash如果进入过容器退出了，而容器已存在，上面的的 命令会报错，直接根…...

编程日记 2023/9/21 10:51:51

Python Functions-函数

目录 创建函数 调用函数 参数还是自变量&#xff1f; 参数数量 任意参数&#xff0c;*args 关键字参数 任意关键字参数&#xff0c;**kwargs 默认参数值 将列表作为参数传递 The pass Statement 递归 函数是一个只有在被调用时才运行的代码块。 可以将称为参数的数…...

编程日记 2023/9/21 10:50:49

【人工智能】机器学习的入门与提升

目录 1.入门 1.1.从何处开始 1.2.数据集 1.3.数据类型 2.平均中位数模式 2.1.均值、中值和众数 2.2.均值 2.2.1.实例 2.2.2.运行结果 2.3.中值 2.3.1.实例 2.3.2.运行结果 2.3.3.实例 2.3.4.运行结果 2.4.众数 2.4.1.实例 2.4.2.运行结果 2.5.章节总结 3.标准…...

编程日记 2023/9/21 10:48:47

WEB漏洞原理之---【XMLXXE利用检测绕过】

文章目录 1、概述1.1、XML概念1.2、XML与HTML的主要差异1.3、XML代码示例 2、靶场演示2.1、Pikachu靶场--XML数据传输测试玩法-1-读取文件玩法-2-内网探针或攻击内网应用&#xff08;触发漏洞地址&#xff09;玩法-3-RCE引入外部实体DTD无回显-读取文件开启phpstudy--apache日志…...

编程日记 2023/9/21 10:45:44

element-table排序icon没有点亮

<el-table :data"tableData" ref"tableRef"border :sort"defaultSort":default-sort"defaultSort"><el-table-column sortable :sort-orders"sortOrder" prop"date" label"日期"> </el-…...

编程日记 2023/9/21 10:44:43

传统的经典问题 Java 的 Interface 是干什么的

传统的经典问题 Java 的 Interface 是干什么 解答 上面的这个问题应该还是比较好回答的吧。 只要你做过 Java &#xff0c;通常 Interface 的问题多多少少会遇到&#xff0c;而且可能会遇到一大堆。 在JAVA编程语言中是一个抽象类型&#xff08;Abstract Type&#xff09;&…...

编程日记 2023/9/21 10:41:39

Linux 文件 目录管理

Linux 文件 基本属性 Linux 系统是一种典型的多用户系统&#xff0c;为了保护系统的安全性&#xff0c;不同的用户拥有不同的地位和权限。Linux 系统对不同的用户访问同一文件&#xff08;包括目录文件&#xff09;的权限做了不同的规定。 可以使用命令&#xff1a;ll 或 ls –…...

编程日记 2023/9/21 10:37:34

建立网站要准备多少钱/北京seo百度推广

Eureka 服务器架起来了(关于架设步骤参考博客《Linux 下 Eureka 服务器的部署》)&#xff0c;现在如何把我们要负载均衡的服务器(也就是从 Application Client 接收请求并返回一个响应的 Application Service)注册到 Eureka&#xff1f;本文以一个示例介绍 Eureka Application …...

编程日记 2024/10/31 11:11:39

济南集团网站建设方案/帮我搜一下长沙做网络销售

虚拟dom是什么&#xff1f;首先我们先示例一段简单的代码let div document.createElement("div"); let ret ""; for(let key in div){ret key ""; }; console.log(ret)我们看一下控制台打印我们只是新建了一个空的 div &#xff0c;而且它只…...

编程日记 2024/10/31 8:31:20

风铃网站具体是做那方面的/百度信息流账户搭建

Linux Kernel listxattr本地拒绝服务漏洞2007-02-01eNet&Ciweek受影响系统&#xff1a;Linux kernel < 2.6.19.2RedHat Enterprise Linux WS 4RedHat Enterprise Linux ES 4RedHat Enterprise Linux AS 4描述&#xff1a;Linux Kernel是开放源码操作系统Linux所使用的内…...

编程日记 2024/10/31 1:40:54

win10建站wordpress/今日热点新闻事件摘抄

点击“运行”&#xff0c;在子菜单中选择“运行”。1、在运行窗口中输入&#xff1a;cmd /k javac "$(FULL_CURRENT_PATH)" & echo 编译成功&#xff01; & PAUSE & EXIT点击保存后&#xff0c;在弹出的窗口中设置名称&#xff1a;取名为JAVA编译2、重复…...

编程日记 2024/10/31 1:04:30

成都网站建设制作服务/谷歌seo营销

用户介绍安装创建达梦企业版数据库后&#xff0c;系统会默认创建四类数据库账号&#xff0c;分别是&#xff1a;SYS:达梦数据库内置管理用户&#xff0c;不能登录&#xff0c;数据库使用的大部分的数据字典和动态性能视图。SYSDBA:数据库管理员&#xff0c;主要管理维护数据库。…...

编程日记 2024/10/30 20:30:14

网站怎样做301/深圳网站关键词优化公司

package cn.itcast; import java.io.FileWriter; import java.io.IOException; import java.io.Writer;/* 字符流入数据 writer発中的方法: void write(int ch),; 一次写一个字符 void write(charll chs, int index, int l ; 一次写一个指定的字符敷组en) ; void write (Strine…...

编程日记 2024/10/30 19:58:51