30:T5c1,md`# Bring your own Identity with IndieAuth This Notebook provides _identity_, a function that generates an RelMeAuth/IndieAuth identity URL. It is recommended you host your own permanent identity on your homepage on a domain that *you* own, but this notebook is useful for programatically creating temporary, experimental, throw away or test identities, and for explaining how it works. ~~~ import {identity} from '@endpointservices/identity' ~~~ ~~~js identity({ title: "Tom Larkworthy", // Optional link name // For RelMeAuth you can delegate signin to a third party like Github // Those profile have to backlink to this identity URL for the link to be usable for login me: [ "https://observablehq.com/@tomlarkworthy", "https://tomlarkworthy.endpointservices.net/", "https://github.com/tomlarkworthy", ], // For IndieAuth you can bring your own endpoints, but it's not necessary authorization_endpoint: "https://endpointservice.web.app/notebooks/@endpointservices/auth/deploys/authorization_endpoint/mods/X/secrets/endpointservices_secretadmin_service_account_key", token_endpoint: "https://endpointservice.web.app/notebooks/@endpointservices/auth/deploys/token_endpoint/mods/X/secrets/endpointservices_secretadmin_service_account_key" }) ~~~ ### Testing the identities You can use these identities with services that accept IndieAuth login like the IndieWeb [wiki](https://indieweb.org/) or the one below `31:T86a,md` ### How [RelMeAuth](http://microformats.org/wiki/relmeauth) works RelMeAuth allows a person to express which 3rd party profiles are theirs across different social sites. This is achieved by linking to their 3rd party profiles from their homepage AND backlinking their homepage from their 3rd party profiles with *rel="me"* hyperlinks. ~~~html <-- A visible rel="me" link --> My Github profile <-- An invisible rel="me" link --> ~~~ Once the person has identified themselves across different social sites, the "login with Github/Facebook/Google" can be used to identify that person using their public homepage URL as the identity key (not email). So if an authorization has the right Oauth client configured, it may use the 3rd party identity infrastructure to authenticate that person but use their custom identity URL as the *user_id*. By using a homepage URL you give your users the ability to switch social providers and give them control on what information they share. This is all you need to build stateful applications. To summarize, RelMeAuth is the technology that allows a homepage URL to be used as a user identifier, and describes how to link that identifier to existing Oauth 2.0 identity providers. ### How [IndieAuth](https://indieweb.org/IndieAuth) works IndieAuth allow a person to bring their own *authorization_endpoint* (and *token_endpoint*). It scans the identity URL looking for links with *rel="authorization_endpoint"*. Here is an example that uses [micro.blog](https://micro.blog/account/menus/40423) as an identity provider. ~~~html ~~~ But users are free to use whatever for the *authorization_endpoint* as long as it follows the [IndieAuth spec](https://indieauth.spec.indieweb.org/). Some people have *brought their own SMS verification*. In this notebook we supply an authorization_endpoint that authenticates anybody (like a public identity). `32:T703,function password_authorization_endpoint({ me, // function that returns a string or a string secret // Encrypted empty payload protected by password generated in @endpointservices/notebook-secret }) { return deploy("password_authorization_endpoint", async (req, res) => { const params = decodeJsonOrForm(req.body); if (req.method === 'GET') { res.send(` `) } else if (req.method === 'POST' && params.password) { try { await decode(params.password, secret); const code = randomId(16); await firebase.database().ref( `@endpointservices/password_authorization_endpoint/${code}` ).set({ me: typeof me === 'function' ? me() : me, timestamp: {".sv": "timestamp"} }) res.redirect(`${req.query.redirect_uri}?code=${code}&state=${req.query.state}`) } catch (err) { res.status(403).send(`Incorrect password: ` + err.message) } } else if (req.method === 'POST' && params.code) { const payload = (await firebase.database().ref( `@endpointservices/password_authorization_endpoint/${params.code}` ).once('value')).val() res.json({ "me": payload.me }); } else { res.status(400).send(`Unknown request method ${req.method}`) } }, { modifiers: ['terminal'] }); } 33:[{"id":"6793c52f1980b9ecd4a838f322eb23b5b57c8125d9ae80ea91408f7f8c3ae1b4d6fe5d77bda83ba60aeeeaef65799df723a146986e363c74219abd9383c15474","href":"https://static.observableusercontent.com/files/6793c52f1980b9ecd4a838f322eb23b5b57c8125d9ae80ea91408f7f8c3ae1b4d6fe5d77bda83ba60aeeeaef65799df723a146986e363c74219abd9383c15474","name":"logo.svg","type":"image/svg+xml","lastModified":1616097241783.096,"size":1606},{"id":"df501385ecbb382199076ccbc922bedf7ff4f3f8c2d21d25322ed7db4b5d8376aea5c0f8d6213d0ebc6bdd5bd3ef0860cba924468f5499515d43654c1d8e1df0","href":"https://static.observableusercontent.com/files/df501385ecbb382199076ccbc922bedf7ff4f3f8c2d21d25322ed7db4b5d8376aea5c0f8d6213d0ebc6bdd5bd3ef0860cba924468f5499515d43654c1d8e1df0","name":"Identity.png","type":"image/png","lastModified":1618909720892.396,"size":113950}] 2e:{"title":"Bring your own Identity with IndieAuth","cells":[{"id":375,"value":"bannerImage(await FileAttachment(\"Identity.png\").url(), \"Bring your own Identity with IndieAuth\")","pinned":false,"hidden":false,"mode":"ojs"},{"id":0,"value":"$30","pinned":false,"hidden":false,"mode":"ojs"},{"id":460,"value":"weblogin","pinned":false,"hidden":false,"mode":"ojs"},{"id":448,"value":"$31","pinned":false,"hidden":false,"mode":"ojs"},{"id":210,"value":"md`## Implementation`","pinned":false,"hidden":false,"mode":"ojs"},{"id":58,"value":"function identity({\n title,\n authorization_endpoint,\n token_endpoint,\n me = [] // Array of {href:..., label:...} for transforming into rel=\"me\" links.\n} = {}) {\n const content = `\n${authorization_endpoint || token_endpoint ?\n`\\n ${authorization_endpoint ?\n `\\n `\n : ''}${token_endpoint ?\n `\\n `\n : ''}\n `:``}\n \n${me.map(me => `

${me}`).join('\\n')}\n \n\n` \n const link = deploy(title || \"identity\", (req, res) => {\n res.send(content);\n }, {\n modifiers: ['terminal']\n });\n \n return html`

Identity URL: ${title || link.href}\n

HTML:\n

\n${escapeHtml(content)}\n

\n\n \n

`\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":103,"value":"md`## Basic RelMeAuth Example:`","pinned":false,"hidden":false,"mode":"ojs"},{"id":106,"value":"identity({\n // For RelMeAuth you can delegate signin to a third party like Github\n // Those profile have to backlink to this identity URL for the link to be usable for login\n me: [\n \"https://observablehq.com/@tomlarkworthy\",\n \"https://tomlarkworthy.endpointservices.net/\",\n \"https://github.com/tomlarkworthy\",\n ],\n })","pinned":false,"hidden":false,"mode":"ojs"},{"id":312,"value":"md`## Public IndieAuth Identity Example\n\nYou can create an identity anybody can use by setting an autentication_endpoint that always says 'yes'.\n\nThis works with the Indielogin.com [login](https://indielogin.com/?url=https%3A%2F%2Findieweb.org%2FMain_Page), copy the public link address and try it!\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":319,"value":"publicIdentity = identity({\n title: \"demo\",\n authorization_endpoint: yes_authorization_endpoint.href,\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":323,"value":"yes_authorization_endpoint = deploy(\"yes_authorization_endpoint\", async (req, res) => {\n if (req.method === 'GET') {\n res.send(`\n

@endpointservices/identity

log in\n `)\n } else if (req.method === 'POST') {\n res.json({\n \"me\": \"https://webcode.run/notebooks/@endpointservices/identity/deploys/demo/mods/T\"\n });\n } else {\n res.status(400).send(`Unknown request method ${req.method}`).end()\n }\n}, {\n modifiers: ['terminal']\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":394,"value":"md`## Password protected IndieAuth Identity\n\nThis is useful for getting started, you can link your Observable profile website to this identity URL and have the identity URL provide an encrypted password check.\n\nGenerate the encrypted payload at [@endpointservices/notebook-secret](https://observablehq.com/@endpointservices/notebook-secret)\n\n~~~js\n import {passwordIdentity} from '@endpointservices/identity'\n~~~\n\n~~~\n passwordIdentity({\n // Set to your profile\n observableProfile: \"https://observablehq.com/@\"\n // Generate secret containing password in https://observablehq.com/@endpointservices/notebook-secret\n secret: { \n \"name\": \"AES-GCM\",\n \"salt\": \"...\",\n \"iv\": \"...\",\n \"ciphertext\": \"...\"\n }\n })\n // Afterwards, copy the full identity URL and put as a website on your observable profile settings.\n~~~\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":417,"value":"examplePasswordIdentity = passwordIdentity({\n observableProfile: 'https://observablehq.com/@tdlgkjfhdljovtttqrzu',\n // Generate secret containing password in https://observablehq.com/@endpointservices/notebook-secret\n secret: {\n \"name\": \"AES-GCM\",\n \"salt\": \"feFj6binNuEdRw==\",\n \"iv\": \"r13pwmES52PcUuQx\",\n \"ciphertext\": \"73u0IiXvo5Wt6uPCDDaB9w==\"\n }\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":578,"value":"md`## Password protected authorization_endpoint\n\nA password protected *authorization_endpoint* can be used as an IndieAuth authentication method. You can, for instance, add it to your Observable profile as a website and then login with your Observable profile as your Identity URL.\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":520,"value":"$32","pinned":true,"hidden":false,"mode":"ojs"},{"id":478,"value":"function passwordIdentity({\n observableProfile,\n secret\n} = {}) {\n let identityURL = undefined;\n const my_authorization_endpoint = password_authorization_endpoint({\n me: () => identityURL,\n secret\n })\n const indentityPage = identity({\n title: `${observableProfile.match(/@([^/]*)/)[1]}`,\n authorization_endpoint: my_authorization_endpoint.href,\n me: [observableProfile]\n })\n \n identityURL = indentityPage.querySelector('a').href;\n return indentityPage;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":400,"value":"import {decode} from '@endpointservices/notebook-secret'","pinned":false,"hidden":false,"mode":"ojs"},{"id":432,"value":"function decodeJsonOrForm(text) {\n try {\n return JSON.parse(text)\n } catch(err) {\n return Object.fromEntries(new URLSearchParams(text))\n }\n} ","pinned":false,"hidden":false,"mode":"ojs"},{"id":54,"value":"import {deploy} from '@endpointservices/serverless-cells'","pinned":false,"hidden":false,"mode":"ojs"},{"id":194,"value":"import {escapeHtml} from '@mbostock/escaping-html'","pinned":false,"hidden":false,"mode":"ojs"},{"id":371,"value":"import {bannerImage} from '@observablehq/banner@463'","pinned":false,"hidden":false,"mode":"ojs"},{"id":452,"value":"import {weblogin, user} from '@endpointservices/weblogin-for-firebase'","pinned":false,"hidden":false,"mode":"ojs"},{"id":574,"value":"import {randomId} from '@tomlarkworthy/randomid'","pinned":false,"hidden":false,"mode":"ojs"},{"id":573,"value":"import {firebase} from '@endpointservices/utils'","pinned":false,"hidden":false,"mode":"ojs"},{"id":597,"value":"import { footer } from \"@endpointservices/footer-with-backups\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":601,"value":"footer","pinned":false,"hidden":false,"mode":"ojs"}],"files":"$W33","stdlib":"1","titling":"auto"}