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&copy; 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

https://developer.mozilla.org/zh-CN/docs/Web/API/Navigator/registerProtocolHandler/Web-based_protocol_handlers

refs



xgqfrms 2012-2020

www.cnblogs.com 发布文章使用:只允许注册用户才可以访问!


Navigator.registerProtocolHandler All In One的更多相关文章

  1. window.navigator All In One

    window.navigator All In One navigator "use strict"; /** * * @author xgqfrms * @license MIT ...

  2. 让Chrome 接管邮件连接,收发邮件更方便了

    页面中除了传统的超链接外,还可以将邮箱地址写入<a>标签,意思不表自明,当然是用户点击后就会打开相应的邮件客户端向这个连接指向的邮件地址发邮件. <a href="mail ...

  3. Browser detect

    A useful but often overrated JavaScript function is the browser detect. Sometimes you want to give s ...

  4. Mozilla对HTML5规范支持列表

    翻译自Mozilla Developer Network 在2009年10月28日,HTML 5规范草稿在网络超文本应用技术工作组(WHATWG)中基本出于最后定稿阶段,这意味着HTML 5标准基本定 ...

  5. jQuery 1.9不支持$.browser 怎么判断浏览器类型和版本

    $.browser.mozilla = /firefox/.test(navigator.userAgent.toLowerCase());$.browser.webkit = /webkit/.te ...

  6. html5test

    html5test Github https://github.com/NielsLeenheer/html5test 主程序是 scripts/7/engine.js 目前看到的分类大部分是基于判断 ...

  7. HTML5入门总结 HTML5API

    w3cshools  MDN英文  MDN中文 HTML5 HTML5 is the latest evolution of the standard that defines HTML. The t ...

  8. HTML5和CSS3

    一.HTML5 HTML5 是 HTML 标准的最新演进版本. 这个术语代表了两个不同的概念:它是一个新的 HTML 语言版本包含了新的元素,属性和行为,同时包含了一系列可以被用来让 Web 站点和应 ...

  9. Javascript 高级程序设计--总结【三】

    ********************  Chapter 8 BOM ******************** BOM由浏览器提供商扩展 window: 既是js访问浏览器窗口的接口,又是Globa ...

随机推荐

  1. uwsgi 启动django

    1, django 官方文档可配置项如下: 2,启动django 的配置: 1,和settings.py 同级目录下新建wsgi.py  (该配置和manager.py 的配置基本是一样的) impo ...

  2. 回滚原理 Since database connections are thread-local, this is thread-safe.

    mysql django 实践: django @transaction.atomic 机制分析  1.数据库清空表Tab 2.请求django-view        @transaction.at ...

  3. WPF学习里程(二) XAML基础

    1.什么是XAML? 官方语言: XAML是eXtensible Application Markup Language的英文缩写,相应的中文名称为可扩展应用程序标记语言,它是微软公司为构建应用程序用 ...

  4. (四)Springboot以jar包方式启动、关闭、重启脚本

    Springboot以jar包方式启动.关闭.重启脚本 1.启动 2.关闭 3.重启 4.脚本授权 SpringBoot: nohup java -jar zlkj-data-server-1.0-S ...

  5. Java——StringBuffer,String总结

    StringBuffer介绍: Java StringBuffer和StringBuilder类 当对字符串进行修改的时候,需要使用StringBuffer和StringBuilder类. Strin ...

  6. linux最初配置( vimrc设置 、tab键设置 inputrc、中文输入法等等)

    1..vimrc设置   syntax on set tabstop=4 set softtabstop=4 set autoindent set cindent set nu set ruler & ...

  7. Pythonchallenge1过关攻略

    第一关上来是一个电视,上面写着2^38,这就非常关键了,这时候我们已经有了大致思路,再看一眼电视机下面的话确认一下,"Hint: try to change the URL address. ...

  8. Linux下统计CPU核心数量

    首先第一步,cat /proc/cpuinfo processor : 0 vendor_id : GenuineIntel cpu family : 6 model : 45 model name ...

  9. 在Android用vulkan完成蓝绿幕扣像

    效果图(1080P处理) 因为摄像头开启自动曝光,画面变动时,亮度变化导致扣像在转动时如上. 源码地址vulkan_extratest 这个demo主要测试二点,一是测试ndk camera集成效果, ...

  10. Java线程八锁

    package com.atguigu.juc1205; import java.util.concurrent.TimeUnit; class Phone//Phone.java ---> P ...