Example HTML page to register handler

This commit is contained in:
smitten 2023-07-16 22:31:58 -04:00
parent b0e739327e
commit 50480e5087
Signed by untrusted user: smitten
GPG Key ID: 1DDD22F13552A07A
2 changed files with 77 additions and 0 deletions

View File

@ -0,0 +1,61 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Web-based Protocol Registration (web+ap://)</title>
<meta name="description" content="Register a web-based protocol to open fediverse web+ap:// links">
<meta name="author" content="Akkoma">
<meta property="og:title" content="Web Protocol Registration (web+ap://)">
<meta property="og:type" content="website">
<meta property="og:description" content="Register a web-based protocol to open fediverse web+ap:// links">
<link rel="icon" href="/favicon.ico">
<link rel="icon" href="/favicon.svg" type="image/svg+xml">
<style>
body {
margin: 5rem;
}
main {
line-height: 1.5em;
max-width: 50rem;
}
code {
background-color: #eee;
padding: 0.1rem;
}
</style>
</head>
<body>
<main>
<h1>Web-based protocol registration</h1>
<p>
Web-based protocols are a type of URL protocol that your browser can learn how to open.
</p>
<p>
Like <code>mailto:</code> or <code>magnet:</code> links, they are opened by an application of your choice. Unlike <code>mailto:</code> or <code>magnet:</code>, they are not recognized by the browser by default, and need to be registered. <a href="https://developer.mozilla.org/en-US/docs/Web/API/Navigator/registerProtocolHandler/Web-based_protocol_handlers" target="_blank" rel="noreferrer noopener">See MDN for more information</a>.
</p>
<p>
<code>web+ap://</code> links describe an ActivityPub resource address, so that you can open a user profile or a particular post from a remote server, without visiting that server. They will open directly here on your home server instead.
</p>
<p>
For example, the URL <a href="web+ap://seafoam.space/users/m" target="_blank" rel="noreferrer noopener">web+ap://seafoam.space/users/m</a> would open the profile of @m@seafoam.space, as it is shown locally on this server.
</p>
<noscript>
<p>You will not be able to proceed with registration without enabling JavaScript.</p>
</noscript>
<p>
To register this server application to handle web+ap URLs, click below.
<br />You will be prompted to approve - check for a dialog up near your browser URL bar.
<br /><button id="register">register Akkoma app to handle web+ap links</button>
</p>
</main>
<script type="text/javascript" src="/static/web-protocol-register.js"></script>
</body>
</html>

View File

@ -0,0 +1,16 @@
(function () {
function registerHandler() {
try {
navigator.registerProtocolHandler(
"web+ap",
`${window.origin}/.well-known/protocol-handler?target=%s`,
"Akkoma web+ap handler",
)
} catch (e) {
console.error("Could not register", e)
window.alert("Sorry, your browser does not support web-based protocol handler registration.")
}
}
document.getElementById("register").addEventListener("click", registerHandler);
}());