Navigator.registerProtocolHandler All In One
Navigator.registerProtocolHandler All In One
Web API
custom protocol
URL Schemes
URL Protocols
https://caniuse.com/?search=registerProtocolHandler
不推荐使用，支持不足
https://html.spec.whatwg.org/multipage/webappapis.html#custom-handlers
registerProtocolHandler
Navigator
navigator.registerProtocolHandler(scheme, url, title);
// navigator.registerProtocolHandler(scheme, url)
https://developer.mozilla.org/zh-CN/docs/Web/API/Navigator/registerProtocolHandler
URI syntax
RFC 3986 - Uniform Resource Identifier (URI)
https://tools.ietf.org/html/rfc3986
https://www.w3.org/Addressing/URL/uri-spec.html
https://developers.exlibrisgroup.com/ulrichsweb/apis/ulrichsweb_sru_search_api/uri-syntax/
demo
navigator.registerProtocolHandler("web+xgqfrms", "https://www.xgqfrms.xyz?uri=%s", "自定义 URL Scheme");
error
OK
"use strict";
/**
*
* @author xgqfrms
* @license MIT
* @copyright xgqfrms
* @created 2020-11-11
* @modified
*
* @description
* @difficulty Easy Medium Hard
* @complexity O(n)
* @augments
* @example
* @link
* @solutions
*
* @best_solutions
*
*/
const log = console.log;
let startTime = performance.now();
window.addEventListener(`load`, (e) => {
log(`window load`);
log(`page is fully loaded`);
});
window.addEventListener(`DOMContentLoaded`, (e) => {
log(`window DOMContentLoaded`);
// log(`DOM fully loaded and parsed`);
});
const logVisit = (url = ``) => {
// Test that we have support
if (!navigator.sendBeacon) {
// XHR fallback
return true;
} else {
// URL to send the data to, e.g.
// let url = `/api/log`;
// Data to send
let data = new FormData();
data.append(`start`, startTime);
data.append(`end`, performance.now());
data.append(`url`, document.URL);
// Let`s go!
navigator.sendBeacon(url, data);
}
};
// 将日志记录封装到一个函数中，则可以在页面卸载时调用它。
window.addEventListener(`pagehide`, (e) => {
log(`window beforeunload`);
// good place for sendBeacon
logVisit(`/api/log`);
if (event.persisted) {
/* the page isn't being discarded, so it can be reused later */
}
}, false);
document.addEventListener(`visibilitychange`, (e) => {
// window.addEventListener(`visibilitychange`, (e) => {
log(`document.visibilityState`, document.visibilityState);
// if (document.visibilityState === `hidden`) {
// if (document.visibilityState === `visible`) {
// backgroundMusic.play();
// } else {
// backgroundMusic.pause();
// }
// log(`window visibilitychange`);
// good place for sendBeacon
logVisit(`/api/log`);
});
window.addEventListener(`beforeunload`, (e) => {
log(`window beforeunload`);
// bad place for sendBeacon
// logVisit(`/api/log`);
});
window.addEventListener(`unload`, (e) => {
log(`window unload`);
// bad place for sendBeacon
// logVisit(`/api/log`);
});
// navigator.sendBeacon(`https://www.xgqfrms.xyz/`, `hello `);
<!DOCTYPE html>
<html lang="zh-Hans">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<meta name="author" content="xgqfrms">
<meta name="generator" content="VS code">
<title>URL-Scheme</title>
<style>
* {
box-sizing: border-box;
margin: 0;
padding: 0;
}
div{
padding: 10px;
}
</style>
<!-- <link rel="stylesheet" href="./index.css"> -->
</head>
<body>
<header>
<h1>URL-Scheme</h1>
</header>
<main>
<div>web+???</div>
<div>
<a href="web+xgqfrms/cdn">web+xgqfrms/cdn</a>
</div>
<div>
<a href="web+xgqfrms">web+xgqfrms</a>
</div>
<div>
<a href="web+cdn">web+cdn</a>
</div>
</main>
<footer>
<p>copyright© xgqfrms 2020</p>
</footer>
<!-- js -->
<script src="./url-scheme.js"></script>
</body>
</html>
window.open(`web+xgqfrms`);
https://cdn.xgqfrms.xyz/URL-Scheme/
https://cdn.xgqfrms.xyz/URL-Scheme/web+xgqfrms
mailto:
<h1>mailto: & E-mail links</h1>
<a href="mailto:support@xgqfrms.xyz">send an email for support</a>
<p>...</p>
<a href="mailto:support@xgqfrms.xyz?cc=name2@rapidtables.com&bcc=name3@rapidtables.com&subject=The%20subject%20of%20the%20email&body=The%20body%20of%20the%20email">
Send mail with cc, bcc, subject and body
</a>
example
<!DOCTYPE HTML>
<html lang="zh-Hans">
<head>
<title>Web Protocol Handler Sample - Register</title>
<script type="text/javascript">
const url = "https://cdn.xgqfrms.xyz/API/handler.html?msg=%s";
if (!navigator.isProtocolHandlerRegistered("web+xgqfrms", url)) {
navigator.registerProtocolHandler("web+xgqfrms", url, "URL Protocol");
}
</script>
</head>
<body>
<h1>Web Protocol Handler Sample</h1>
<p>This web page will install a web protocol handler for the <code>web+xgqfrms:</code> protocol.</p>
</body>
</html>
<!DOCTYPE HTML>
<html lang="zh-Hans">
<head>
<title>Web Protocol Handler Sample - Test</title>
</head>
<body>
<p>Hey have you seen <a href="web+xgqfrms:you%20passed%20message">this</a> before?</p>
</body>
</html>
// open
https://cdn.xgqfrms.xyz/API/handler.html?msg=%s
web+xgqfrms:you%20passed%20message
https://cdn.xgqfrms.xyz/API/handler.html?msg=web+xgqfrms:you%20passed%20message
refs
xgqfrms 2012-2020
www.cnblogs.com 发布文章使用：只允许注册用户才可以访问！
Navigator.registerProtocolHandler All In One的更多相关文章
- window.navigator All In One
window.navigator All In One navigator "use strict"; /** * * @author xgqfrms * @license MIT ...
- 让Chrome 接管邮件连接，收发邮件更方便了
页面中除了传统的超链接外,还可以将邮箱地址写入<a>标签,意思不表自明,当然是用户点击后就会打开相应的邮件客户端向这个连接指向的邮件地址发邮件. <a href="mail ...
- Browser detect
A useful but often overrated JavaScript function is the browser detect. Sometimes you want to give s ...
- Mozilla对HTML5规范支持列表
翻译自Mozilla Developer Network 在2009年10月28日,HTML 5规范草稿在网络超文本应用技术工作组(WHATWG)中基本出于最后定稿阶段,这意味着HTML 5标准基本定 ...
- jQuery 1.9不支持$.browser 怎么判断浏览器类型和版本
$.browser.mozilla = /firefox/.test(navigator.userAgent.toLowerCase());$.browser.webkit = /webkit/.te ...
- html5test
html5test Github https://github.com/NielsLeenheer/html5test 主程序是 scripts/7/engine.js 目前看到的分类大部分是基于判断 ...
- HTML5入门总结 HTML5API
w3cshools MDN英文 MDN中文 HTML5 HTML5 is the latest evolution of the standard that defines HTML. The t ...
- HTML5和CSS3
一.HTML5 HTML5 是 HTML 标准的最新演进版本. 这个术语代表了两个不同的概念:它是一个新的 HTML 语言版本包含了新的元素,属性和行为,同时包含了一系列可以被用来让 Web 站点和应 ...
- Javascript 高级程序设计--总结【三】
******************** Chapter 8 BOM ******************** BOM由浏览器提供商扩展 window: 既是js访问浏览器窗口的接口,又是Globa ...
随机推荐
- E4.IO.pry/0-IO.break!/1动态打点调试
IO.pry/0 IO.inspect只能在静态地打印指定的变量,Elixir的shell还可以使用IO.pry/0与IO.break!/1实现更灵活的调试方法. 假如你想查看一下函数的某个位置到底发 ...
- calc, support, media各自的含义及用法？
@support主要是用于检测浏览器是否支持CSS的某个属性,其实就是条件判断,如果支持某个属性,你可以写一套样式,如果不支持某个属性,你也可以提供另外一套样式作为替补. calc() 函数用于动态计 ...
- XV6学习（8）中断和设备驱动
驱动是操作系统中用于管理特定设备的代码:驱动控制设备硬件,通知硬件执行操作,处理中断,与等待该设备IO的进程进行交互. 当设备需要与操作系统进行交互时,就会产生中断(陷阱的一种),之后内核的陷阱处理代 ...
- Spring听课笔记（tg）AOP
好文:https://blog.csdn.net/javazejian/article/details/56267036 通过一个实例来理解 1. 需求:实现算术计算器,可以加减乘除,同时记录日志 ...
- koa2+koa-generator+mysql快速搭建nodejs服务器
koa2+koa-generator+mysql快速搭建nodejs服务器 用koa的脚手架koa-generator可以快速生成项目骨架,可以用于发开或者测试接口 https://github.co ...
- Prometheus+Grafana监控SpringBoot
Prometheus+Grafana监控SpringBoot 一.Prometheus监控SpringBoot 1.1 pom.xml添加依赖 1.2 修改application.yml配置文件 1. ...
- burpsuite是用教程
1.下载burp suite工具 首先要明确,需要java环境,并且配置java环境变量 可以通过吾爱破解下载工具 工具: 双击打开后直接点next --> start burpsuite: 3 ...
- Java排序算法（四）希尔排序2
Java排序算法(四)希尔排序2 希尔排序移步法:分组+直接插入排序组合 一.测试类SortTest import java.util.Arrays; public class SortTest { ...
- Jenkins（3）拉取git仓库代码，执行python自动化脚本
前言 python自动化的脚本开发完成后需提交到git代码仓库,接下来就是用Jenkins拉取代码去构建自动化代码了 新建项目 打开Jenkins新建一个自由风格的项目 源码管理 Repository ...
- Codeforces Round #648 (Div. 2) C. Rotation Matching
题目链接:https://codeforces.com/contest/1365/problem/C 题意 有两个大小为 $n$ 的排列,可以循环左移或右移任意次,问最多有多少对同一值在同一位置. 题 ...