vue.js - twitter:图像对于 Vue.js 应用程序不可见

Question

我在使用 Vue.js 应用程序的 Twitter 卡时遇到问题。当我通过 Twitter card validator 运行网址时，所有检查均通过，但不显示图像。
我浏览了 Twitter 的故障排除指南并将以下更改应用于图像，但我仍然无法解决问题。 https://twittercommunity.com/t/card-error-unable-to-render-or-no-image-read-this-first/62736

图像比例 2:1

图像大小:252 kb

url 的绝对路径:https://speakher.jp/banner_twitter.png

curl -v -A Twitterbot 返回状态代码 200

这就是我在 index.html 中定义图像的方式项目的文件。图像保存在公共(public)文件夹中。

<meta name="twitter:image" content="https://speakher.jp/banner_twitter.png">

您对可能导致此问题的原因有任何指示吗？

Answer 1

现在检查 Twitter Card Validator 会显示正确的图像。有时您看到的卡片会被缓存，因此如果您想查看最新版本的图像，只需添加一个带有随机名称和(可选)随机值的参数。
求链接https://speakher.jp例如，只需添加一个小的随机参数将强制 Twitter 加载最新版本的图像。这应该加载相同的页面，因为参数没有任何意义(通常)。

https://speakher.jp?000000000001

在将实际链接发布到 Twitter 时，您也可以使用相同的方法。这将确保 Twitter 始终使用最新的卡片预览。
我从验证器那里拿到了这张卡。这似乎与您提供的链接中的图像相匹配。