平时我们推送网页、打开窗口都是用的 window.open,但是谷歌却不支持这种方法,也不是不支持,是可以打开窗口,但是无法将窗口移动到扩展屏上。

后面经过百度,发现了一个支持谷歌推送网页到扩展屏的方法:PresentationRequest

完整demo:

亲测有效

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>谷歌推送网页</title>
</head>
<body>
<button onclick="test1()">推送</button>
<!-- <button onclick="test2()">重连</button> -->
<!-- <button onclick="test3()">关闭连接</button> -->
<button onclick="test4()">关闭弹窗</button>
<script>
// document: https://w3c.github.io/presentation-api/
var request = new PresentationRequest("https://baidu.com");
navigator.presentation.defaultRequest = request;
let con;
var pId; function test1(){
request.start().then(connect=>{
console.log(connect.url)
console.log(connect.id)
pId = connect.id
}).catch(err=>{console.log(err)});
} // 监测连接是否可用
request.addEventListener("connectionavailable", function(e){
con = e.connection;
con.addEventListener("close", function(){console.log("closed");})
con.addEventListener("terminate", function(){console.log("terminated");})
con.addEventListener("message", function(e){console.log(e.data);})
}) function test2(){
request.reconnect(pId)
} function test3(){
con.close()
} function test4(){
con.terminate()
}
</script>
</body>
</html>

js推送网页到扩展屏上--谷歌浏览器的更多相关文章

  1. 解决本地项目推送到码云(github),上提示:failed to push some refs to ...

    本地项目上传github 命令如下: 1.git init 2.git add . 3.git commit  -m "init" 4.git remote add origin ...

  2. iOS上简单推送通知(Push Notification)的实现

    iOS上简单推送通知(Push Notification)的实现 根据这篇很好的教程(http://www.raywenderlich.com/3443/apple-push-notification ...

  3. ASP.NET SignaiR 实现消息的即时推送,并使用Push.js实现通知

    一.使用背景 1. SignalR是什么? ASP.NET SignalR 是为 ASP.NET 开发人员提供的一个库,可以简化开发人员将实时 Web 功能添加到应用程序的过程.实时 Web 功能是指 ...

  4. NET SignaiR 实现消息的推送,并使用Push.js实现通知

    一.使用背景 1. SignalR是什么? ASP.NET SignalR 是为 ASP.NET 开发人员提供的一个库,可以简化开发人员将实时 Web 功能添加到应用程序的过程.实时 Web 功能是指 ...

  5. 【IoT平台技术对接分享】如何上传正确的消息推送证书

    消息推送应用实现消息推送的接口,部署证书,同时上传根证书到平台. 目前消息推送失败,很大一部分原因是证书上传不对.推荐小伙伴们使用下面的方法导出证书. 推送:平台调用应用服务器的restful接口将数 ...

  6. 关于 实时推送技术--WebSocket的 知识分享

    今天学习了关于WebSocket的知识,觉得挺有用的,在这记录一下,也和大家分享一下!!有兴趣的可以看看哦 WebSocket简介 Web领域的实时推送技术,也被称作Realtime技术.这种技术要达 ...

  7. 【Android应用开发】 推送原理解析 极光推送使用详解 (零基础精通推送)

    作者 : octopus_truth 转载请注明出处 : http://blog.csdn.net/shulianghan/article/details/45046283 推送技术产生场景 : -- ...

  8. asp.net mvc 实现简单的实时消息推送

    因为项目需要,需要在网页上实现消息的推送.在百度上搜索了一下,发现实现网页上的消息推送,可以使用asp.net 中的SignalR类库,当然也可以使用H5的WebSocket  Ajax的轮回.当然此 ...

  9. 手把手教你配置苹果APNS推送服务|钿畑的博客 | 钿畑的博客

    http://www.360doc.com/content/15/0118/17/1073512_441822850.shtml# 钿畑的文章索引 1. 什么是推送通知 2. 什么是APNS? 3. ...

  10. 【DWR系列02】-DWR逆向Ajax即服务器推送

    .literal { background-color: #f2f2f2; border: 1px solid #cccccc; padding: 1px 3px 0; white-space: no ...

随机推荐

  1. 使用ConfuserEx代码混淆工具保护你的.NET应用程序

    前言 .NET应用如何防止被反编译?这个对于我们.NET开发而言是一个值得关注和重视的问题,防止应用程序被反编译的手段有很多本文我们主要讲讲如何使用ConfuserEx .NET开源免费的代码混淆工具 ...

  2. nodejs内存泄漏概要分析

    const heapdump = require('heapdump'); setTimeout( ()=>{ heapdump.writeSnapshot(`${process.cwd()}/ ...

  3. 【Azure 媒体服务】记录一个简单的媒体视频上传到Media Service无法播放问题

    问题描述 从本地上传到Azure Media Service Portal的视频,并且新增定位符后,无法播放.但是上传的其他视频是可以的.疑惑中!! 问题自查 自查发现,是视频的文件名中有个特殊符号. ...

  4. 笔记本linux问题记录

    目录 UEFI笔记本无法引导进入操作系统 grub引导错误,无法进入系统 笔记本亮度不能保存 禁用独立显卡 KVM 解决nmcli dev 中的wlan0显示unavailable 杂项 UEFI笔记 ...

  5. 如何当个优秀的文档工程师?从 TC China 看技术文档工程师的自我修养

    本文系 NebulaGraph Community Academic 技术文档工程师 Abby 的参会观感,讲述了她在中国技术传播大会分享的收获以及感悟. 据说,技术内容领域.传播领域的专家和决策者们 ...

  6. C++ //案列-评委打分 //(容器添加 删除 算法排序 随机数 字符串追加)描述:5名选手 ABCDE,10个评委分别对每一位选手打分,去除最高分,去除评委中的 //的最低分,取平均分

    1 #include<iostream> 2 #include<string> 3 #include<deque> 4 #include<vector> ...

  7. CSV转Excel,命中关键词标红

    CSV转Excel,命中关键词标红 package com.wenwo.schedule.job.mainJob; import java.io.ByteArrayOutputStream; impo ...

  8. 你想要一个简单的 MQ 吗?(最简单的那种)

    FolkMQ 一个简单的消息中间件(全球最简单的那种,要比谁都简单!).追世间简单为何物,可叫我生死相许! 面向简单编程 1) 启动服务 docker run -p 18602:18602 -p 86 ...

  9. 什么叫运行时的Java程序?

    Java程序的运行包含编写.编译和运行三个主要步骤. 1.在编写阶段: 开发人员在Java开发环境中输入程序代码,形成后缀名为.java的Java源文件. 2.在编译阶段: 使用Java编译器对源文件 ...

  10. buntu中查看网卡信息的基础知识

    ubuntunetworkexpress工具网络access Ubuntu 中,通常有线网卡为eth0,无线网卡则为wlan0,后续增加的以此类推(可能某些无线网卡型号命名为eth1,而非wlan0) ...