I may have found an alternative solution to my blog's comment system.
Artwork source: "Mastodon mascot as postman" by David Revoy, based on the mascot of joinmastodon.org − CC-BY 4.0
Two days ago I decided to give up on my blog's commenting system. I wrote about a solution that I had tried but abandoned along the way: synchronizing comments from my Mastodon account. I abandoned it because I thought that my instance automatically flushed all posts older than 30 days, and it was too ephemeral to be a long-term solution.
But here is an update: I was wrong. The instance doesn't auto delete the message and an admin on my Mastodon instance contacted me to tell me the reason: they had an accident that resulted in the loss of comments older than that date. And he assured me that they don't plan to do it again.
So, in light of this new element, I've decided to give my solution another try, even if it only affects the last five articles published on my blog after 25 June 2023. The solution works (you can see it in the footer of my recent posts) and I'm happy to have an alternative commenting system back here.
As many of you understood from my previous post, removing them was really emotionally difficult for me.
I'll share my code and method if you want to get something similar on your blog:
Demo page
Demo of the Php code (public mode).
The Php code
A single file that requires pretty common php libraries (Json, Curl).
https://framagit.org/Deevad/mastocomblog/-/blob/main/index.php , (MIT License).
Git repository: https://framagit.org/Deevad/mastocomblog
Changelog:
2023-07-29:
- Move from the Snippet on Invent.kde.org to a Git repository on Framagit.org.
- Privacy: Hide DM(direct) and Followers Only(private) messages.
- Security: prevent harder code injections.
- Support more attachement type.
- Security: prevent page flooding with high character limit.
- Display account address for readability of quoted discussions.
- Decorate :custom_emojis: everywhere and (status) in display name.
a screenshot of a sample of the (v1alpha) code
Setup
The script needs to be in a directory with write permissions to write the cached json files. You can customize the path to this directory with $cache_target
at the start of the CACHE section in the code.
$mastodon_post_id
The 18 numbers of your Mastodon post. You'll find this number on the URL of your post on Mastodon.
$mastodon_server
Your Mastodon instance URL.
$mastodon_account
Your account.
Token and authentification:
$your_mastodon_access_token
(optional) This is a token you can get in your Mastodon account by going to Settings → Development and registering your site here. Without this token, the API will run in "public mode" and will limit the number of messages you can list (~60 for my instance). Instances of Mastodon might have no public mode enabled. In this case the authentication token method might be mandatory to connect to your messages.
Cache: I wrote a caching system because with more than 13K daily visitors to my blog (which sometimes peaks at over 300K), I did not want to be a problem for the bandwidth of my Mastodon instance. The default in the code is set to 24h. You can extend it with something more complex if your blog system gives you a date. I use 1h for this week's blog post, then 4h for the month and 12h after that. Just be kind to the bandwidth of your Mastodon instance and donate to them to help cover the server costs.
Inspiration
The inspiration for this system came from Carl Schwan's blog post "Adding comments to your static blog with Mastodon". If you are looking for a Javascript client-side method, check out his post.
I also found a real-life example of authentication by token to be very useful, found on "MastodonBotPHP" by Grimstack aka Eleirbag89 on Github.
Also very useful is the official Mastodon API documentation, well done to the contributors who maintain this kind of detailed documentation.
Bonus artwork: because I'm happy, here's a happy Mastodon mascot as a postman that I painted this morning.
79 comments
sysop408@sfba.social
I’m rebuilding a content platform of mine and I’m all over this. I’ve always wanted a comments board that could be in multiple places at once!
fabianfucci@socel.net
Super cute!
★bison@mastodon.social
this is so cool :BlobhajTinyHeart:
★and cute mascot interpretation :BlobhajHeart:
andreagrandi@mastodon.social
the postman mascot is simply beautiful 😍
★davidrevoy
@andreagrandi 😊 Thank you.
★gunchleoc@ailbhean.co-shaoghal.net
Testing 🙂
Thank you for sharing the source code!
davidrevoy
@gunchleoc 😊 I'll flush the cache so your message will be in-sync faster on the blog.
★gunchleoc@mastodon.scot
Thanks!
An improvement idea: A JavaScript "Copy" button to copy the post's URL. Or copy it as an on-click event on the link's text.
Instructions: https://www.w3schools.com/howto/howto_js_copy_clipboard.asp
davidrevoy
@gunchleoc 😍 Oh, that's a great idea. I'll do that. Thank you for the link.
★hairylarry@gamerplus.org
@davidrevoy@framapiaf.org
★This is really cool and may work as a commenting system for my Plain Text Blog which is written in php.
LilaTequila
★Stylé !!
nnjeremy@social.wakemu.fr
It's a very good idea !
Thanks for sharing the code 😄
jherazob@mastodon.ie
I feel like Lemmy or Kbin would make more sense for this but I guess ActivityPub makes it irrelevant since they can interact anyway
Excellent idea!
lebout2canap@mastodon.tedomum.net
@jherazob I tried to answer from my Lemmy account (a bit abandoned), and I can't. But it's quite possible that I'm not going about it the right way.
★
davidrevoy
@lebout2canap @jherazob Interesting. Let me know if you find a way.
★AAMfP@fosstodon.org
★Glad you're back. hope everything will go fine. 👍🏻
luana@tech.lgbt
nice!
★libsys@chilemasto.casa
cool
Wolthera@mastodon.art
Cool that you managed to get this to work!
I think the authentication token is also necessary for mastodon instances that have authorized fetch enabled, because the point of that is to ensure randos don't just get to have info without the server being sure said rando isn't trying to block evade or whatever, but not 100% sure.
★davidrevoy
@Wolthera Thanks! Oh, that's a good point. I'll report this in the blog-post.
★basil@trivial.observer
this is the way 😃
★touhoppai@mastodon.social
Un poil plus compliqué pour poster, mais c'est un faible prix à payer pour la tranquillité d'esprit.
★J'espère que l'on aura, à terme, plus d'implémentation activityPub depuis les sites de blog (je crois que WordPress le propose depuis peu) pour que le post avec un lien vers le billet de blog puisse être directement le contenu du blog. Ce serait génial d'arriver jusque là !
davidrevoy
@touhoppai Oui, le va-et-vient après avoir fini l'article d'aller poster sur mastodon, récupérer l'ID, et l'entrer dans l'admin est du taf supplémentaire de mon côté. Il y a certainement des façons d'automatiser tout ça, je vais y regarder afin de pouvoir poster plus fluidement.
★popolon@pleroma.popolon.org
@touhoppai Wordpress supporte le Fediverse (Mastodon n’est qu’un des acteurs) depuis au moins 1 ou 2 ans. Il y en a aussi dans NextCloud, parmi les gros moteurs connus, ou encore Hubzilla. Il y a aussi plein de moteurs très spécialisés dans le Fediverse, qui vont pouvoir être lu dans les fils Mastodon (comme Funkwhale pour la musique, PeerTube pour la vidéo, PixelFed pour les images, etc).
Il y a quelques références ici, mais ça aurait besoin d’une mise à jour : https://fr.wikipedia.org/wiki/Fediverse#Membres_du_Fediverse
★Nartance
And that's a win! Congrats :D \o/
davidrevoy
@Nartance Thank you 👍
nemiryah@s.ilustre.li
Looks like an amazing way to strengthen participation, good job! 🎉
coin@asimon.org
I saw a tech site that uses github comments as a system, but if you do that with Fedi replies, that's also cool.
davidrevoy
@coin Yes, and I would avoid Github, because Microsoft would log all my visitor's data (their browser, geography, operating system and habit of connection to my website) and profile them. A bit too much in exchange of a comment system.
3 ★coin@asimon.org
Fore sure. Yours is better since you have full control. I just remember that the tech site was using github because it had a good spam filter.
potatoxel@pleroma.potatoxel.org
@coin thanks for avoiding github c::::
julian@fietkau.social
It's nice to see another implementation of blog comments using the Mastodon "context" API. 😀 I use it for https://fietkau.blog in a similar way. I additionally filter the replies by visibility and only show the ones set to "public".
If you'd like to read more about how to render custom emoji and other details, I recommend @cassidy's blog post about his implementation: https://cassidyjames.com/blog/fediverse-blog-comments-mastodon/
★davidrevoy
@julian Thank you for the link! Very interesting. 👍
@cassidy
2 ★yoyunix@mastodon.social
I love how it looks exactly the same as the old system. Do you think that after a few years worth of new blog posts that it will ever get to the point where it pings your mastodon instance constantly? It’s cool that it updates every hour, but do you think blog posts will get old enough that you can be safe updating it daily or weekly to avoid this?
★davidrevoy
@yoyunix Thanks. To be fair, I doubt it will last long. Accidents of instance can happen, losing all comments, or the service might also go sunset and be replaced by a new tech more lightweight in the future. Maybe the API will change too with the new versions, up to a point it's too hard to follow for my low skill.
Right now my system on the blog has a cache of 1h for the post of the week, 4h for the post of the month, and 12h after that. Let see in 5 years if If Mastodon IDs are stable 😉
★yoyunix@mastodon.social
any idea what could be a replacement if this fails?
davidrevoy
@yoyunix No idea 😇 The future time will bring new challenges but also probably new solutions. I'll study that when it will happen.
★nunux@mastodon.social
Merci pour vos oeuvres et vos contributions à l'Open source.
😉
★rick@a.n0id.space
whoa nice idea, i also had sth like that in mind. But i just wanted to add a link to the fedi post, and not sync it back to my blog. your solution is way cooler :blobcataww: ★
jcarnu@mastodon.xyz
★Nice job! Nice news!
I love all your créations, they are so joyful !
davidrevoy
@jcarnu ☺️ Thanks!
ApisNecros@ioc.exchange
I'm having troubles creating account on that gitlab instance, but I wanted to let you know that lines 83 and 177 can be removed. You already confirmed that `$mastodon_post_id` only contains numbers and is 18 digits long, and you don't need a content-type header since it's a GET request
★davidrevoy
@ApisNecros Thank you for the advice. I'll note the changes and edit it them soon!
★nomis38
nice happy ending, let's hope troll will stay away. Nice postman ❤️
★davidrevoy
@nomis38 Thanks! Yes, I hope too. I also know the contributors and readers of the blog may help now and take action if they find something to report. It should give a harder time for the trolls and haters to get a message in there with a long life time.
★GeekAndDad@mastodon.social
Love the image!
★valvin
oh nice! Great you've found the reason of missing posts on framapiaf 🙂
★davidrevoy
@valvin 🙂
pre@boing.world
Great. I was gonna suggest that adding activitypub replies to the post was best till you said you'd already tried it.
Glad you've found a way that works.
★farcaller@hdev.im
It's a somewhat roundabout way to comment, but otherwise the experience actually feels nice! Just needs some standard so a browser extension could inject the instance reply UI or something.
★davidrevoy
@farcaller Thanks, and a standard or a browser extension for that would be indeed a cool idea.
utopify_org@veganism.social
Why are our avatars replaced with chatons on the website? Is this because of copyrights?
★davidrevoy
@utopify_org Hey, Good question. I thought a lot about this. It's because of five good reasons:
1. Bandwidth (with many visitors, hot-linking them to all instance all the time is pretty heavy)
★2. Privacy. Hotlinking them would give also log to instance owners of who connect to my website.
3. Loading speed: waiting for all servers to get pictures.
4. Copyright, and/or trolling possibly with p0rn or gore.
5. Aesthetic: I love the cat avatars https://www.peppercarrot.com/extras/html/2016_cat-generator/index.php 🙂
utopify_org@veganism.social
wow, okay, a lot of stuff I wouldn't even thought of until I would run into it.
Thanks for the explanation.
davidrevoy
@utopify_org No worry. I ran into all of them deeply and hard. That's why I keep them in mind now.
★nooe
Seems to work smoothly, congrats!
★RupertReynolds@hachyderm.io
And now I'm happy too :-)
★ollie@tech.lgbt
This is awesome! 👏🤓
Given you said spam was a problem with the previous commenting system, does this mean you consider Mastodon to be reasonably free from spam?
I sort of live in fear that Mastodon might suffer an influx of bots. Especially given it's decentralised, so presumably any instance could contribute unless your instance admin defederates from them.
davidrevoy
@ollie Thanks! Yes, I think the moderation and collective works of all user here with the report buttons makes the place pretty safe.
★I received insult, p0rn, spam, but very rarely, and it was removed after a simple click on the three dots and reporting them. Actually, I wish this post will attract one or two post of this type. I'm curious if the API would list the message if I block an account.
rolle@mementomori.social
Awesome! I've been wanting for something like this, because didn't get hang of the webmentions. Thank you so much for sharing the code, might as well implement it.
★abosio@fosstodon.org
see also https://mastodon.blaede.family/@cassidy/110669429936617026
davidrevoy
@abosio Thanks for the link. I discovered it this evening thanks to another comment. I'm now curious about his method for fetching the custom emojis 🙂
abosio@fosstodon.org
Cool, I skimmed through the replies but didn’t see it. I figured it my be worth a review in case there were any useful nuggets like that.
★AppleTalk@sfba.social
thanks for sharing! I’ve experimented with Mastodon-powered comments on my tiny site too. not quite finished with it yet, will definitely look at your code for inspiration.
★lesateliersphv@mastodon.top
Merci de nous avoir encouragé à garder les commentaires sur nos blogs, voire à les intégrer à #Mastodon. Le mien n'est pas codé avec PHP mais je crois avoir trouvé qui me servira. À suivre...
★En passant, je suis ravi que tu aies trouvé un autre moyen de rester au courant des opinions de tes lecteurs.
raghukamath@mastodon.art
how is GDPR content removal request handled? I assume deleting the comment from the mastodon instance delete it in your blog too.
davidrevoy
@raghukamath Hey, yes. The listing on the blog is just a copy of the Mastodon API, so every edit or removal should be reflected on the blog as soon as the blog updates.
The only thing to keep is a cache of maximum 24h so it is always removing or applying the edit into the due 24h legal date.
I'm planning to add soon an 'emergency refresh' button (just an action that force a cache update for the current article. It might be convenient in case of a very nasty comment. 😺
★hyde@lazybear.social
Carl's post inspired me too 😉
Well done 👍
★nartagnan@mstdn.fr
Quand je suis content, je partage un smiley. Et toi tu nous offre une peinture 😍
kosmimatis@handmade.social
that is great solution! Bravo!!! Keep up your great job!
loaExMachina@jorts.horse
Hell yeah! The legendary FOSS artist found a FOSS solution! I look forwards to commenting on the next Pepper&Carrot with this system!
★thgs@phpc.social
aren't the old comments re-federated? There might be a chance you can still get them back. Except those made by people in the instance that had the problem, I would guess the others should federate again.
Or maybe there is an issue with that as the initial post you made is lost? (So all comments along with it have no real reference).
theotheroracle@tech.lgbt
hope it works out !
agates@activitypub.agates.io
If you put <podcast:socialInteract> under each <item> you can link the RSS feed to ActivityPub. Not that RSS readers use it yet, but they could if enough people adopted it.
https://github.com/Podcastindex-org/podcast-namespace/blob/main/docs/1.0.md#social-interact
Ritzga@snaggletooth.life
super cute!
★stsquad@mastodon.org.uk
★I've done something similar for my blog although the solution is entirely client side JavaScript. It did take me on a deep dive into xss server metadata though for my previously fully static site.
@remram44
aki_goupil@icedtux.no
Oh, that's a really good idea! I struggle a bit with accounts all over the place, so I avoid creating any that isn't necessary. Because of this I had never commented on your blog, even though many articles interest me greatly!
★davidrevoy
@aki_goupil 🙂 Yes, same. Difficult to keep many accounts. Your comment just got sync on the blog, btw: https://www.davidrevoy.com/article981/i-may-have-found-an-alternative-solution-to-my-blogs-comment-system/show#110819217168609542 (if you want to check the concept working 'live'), my reply will now take 4h to appear.
aki_goupil@icedtux.no
I did! I opened the blog link even before, because I wanted to see how it looked. I really like this new system.
★Post a reply
The comments are synchronised every 12h with the replies to this post on Mastodon:How to use this? (click here to unfold)
Open a new Mastodon account on the server of your choice. Then, Copy/Paste the adress above in your Mastodon 'Search' field. The post will appear and you'll be able to fully interact with it. You'll have full control of your posts: edit, remove, etc. After that, your message will appear here.
Just please note that it may take up to 12 hours for your changes to be reflected here.