我有一个静态网站，用户可以无限制地组合生成图像和内容。用户完成后，会生成永久链接以允许他们通过Facebook / Twitter / GooglePlus /等分享他们的创作。我希望他们的共享帖子包含用户的图片和内容，但我发现社交媒体机器人只从我的永久链接中解析HTML元标记，并且他们不评估任何Javascript。
如何让我的用户的内容出现在共享社交媒体帖子上？单击永久链接后，客户端Javascript将评估永久链接的查询参数并呈现用户的内容。我也可以在HTML元标记内呈现用户的内容，Twitter和FB使用它来填充帖子的内容，但是机器人不会评估任何javascript，因此元标记是没有渲染。
我探索过的一个可能的解决方案是预渲染。也许我的永久链接可以是AWS S3存储桶上HTML文件的位置，我可以在用户共享其固定链接后立即创建该文件。 S3上的HTML文件可以包含用户特定的元标记，我可以将其提供给社交媒体机器人。当访问该文件时，我可以将其重定向到我的永久链接。这看起来合情合理吗？我可以在尝试后报告回来。
另一种解决方案是使用预呈现服务，例如https://prerender.io/。它似乎有点笨重和黑盒子，但它可能比我上面的S3解决方案更强大和可靠。有什么想法吗？
我愿意接受反馈和其他解决方案，任何建议都会很棒。
其他相关信息：
这个答案看起来很有趣，涉及激活Facebook Javascript SDK： https://stackoverflow.com/a/34178987/1884158
我知道像Twitter的Card Validator和Facebooks Share Debugger这样的工具，在这里： https://cards-dev.twitter.com/validator https://developers.facebook.com/tools/debug/ 这对测试任何解决方案都很有用。
如果有帮助，我的网站是一个React应用程序，它捆绑在HTML / CSS / JS中并完全在客户端上呈现。
答案 0 :(得分：2)
我还没有找到解决此问题的正确方法，但我确实提出了一个涉及设置单独服务的解决方法/黑客攻击。以下是我提出的服务：https://github.com/mapseed/sharing/blob/master/share.js
如果我们的静态网站位于example.com，我们可以启动运行sharing.example.com的服务器，该服务器接受请求，并将请求从sharing.example.com/my/route重定向到example.com/my/route 。但是，如果请求具有与社交媒体抓取工具匹配的user-agent HTTP标头，就像我们正在进行here一样，那么我们将返回一个仅包含元标记的html页面，正如我们正在做的那样here
然而，这种方法有一些限制：
我们想要在社交媒体上分享的链接需要指向我们的sharing.example.com子域名。如果请求来自社交媒体机器人，或者以其他方式将请求重定向到我们的example.com网站，这将使我们的服务能够返回带有正确元标记的HTML页面。
为了生成元标记的内容，我们的可共享链接必须具有查询参数以传递所有信息以填充我们的元标记。例如，我们的可共享链接如下所示：sharing.example.com/post/my-post?title=my-title&desc=my-description。这意味着我们的可共享链接可能会很长。您可以看到我们如何从查询参数中提取信息，并将其注入带有元标记的HTML模板中：https://github.com/mapseed/sharing/blob/master/share.js#L18-L27
如果这些限制是可以接受的，那么这个解决方案效果很好。请注意，SEO也存在缺点，因为要共享的链接来自sharing.example.com，而不是我们的example.com网站。
此外，我们将不得不启动额外的服务器来运行此服务。虽然我们应该能够将此实现迁移到无服务器架构，例如AWS Lambda。