docs: update draft

1 files changed, 51 insertions, 4 deletions

diff --git a/content/article/webmention.md b/content/article/webmention.md
index 4dd39476..f7928cdb 100644
--- a/content/article/webmention.md
+++ b/content/article/webmention.md
@@ -69,7 +69,7 @@ POST https://webmention.app/check/?url=https://my.site/post-xxx
 
 这样就通知了 webmention.app，让它帮你检查你这篇文章里包含了哪些外链、哪些支持 Webmention，然后向有接收端的链接发送 Webmention。你可以在他们的首页最下方的输入框输入你的 URL 并点击「START」，来测试自动发送。
 
-如果要做到全自动，那也很简单。最方便的情况是：你有一个 RSS 订阅源。这样，就可以用 [IFTTT](https://ifttt.com/) 等自动化平台创建一个工作流，在 RSS 更新时通知 webmention.app 检查你的新文章，并帮你发送 Webmention。具体见[这个教程](https://webmention.app/docs#using-ifttt-to-trigger-checks)。
+如果要做到全自动，那也很简单。最方便的情况是：你有一个 RSS 订阅源。这样，就可以用 [IFTTT](https://ifttt.com/) 创建一个工作流，在 RSS 更新时通知 webmention.app 检查你的新文章，并帮你发送 Webmention。具体见[这个教程](https://webmention.app/docs#using-ifttt-to-trigger-checks)。
 
 如果你不想依赖 IFTTT 这样的服务，那就要根据你的网站架构来决定实现方式了。
 
@@ -105,7 +105,7 @@ POST https://webmention.app/check/?url=https://my.site/post-xxx
 
 ```HTML
 <link rel="me" href="https://github.com/alice">
-<link rel="me" href="https://twitter.com/alice"
+<link rel="me" href="https://twitter.com/alice">
 <link rel="me" href="mailto:alice@mail.com">
 ```
 
@@ -147,12 +147,36 @@ webmention.io 很好用，配合 webmention.js，甚至不需要自己写一行�
 
 在可以自己部署的 Webmention 接收端中，使用者比较多的是 Horst Gutmann 维护的 [webmentiond](https://github.com/zerok/webmentiond/)，用 Go 编写，存储基于 SQLite，简单轻量。此外还有用 Rust 编写的 [WesleyAC/webmention-receiver](https://github.com/WesleyAC/webmention-receiver) 和用 Python 编写的 [capjamesg/webmention-receiver](https://github.com/capjamesg/webmention-receiver)。
 
-对于重复造轮子这件事，我们国人也是不输（奇怪的比较）。[Chlorine](https://chlo.is/) 不久前用 Rust 写了一个 Webmention 接收端，名为 [CircleAt](https://codeberg.org/chlorine/circleat)，而我也用一门 Lisp 方言开发了 [Weepinbell](https://codeberg.org/eltrac/weepinbell)，最近才发布 [v0.1.0](https://codeberg.org/eltrac/weepinbell/releases/tag/v0.1.0) 版本。不过我不建议你用 Weepinbell，因为还没有正式投入使用，可能存在一些问题，进入稳定版本之后我会再发一篇文章的。当然，如果你愿意贡献的话，我将感激不尽。
+对于重复造轮子这件事，我们国人也不输（奇怪的比较）。[Chlorine](https://chlo.is/) 不久前用 Rust 写了一个 Webmention 接收端，名为 [CircleAt](https://codeberg.org/chlorine/circleat)，而我也用一门 Lisp 方言开发了 [Weepinbell](https://codeberg.org/eltrac/weepinbell)，最近才发布 [v0.1.0](https://codeberg.org/eltrac/weepinbell/releases/tag/v0.1.0) 版本。不过我不建议你用 Weepinbell，因为还没有正式投入使用，可能存在一些问题，进入稳定版本之后我会再发一篇文章的。当然，如果你愿意贡献的话，我将感激不尽。
 
 在开始之前，我得警告读者，Webmention 作为一门小众技术标准，使用者很少，自托管接收器的更少，如果遇到问题，可能很难找到解决方案和能够提供帮助的人（虽然我很欢迎有人来问我啦）。如果对自己的技术没什么信心，webmention.io 已经很好了，比能够自托管的选项都要成熟不少。
 
 不过剩下的我也没什么好讲的了，如果你决定自托管，那就选择一个自己觉得不错的接收端软件部署到服务器上。至于如何查看接收到的 Webmention 和如何展示，不同的接收端都有实现细节上的不同，这里略过。
 
+### 如何制作一个 Webmention 表单？
+
+还记得我们说发送 Webmention 就是发送一个 POST 请求吗？想想还有什么是 POST 请求？一个网页上能够发送 POST 请求的最常见的元素是什么？
+
+没错，就是表单。
+
+```HTML
+<form action="https://alice.blog/webmenion" method="POST">
+    <input type="url" name="source">
+    <input type="hidden" name="target" value="{{ .Permalink }}">
+    <button type="submit">发送</button>
+</form>
+```
+
+其中：
+
+- `action` 是 POST 请求要发送到的地方，这里填写你的 Webmention 端点
+- `<input name="source">` 是用户输入的，对方文章的 URL
+- `<input name="target">` 是你这篇文章的 URL，一般由程序自动生成；这里写的 `{{ .Permalink }}` 是 Hugo 的页面永久链接，你应该把它替换成你的博客软件的变量。
+
+你需要改的就只是 `action` 的地址和 `<input name="target">` 的 `value`，不需要写 JavaScript。不过，用户点击提交之后会被直接传送到 `action` 所指向的地址，如果你的 Webmention 接收端只返回 JSON，用户可能就不清楚到底有没有提交成功，还是有些不太友好的。如果你愿意的话，可以自己用 JavaScript 处理返回的数据，制作直观的提示，比如「发送成功」之类的。
+
+放一个这样的表单在网页上并说明清楚作用，即便是不了解 Webmention 的访客也懂得如何使用。
+
 ## 让 Webmention 生动起来：microformats
 
 [microformats](https://microformats.org/) 是一系列开放数据格式，建立在已被广泛采用的标准之上（比如 HTML）。它并不是和 Webmention 强绑定的，实际上 Webmention 标准完全没有提到过 microformats，只不过 IndieWeb 上的人很喜欢把它和 Webmention 一起用。说起来，应该是 webmention.io 的维护者 Aaron Parecki 带的头，webmention.io 默认支持解析 microformats。
@@ -220,7 +244,10 @@ webmention.io 很好用，配合 webmention.js，甚至不需要自己写一行�
     <div id="contant-wrap-wrap">
         <div id="content-wrap">
             <div id="main-content">
-                <div id="page-content"></div>
+                <div id="page-content">
+                    <h1 id="page-title">...</h1>
+                    <p>...</p>
+                </div>
             </div>
         </div>
     </div>
@@ -356,7 +383,27 @@ IndieWeb 上的居民会根据 `h-entry` 是否包含 `u-in-reply-to` 等属性�
 
 如此一来，你的网站就通过 Webmention 和联邦宇宙互通了。
 
+![](https://r2.eltr.ac/geedeapro/article/webmention/bridgy-dashboard.png "Bridgy 的后台，列出了联邦宇宙上的互动，其中的一些已经作为 Webmention 发送")
+
 我的网站就是这样做的，拉到页面最下方，你就能看到来自联邦宇宙的点赞和回应，不过我还没想好应该如何展示「转发」这个类型的 Webmention。
 
 ## 自己动手写 Webmention 接收端
 
+自己写 Webmention 接收器并不困难！你只需要把 [Webmention 文档](https://www.w3.org/TR/webmention/)中有关接收端的部分读一遍，知道需要注意哪些技术细节[^1][^2]就好了。你只需要提供一个用于接收 Webmention 的端点，至于查询 Webmention 的 API，以及要不要解析和储存 microformats，都可以自己决定。
+
+你完全可以只写一个给自己用的 Webmention 接收端，接收到 Webmention 请求后就通过聊天机器人发送给自己，不做展示也不做过多的处理，甚至不用储存。Webmention 尽管有规定删除和更新 Webmention 的方法（如果 `source` 有更新或者删除了引用，重新发送一次 Webmention 就应该能够更新），但并没有说一定要储存和展示 Webmention。
+
+你也可以把 Webmention 的功能做得很丰富，用来代替评论系统。无论如何，如果你决定自己写 Webmention 接收端的话，这都取决于你，只要保持最基础的标准就好了。
+
+你也可以看看 [Salmention](https://indieweb.org/Salmention)，比起 Webmention，它只是增加了多级回应的功能。比如 Chris 看到 Bob 回应 Alice 的文章之后，也写了一篇文章回应 Bob，并给 Bob 发送了 Salmention。如果 Alice 的网站也支持 Salmention 的话，Alice 就会收到 Chris 的 Salmention，尽管 Chris 只是直接提及了 Bob。不过，这个拓展标准很少有人用。
+
+## 最后
+
+希望有更多的人能用上 Webmention，一起愉快地写博客交流。
+
+我写累了，一会儿见吧。
+
+[^1]: 比如，W3C 规定，为了避免 DoS 攻击，所有的 Webmention 必须异步处理，也就是验证 `source` 和 `target` 都是正确的 URL 之后，应该异步地向 `source` 发送 GET 请求，检查 `source` 的内容是否包含 `target`。
+
+[^2]: 顺带一提，Webmention 其实不止支持 HTML，还可以提及 JSON 文档和纯文本文档。不过，虽然标准是这么写的，但应该不会有太多接收端很好地支持非 HTML 文档。
+