sanitize-html VS webmention.io

Sometimes I use sanitize-html to clean up the html and ask chatgpt to help me refine my selectors.

One thing to watch out for is that the content of each reply is HTML. To be safe (paranoid), I'm running the HTML through sanitize-html to make sure nobody can inject sketchy HTML into my site.

Don't forget to sanitize your HTML using https://github.com/apostrophecms/sanitize-html or upcoming feature: https://developer.mozilla.org/en-US/docs/Web/API/HTML_Sanitizer_API because https://nimb.ws/leTXDt

Vue does not have as much support for Vue as there is for React. Examples are markdown-it, Remark.js, marked.js. But hopefully in the future, there should be more support, and after much research, I picked marked.js because it has the most stars and has zero vulnerability. Marked does not sanitize (meaning it does not secure HTML documents from attacks like cross-site scripting (XSS) ) marked output HTML as that feature is deprecated and has vulnerability but however, it supports the use of other libraries to secure output HTML such as DOMPurify (recommended), sanitize-html or insane.

Webmentions (webmention.io) are a way to bring social activity and interactivity to your site without having it on your platform itself or needing to have complex systems in place. Harness the activity, audience, and functionality from existing platforms.

async function getMentions(url) { let mentions = []; let page = 0; let perPage = 100; while (true) { const results = await fetch( `https://webmention.io/api/mentions.jf2?target=${url}&per-page=${perPage}&page=${page}` ).then((r) => r.json()); mentions = mentions.concat(results.children); if (results.children.length < perPage) { break; } page++; } return mentions.sort((a, b) => ((a.published || a['wm-received']) < (b.published || b['wm-received']) ? -1 : 1)); }

Webmentions: https://webmention.io/

In the interim, I found myself pondering why every webmentions-on-Hugo solution I’d ever found up to now used JavaScript, rather than trying to do it purely in Hugo. After all, Hugo sports plenty of data-grabbing horsepower. For example: in my own experience to date, I’ve found Hugo's getJSON feature just as useful as the node-fetch on which the aforementioned JS relied to grab data from webmention.io.

One of the building blocks for such a system might be something like:

https://webmention.io/

{ "type": "feed", "name": "Webmentions", "children": [ { "type": "entry", "author": { "type": "card", "name": "Jon Kuperman", "photo": "https://webmention.io/avatar/pbs.twimg.com/a52326c0080bba610767505756be327891f63722c0ceb6515de5840097c65cb9.jpg", "url": "https://twitter.com/jkup" }, "url": "https://twitter.com/jkup/status/1365400108016291841", "published": "2021-02-26T20:35:28+00:00", "wm-received": "2021-02-26T21:23:21Z", "wm-id": 1048723, "wm-source": "https://brid.gy/comment/twitter/raymondcamden/1365399913987792900/1365400108016291841", "wm-target": "https://webmentions.vercel.app/posts/alpha/", "content": { "html": "hello!\n\"u-mention\" href=\"https://twitter.com/raymondcamden\">\n\"u-mention\" href=\"https://webmentions.vercel.app/\">\n\"u-mention\" href=\"https://www.raymondcamden.com/\">", "text": "hello!" }, "in-reply-to": "https://webmentions.vercel.app/posts/alpha/", "wm-property": "in-reply-to", "wm-private": false }, { "type": "entry", "author": { "type": "card", "name": "Jonathan Bossenger", "photo": "https://webmention.io/avatar/pbs.twimg.com/211d2d7837e89b60b4399dfc76f5aa3aad8b2d792335f08ecd65ce6c73da48cb.jpg", "url": "https://twitter.com/jon_bossenger" }, "url": "https://twitter.com/jon_bossenger/status/1365402390212587527", "published": "2021-02-26T20:44:32+00:00", "wm-received": "2021-02-26T21:23:17Z", "wm-id": 1048721, "wm-source": "https://brid.gy/post/twitter/raymondcamden/1365402390212587527", "wm-target": "https://webmentions.vercel.app/posts/alpha/", "content": { "html": "I assume the copy of Edge runs on Ubuntu? \"https://webmentions.vercel.app/posts/alpha/\">webmentions.vercel.app/posts/alpha/\n\"u-mention\" href=\"https://webmentions.vercel.app/\">", "text": "I assume the copy of Edge runs on Ubuntu? webmentions.vercel.app/posts/alpha/" }, "mention-of": "https://webmentions.vercel.app/posts/alpha/", "wm-property": "mention-of", "wm-private": false }, { "type": "entry", "author": { "type": "card", "name": "? cannot even", "photo": "https://webmention.io/avatar/pbs.twimg.com/1f2ab7fe8fb6c20b4a2be803b95f6559677d0b88577a091c2b1755f70dff4247.jpg", "url": "https://twitter.com/diffalot" }, "url": "https://twitter.com/diffalot/status/1365406879459860480", "published": "2021-02-26T21:02:22+00:00", "wm-received": "2021-02-26T21:23:06Z", "wm-id": 1048716, "wm-source": "https://brid.gy/post/twitter/raymondcamden/1365406879459860480", "wm-target": "https://webmentions.vercel.app/posts/alpha/", "content": { "html": "Testing webmentions Alpha Post \"https://webmentions.vercel.app/posts/alpha/\">webmentions.vercel.app/posts/alpha/", "text": "Testing webmentions Alpha Post webmentions.vercel.app/posts/alpha/" }, "mention-of": "https://webmentions.vercel.app/posts/alpha/", "wm-property": "mention-of", "wm-private": false } ] }