我帮你逐个排查这些分享链接的问题，每个平台的分享规则都有细微差异，咱们一步步来修复：

核心问题总结 #

大部分失效的原因集中在：协议错误（HTTP vs HTTPS）、平台政策限制、本地URL（localhost）无法被第三方平台抓取、参数编码不规范这几点。

1. SMS 分享 #

原链接基本没问题，但部分设备对+空格转义的支持不如%20，建议统一编码方式：

<a class="button bg-white button--sms" href="sms:?body=dedewdwed%20https%3A%2F%2Flocalhost%3A3000%2Fevents%2Fdedewdwed">SMS</a>

2. Email 分享 #

原链接的转义是对的，但如果要兼容更多邮件客户端，建议把主题和内容都用标准编码处理（HTML里要保持&转义为&）：

<a class="button bg-white button--email" href="mailto:?subject=dedewdwed&amp;body=https%3A%2F%2Flocalhost%3A3000%2Fevents%2Fdedewdwed">Email</a>

（注：localhost链接在邮件里只有同一网络的设备能访问，开发阶段可以换成电脑的内网IP）

3. Messenger 分享 #

原链接有3个关键问题：

• 必须用HTTPS协议，不能用HTTP
• Facebook不允许预填message参数（违反平台政策，会被强制清空甚至拒绝请求）
• 你的app_id需要是自己的有效应用ID，且redirect_uri要添加到应用的白名单中

修复后的链接：

<a class="button bg-white button--messenger" href="https://www.facebook.com/dialog/send?app_id=你的有效应用ID&amp;link=https%3A%2F%2Flocalhost%3A3000%2Fevents%2Fdedewdwed&amp;redirect_uri=https%3A%2F%2Flocalhost%3A3000">Messenger</a>

重要提示：开发阶段要在Facebook开发者后台把https://localhost:3000添加到应用的「有效OAuth跳转URI」列表中。

4. WhatsApp 分享 #

原链接的空格转义可以优化，且localhost在手机端（不同网络下）无法访问，建议换成内网IP：

<a class="button bg-white button--whatsapp" href="https://wa.me/?text=dedewdwed%20https%3A%2F%2F192.168.x.x%3A3000%2Fevents%2Fdedewdwed">WhatsApp</a>

（把192.168.x.x换成你的电脑内网IP）

5. Facebook 分享 #

原链接的quote参数在新版sharer.php中支持性不好，且localhost无法被Facebook服务器抓取内容，导致分享无预览。开发阶段可以用ngrok把本地服务暴露到公网，或者换成内网IP：

<a class="button bg-white button--facebook" href="https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2F192.168.x.x%3A3000%2Fevents%2Fdedewdwed">Facebook</a>

如果需要自定义分享文案，建议用Facebook的Share Dialog API（需要配置app_id），比sharer.php更稳定。

6. Twitter 分享 #

原链接要换成HTTPS协议，且localhost链接可能被Twitter过滤，建议用内网IP或公网地址：

<a class="button bg-white button--twitter" href="https://twitter.com/share?text=dedewdwed&amp;url=https%3A%2F%2F192.168.x.x%3A3000%2Fevents%2Fdedewdwed">Twitter</a>

完整修复后的代码 #

<div class="flex gap-2 mb-4">
  <a class="button bg-white button--sms" href="sms:?body=dedewdwed%20https%3A%2F%2F192.168.x.x%3A3000%2Fevents%2Fdedewdwed">SMS</a>
  <a class="button bg-white button--email" href="mailto:?subject=dedewdwed&amp;body=https%3A%2F%2F192.168.x.x%3A3000%2Fevents%2Fdedewdwed">Email</a>
  <a class="button bg-white button--messenger" href="https://www.facebook.com/dialog/send?app_id=你的有效应用ID&amp;link=https%3A%2F%2F192.168.x.x%3A3000%2Fevents%2Fdedewdwed&amp;redirect_uri=https%3A%2F%2F192.168.x.x%3A3000">Messenger</a>
</div>
<div class="flex gap-2 mb-4">
  <a class="button bg-white button--whatsapp" href="https://wa.me/?text=dedewdwed%20https%3A%2F%2F192.168.x.x%3A3000%2Fevents%2Fdedewdwed">WhatsApp</a>
  <a class="button bg-white button--facebook" href="https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2F192.168.x.x%3A3000%2Fevents%2Fdedewdwed">Facebook</a>
  <a class="button bg-white button--twitter" href="https://twitter.com/share?text=dedewdwed&amp;url=https%3A%2F%2F192.168.x.x%3A3000%2Fevents%2Fdedewdwed">Twitter</a>
</div>

额外注意事项 #

• 所有分享的URL必须是可公开访问的（或同一内网可访问），localhost仅在电脑本地有效，手机端测试一定要换内网IP或用ngrok暴露公网地址。
• 各平台的分享规则可能会更新，比如Facebook的政策经常调整，建议定期查看官方文档确认参数格式。
• 编码参数时，推荐用JavaScript的encodeURIComponent()方法自动处理，避免手动编码出错。

内容的提问来源于stack exchange，提问作者Dorian