Twitter卡-“警告:未找到元标记”

问题描述 投票:2回答:1

[通过Heroku托管的React Web应用程序具有可共享页面的设置元标记。我注意到,尽管页面源正确地显示了twitter和og元数据,但Twitter卡并未正确显示。

给出以下内容-我还没有考虑过什么吗?

Javascript:我已测试禁用了javascript,并且该站点仍可以正确呈现,并带有正确的meta标签]

图像尺寸:在规定的范围内-434px X 650px,94KB

托管:该网址托管在Herokuapp上,仍在使用herokuapp域(尚未切换到生产url)expressFullURL:https://project.herokuapp.com/share/[ID]

图像托管:图像在URL https://media.project.aws/[etc]

中引用AWS S3存储桶

机器人:该网站没有robots.txt文件

下面是标题元内容:

twitter.image URL是动态加载的twitter.url,也可以使用express动态生成完整的URL(http://project.com/share/page/1234

<!-- basic meta -->
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
    <meta charset="utf-8" />
    <meta content="text/html; charset=UTF-8" name="Content-Type" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />

    <!-- content meta -->
    <meta name="description" content="description content" />
    <meta name="copyright" content="Copyright 2019" />


    <!-- Twitter meta -->
    <meta property="twitter:card" content="summary_large_image">
    <meta property="twitter:site" content="@handle">
    <meta property="twitter:image" content="${image.url}">
    <meta property="twitter:card" content="summary_large_image">
    <meta property="twitter:url" content="${expressFullURL}">
    <meta property="twitter:title" content="Title">
    <meta property="twitter:description" content="description content">

    <!-- opengraph data -->

    <meta property="og:title" content="Title" />
    <meta property="og:description" content="description content" />
    <meta property="og:url" content="${expressFullURL}" />
    <meta property="og:image" content="${image.url}" />
    <meta property="og:type" content="website" />
    <meta property="og:site_name" content="Site Name" />

使用https://cards-dev.twitter.com/validator响应是:

INFO:  Page fetched successfully
WARN:  No metatags found

Meta在页面上是正确的,所以不明白为什么找不到元标记

[通过Heroku托管的React Web应用程序具有可共享页面的设置元标记。我注意到,尽管页面源正确显示了Twitter和og,但Twitter卡片仍未正确显示。

reactjs heroku twitter react-router meta
1个回答
0
投票

我有类似的情况,但似乎可以正常工作。单击验证器预览按钮时,我一直关注Heroku日志heroku logs --tail。事实证明,由于来自验证程序的请求格式,我的应用程序出现500错误。可能值得一看。

© www.soinside.com 2019 - 2024. All rights reserved.