Skip to content

Instantly share code, notes, and snippets.

@david-risney
Created March 25, 2016 03:56
Show Gist options
  • Save david-risney/7d6b2da6e5f2fd57eca6 to your computer and use it in GitHub Desktop.
Save david-risney/7d6b2da6e5f2fd57eca6 to your computer and use it in GitHub Desktop.
This code won't run - just trying to get the idea across of how we might replace registerProtocolHandler, but only if register and registee both agree to use the replacement.
Page that wants to register:
<iframe class="hidden" src="http://you.github.io/registerProtocolHandler/" id="registerProtocolHandler"></iframe>
<script>
document.getElementById("registerProtocolHandler").contentWindow.postMessage({
operation: "setRegistration",
scheme: "web+action",
handler: "http://me.com/?url=%s"
}, "http://you.github.io/");
</script>
Page that wants to read a registration:
<iframe class="hidden" src="http://you.github.io/registerProtocolHandler/" id="registerProtocolHandler"></iframe>
<script>
addEventListener("message", function (eventArg) {
// received registration info for 'web+action'
});
document.getElementById("registerProtocolHandler").contentWindow.postMessage({
operation: "getRegistration"
scheme: "web+action"
}, "http://you.github.io/");
</script>
The http://you.github.io/registerProtocolHandler/index.html page:
<script>
addEventListener("message", function (eventArg) {
switch (eventArg.data.operation) {
case "setRegistration":
if (confirm("Let " + eventArg.data.handler + " handle " + eventArg.data.scheme + "?")) {
localStorage["registration"] = localStorage["registration"] || {};
localStorage["registration"][eventArg.data.scheme] = eventArg.data.handler;
}
break;
case "getRegistration":
eventArg.source.postMessage({
scheme: eventArg.data.scheme,
handler: (localStorage["registration"] || {})[eventArg.data.scheme]
}, eventArg.origin);
break;
}
});
</script>
@david-risney
Copy link
Author

Apologies for not explaining my idea well.

Http://Blog1.org, instead of calling registerProtocolHandler does the postMessage for setRegistration to https://sebilasse.github.io/registerProtocolHandlerFallback/

Http://blog2.net, instead of navigating to web+action:, does the postMessage getRegistration to https://sebilasse.github.io/registerProtocolHandlerFallback/ to obtain the web+action scheme handler and then navigate to that handler.

The https://sebilasse.github.io/registerProtocolHandlerFallback/ page is a client side JS only page so it'seasy to host anywhere like on github.io. The point of this page is to act as an independent third party that manages scheme registration. instead of asking devs to navigate to web+action you ask them to postMessage your fallback page to determine what handles web+action.

Not ideal, but if you wrap in a JS library you provide, then perhaps not too cumbersome for devs to use.

The only other thought I have is to implement registerProtocolHandler as an Edge extension. As an extension I believe we can inject a registerProtocolHandler function and intercept navigation to URI schemes that we choose. In my mind this is the worse option since it requires the end user to go install an extension.

@sebilasse
Copy link

Ah - ok - got that :
This is the "intermediate page fallback" and yes off course, that would have been my "last option" as well ;)
Just the domain names were misleading.
Let's name the github.io stuff to indieauth.com (just to say it is the third party)...
However:
The problem here is that I would want to check the integrity of the third party "client side JS only page" with
https://developer.mozilla.org/en-US/docs/Web/Security/Subresource_Integrity
And well, this is not supported by Edge either.

@sebilasse
Copy link

@david-risney Apart from that – how would we prevent that anyone else calls "setRegistration".
The most important point in the spec. here is the "native ui baked in the browser" to ask the user in front of Edge...

@david-risney
Copy link
Author

Just for my example I have a confirm call to ask the user if they want to allow registration. For the real thing you'd probably want to open a new window and present better, richer UX.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment