一机双屏和双屏通信方案总结

项目中需要用到web一机双屏,也就是一台电脑,两个屏幕,每个屏幕分别展示一部分的内容,两个web标签页之间自然少不了实时通信和互动,下面简单介绍一下,在项目中对该问题的思考和最终解决方案:

一:打开两个标签页的方案

1.如果打开的标签页是固定的,则可以直接在a标签加上target="_blank"属性搞定!例如:打开必应首页     代码为:  <a href="http://cn.bing.com/" target="_blank">必应首页</a>

    2.如果页面地址是动态变化的,则可以使用js的 window.open(url)方法。

有两个注意点:

第一个安全性问题:如果父页面和新打开的页面诗不同域名的,浏览器会禁止新窗口访问opener中内容,但是可以通过window.opener.location=newURl来重写父页面的url,即使与父页面不同域。如果父窗口没有做防止被iframe嵌入,那么可以使用iframe做一个钓鱼页面,如果不注意url的化,你可能就被钓鱼了。

第二个性能问题:chrome每个标签页都是一个单独的进程,然后进程内包含很多个线程,但是如果是通过a标签的target="_blank"或者window.open(url)在新窗口中打开页面,子窗口会于父窗口共用进程和线程,子窗口如果进行了复杂的运算或者请求,那么父窗口极有可能被卡住。

破解方法:

1.通过在a标签上添加这个noopener属性,可以将新打开窗口的opner置为空。

2.window.open并设置opner为空

1 var newWindow= window.open(‘xxx‘);
2 newWindow.opener = null;

二:双屏通信方案

1.localStorage

通过监听localStorage的数据变化实现同一浏览器下不同页面之间的通讯,(跨域不适用,需要结合postmessage),在双屏有大量的通讯的时候,建议使用,方便快捷!

推荐lsbridge库直接进行应用。

2.WebSocket

关于websocket,不在进行详细说明,在博文服务器端推送技术总结中,有详细说明

时间: 2024-10-17 08:51:01

一机双屏和双屏通信方案总结的相关文章

与下位机或设备的通信解析优化的一点功能:T4+动态编译

原文:与下位机或设备的通信解析优化的一点功能:T4+动态编译     去年接触的一个项目中,需要通过TCP与设备进行对接的,传的是Modbus协议的数据,然后后台需要可以动态配置协议解析的方式,即寄存器的解析方式,,配置信息有:Key,数据Index,源数据类型,数据库列类型,数据排列方式 一开始使用的方式是,从数据库读取出协议的配置,然后在接收到数据的时候,循环每个配置项根据配置-----解析数据------转换类型----存临时列表,,后来改进了一下,配置项存缓存,,数据库修改的时候,同时更

与下位机或设备的通信解析优化的一点功能(续补):动态编译

原文:与下位机或设备的通信解析优化的一点功能(续补):动态编译 继上一篇<与下位机或设备的通信解析优化的一点功能:T4+动态编译>  ,现在已经生成出解析用的类的C#源码了,接下来,就轮到动态编译生成Type了. 在实现上,.net framework和.net core上,有些不同: .Net Framework的: 1 var transfer = ""; //解析后的C#源码字符串 2 3 ICodeCompiler comp = new CSharpCodeProv

c# IPC实现本机进程之间的通信

IPC可以实现本地进程之间通信.这种用法不是太常见,常见的替代方案是使用wcf,remoting,web service,socket(tcp/pipe/...)等其他分布式部署方案来替代进程之间的通信.虽然不常见但也避免不了一些场景会使用该方案. 应用包含: 1)使用IPC技术实现多client与一个sever通信(不过是本机,感觉意义不大,但如果想实现本机上运行确实是一个不错的方案): 2)使用IPC技术实现订阅者和生产者分离时,一个server接收并消费消息,客户端是生产消息的. 1 1:

麒麟开源堡垒机阿里云双机部署方案&#8203;

目录1 概述 21.1 方案背景 21.2 方案内容 32. 阿里云SLB负载均衡方式 32.1 物理环境准备要求 32.2 阿里云SLB设置 32.3 使用说明 33. DNS负载均衡方式 52.1 物理环境准备要求 52.2 DNS设置 52.3 使用说明 54  方案比较 6 1 概述1.1 方案背景阿里云系统中,非VPC网络用户无法对系统IP进行修改增加,因此堡垒机双机模式无法应用在阿里云非VPC用户中.1.2 方案内容本方案探讨使用DNS负载均衡和阿里云SLB负载均衡二种方式实现麒麟堡

无公网IP通过跳板机实现访问公网的方案

跳板机:预发布:10.124.156.244 客户端:安卓打包服务器:10.124.156.247-250 配置: 跳板机: 1.开启转发功能: #vi /etc/sysctl.conf ==================== net.ipv4.ip_forward = 1 ==================== #sysctl –p 2.iptables开启转发 (  iptables -t nat -A POSTROUTING -s 10.124.156.0/24 -o eth0 -j

基于HTML5的Web跨设备超声波通信方案

前言:Chirp在iPhone上掀起了有声传输文件的序幕,我们再也不需要彩信.蓝牙配对.IM来传送数据.它通过“叽叽喳喳”的小鸟叫声来分享数据,简单有趣,而且可以快速的实现一对多的分享. 此外支付宝曾经试推过“声波支付”,利用手机发送超声波至终端作为交易密码进一步完成交易.然而支付宝的技术目前只是使用在了支付上,而需要可接受声波支付的特定售货机方可使用. <Advanced Sound for Games and Interactive Apps - WebAudio API>的作者Boris

docker同宿主机容器和不同宿主机容器之间怎么通信?

第一部分 docker有四种网络模式第一种:bridge 模式当docker进程启动时,主机上会创建一个名为docker0的虚拟网桥,容器内部会创建一个只能容器内部看到的接口eth0,eth0 和docker0工作方式就像物理二层交换机一样,可以互相通信. 命令执行过程:#docker run -tid --net=bridge --name docker_bri1 ubuntu-base:v3#docker run -tid --net=bridge --name docker_bri2 ub

多机部署之定时任务完整方案

1.场景描述 老项目需要多机部署,项目中有几十个定时任务,一旦多机部署,定时任务就会重复执行,固定ip与错开时间方案都存在较大弊端,最终采用的方案是:AOP+排他锁的方式,软件老王已验证通过,介绍下,有需要的朋友可以参考下. 2.解决方案 软件老王基本方案是采用:AOP+排他锁的方式. (1)目前老项目有几十个定时任务,采用AOP的方式,可以保证代码的无侵入(即使简单的微侵入,例如增加几行代码,测试验证的工作量也会比较大的). (2)采用排他锁的方式,保证批处理的高可用,不重复执行. 2.1 A

iframe跨域通信方案

概述 JavaScript出于安全方面的考虑,不允许跨域调用其他页面的对象.但在安全限制的同时也给注入iframe或是ajax应用上带来了不少麻烦.这里把涉及到跨域的一些问题简单地整理一下: 首先什么是跨域,简单地理解就是因为JavaScript同源策略的限制,a.com 域名下的js无法操作b.com或是c.a.com域名下的对象.更详细的说明可以看下表: 对于主域相同子域不同的通信方法这里不一一列举了,这里主要讲解一下跨主域的通信问题. postMessage方法 window.postMe