weyond webmention.io
This commit is contained in:
parent
21f5fd5663
commit
94dd470fa9
|
@ -4,6 +4,7 @@ subtitle: Thoughts about the (d)evolution of blog interactions
|
||||||
date: 2021-03-09
|
date: 2021-03-09
|
||||||
tags:
|
tags:
|
||||||
- privacy
|
- privacy
|
||||||
|
- indieweb
|
||||||
- accessibility
|
- accessibility
|
||||||
categories:
|
categories:
|
||||||
- webdesign
|
- webdesign
|
||||||
|
|
|
@ -0,0 +1,96 @@
|
||||||
|
---
|
||||||
|
title: Host your own webmention receiver
|
||||||
|
subtitle: Beyond webmention.io and static site integration
|
||||||
|
date: 2021-05-16
|
||||||
|
tags:
|
||||||
|
- indieweb
|
||||||
|
- hugo
|
||||||
|
categories:
|
||||||
|
- webdesign
|
||||||
|
---
|
||||||
|
|
||||||
|
Yesterday's "Webmentions Beyond Webmention.io" [IndieWeb event](https://events.indieweb.org/2021/05/webmentions-beyond-webmention-io-zG4JpHhZShVA) ([see notes](https://indieweb.org/2021/Pop-ups/Webmentions_Beyond_Webmention.io)) exposed a problem: many bloggers exploring the IndieWeb and Webmention world simply make use of [webmention.io](https://webmention.io/), a hosted solution that handles receiving mentions, enabling you to treat the whole system as a black box. Aaron wondered: _"why are so many people using webmention.io?"_ - and the answer is quite obvious: because it's easy. Just add `<link rel="webmention href="https://webmention.io/something">` to your HTML header after signing up and you're done.
|
||||||
|
|
||||||
|
The IndieWeb community sometimes forgets that the community mostly consists of tech enthusiasts who know how to program and configure stuff, while many bloggers just want a way to interact with other blogs. They discover the Webmention system, read somewhere it's a contemporary and maybe better alternative to Pingbacks (although [I contested that](/post/2021/03/the-indieweb-mixed-bag/)), and just want to "make use" of it, without losing hours and hours of fiddling with scary code.
|
||||||
|
|
||||||
|
So, is there a decent alternative? No. But their are alternatives which allow you to host your own receiver. Again, these are very much geared towards techies...
|
||||||
|
|
||||||
|
## Enabling Webmentions on Hugo
|
||||||
|
|
||||||
|
Another sore point seemed to be the lack of decent guides for people to follow when trying to enable Webmentions - beyond the WM.io "standard" - on their static sites. Since I wrote a Jamstack/webmention microservice called [go-jamming](https://github.com/wgroeneveld/go-jamming) which is used my blogs, I'd like to take this opportunity to show you how easy it is to do it yourself.
|
||||||
|
|
||||||
|
### Step 1: Running go-jamming yourself
|
||||||
|
|
||||||
|
The service is a single binary that is super easy to run anywhere. Follow the README instructions if you'd like to install it as a Linux service or set up a reverse proxy through Nginx. If all goes according to plan, you'll end up with a `https://jam.yourdomain.com/webmention` and pingback endpiont others can POST to. There!
|
||||||
|
|
||||||
|
Go-jamming _should_ be an easy drop-in replacement for Webmention.io. However, since I wrote it with my own needs taken into consideration, and nobody else as far as I know is running it, it could be that you require a missing feature or so. Ping me, fork the code, ... and we'll work it out.
|
||||||
|
|
||||||
|
### Step 2: Retrieve mentions and store locally
|
||||||
|
|
||||||
|
There are simple GET endpoints available that allow you to fetch mentions from the go-jamming service. I store these under `data/webmentions.json`, enabling the Hugo template engine to access this data. We'll get to that in a minute. How to retrieve? Issue a simple GET request.
|
||||||
|
|
||||||
|
The question is, how to fit this into a typical Hugo/Jamstack build? I have a single JS file in the root of my website that fetches this data using [jam-my-stack](https://github.com/wgroeneveld/jam-my-stack), a few simple wrappers around services such as Lunr and go-jamming:
|
||||||
|
|
||||||
|
```js
|
||||||
|
const mentions = await webmention.getWebmentions("brainbaking.com")
|
||||||
|
const json = JSON.stringify(mentions, null, 4)
|
||||||
|
await fsp.writeFile(`${__dirname}/data/webmentions.json`, json, 'utf-8')
|
||||||
|
```
|
||||||
|
|
||||||
|
There is zero magic involved in `getWebmentions()`: see [webmention.get.js source](https://github.com/wgroeneveld/jam-my-stack/blob/main/src/webmention/get.js), if you do not want to depend on jam-my-stack.
|
||||||
|
|
||||||
|
What triggers this JS script? A [GitHub actions workflow](https://github.com/wgroeneveld/brainbaking/blob/master/.github/workflows/main.yml). It also automatically checks in any changes!
|
||||||
|
|
||||||
|
### Step 3: Integrate webmentions in your Hugo template
|
||||||
|
|
||||||
|
Now that we have a local JSON file, things are dead simple:
|
||||||
|
|
||||||
|
```
|
||||||
|
{{ $mentions := (where .Site.Data.webmentions "relativeTarget" "==" $.RelPermalink) }}
|
||||||
|
{{ range $mentions }}
|
||||||
|
<p class="p-content p-name">
|
||||||
|
{{ .content | safeHTML }}
|
||||||
|
</p>
|
||||||
|
etc!
|
||||||
|
{{ end }}
|
||||||
|
```
|
||||||
|
|
||||||
|
See [my full template file](https://github.com/wgroeneveld/brainbaking/blob/master/themes/brainbaking-minimal/layouts/partials/single-webmentions.html) for a complete example. How do you know which properties to use? Well, a go-jamming mention looks like this:
|
||||||
|
|
||||||
|
```js
|
||||||
|
{
|
||||||
|
"author": {
|
||||||
|
"name": "Wouter Groeneveld",
|
||||||
|
"picture": "/pictures/brainbaking.com"
|
||||||
|
},
|
||||||
|
"name": "",
|
||||||
|
"content": "More nineties collecting nostalgia. After I wrote about it at https://brainbaking.com/post/2021/05/nineties-collecting-nostalgia/ my wife dug up a shoebox full of… well… judge for yourself. From left to right:Kinder Surprise figurines, Polly Pock...",
|
||||||
|
"published": "2021-05-13T15:20:00+00:00",
|
||||||
|
"url": "https://brainbaking.com/notes/2021/05/13h15m20s00/",
|
||||||
|
"type": "mention",
|
||||||
|
"source": "https://brainbaking.com/notes/2021/05/13h15m20s00/",
|
||||||
|
"target": "https://brainbaking.com/post/2021/05/nineties-collecting-nostalgia/",
|
||||||
|
"relativeTarget": "/post/2021/05/nineties-collecting-nostalgia/"
|
||||||
|
},
|
||||||
|
```
|
||||||
|
|
||||||
|
See the [go-jamming documentation](https://github.com/wgroeneveld/go-jamming) for more information.
|
||||||
|
|
||||||
|
### Step 4: Sending out webmentions
|
||||||
|
|
||||||
|
You can also leverage go-jamming's built-in ability to scan your RSS to periodically send out webmentions. Again, if you use jam-my-stack, it's as easy as writing `await webmention.send("brainbaking.com")` that is also triggered using the same GitHub build action.
|
||||||
|
|
||||||
|
Go-jamming does all the rest, such as:
|
||||||
|
|
||||||
|
1. Checking whether there's a new article in your `/index.xml` feed;
|
||||||
|
2. Collecting links to send out;
|
||||||
|
3. Checking if the links have a webmention or pingback endpoint;
|
||||||
|
4. Sending out the mentions accordingly.
|
||||||
|
|
||||||
|
It remembers the last processed post as not to overwhelm other endpoints, so you can call `send()` as many times as you'd like. If you do not like jam-my-stack as a dependency, just write your own: it's simply [a PUT request](https://github.com/wgroeneveld/jam-my-stack/blob/main/src/webmention/send.js)!
|
||||||
|
|
||||||
|
## Does this solve the issue?
|
||||||
|
|
||||||
|
Well, yes and no. There _are_ webmention.io alternatives, such as the one I've written myself, but these do assume a certain level of technical proficiency. Go-jamming makes it possible to service multiple websites: in fact, my endpoint takes care of this site, jefklakscodex.com and redzuurdesem.be. But I do not want to host mentions of others, that kind of defeats the purpose of "owning your data".
|
||||||
|
|
||||||
|
There was also talk about writing "plugins" for static site generators in the meeting yesterday. However, I don't think a plug-and-play version of something like this is likely to ever exist: templates are inherently personal. In my opinion, the method explained in this post is as good as it gets. I do not want to conform API contracts or input/output of go-jamming to yet another (IndieWeb or otherwise) standard that eases drop-ins of webmention servers but puts more burden on the developers of those services...
|
Loading…
Reference in New Issue