Node.js React元标记不适用于Facebook

Node.js React元标记不适用于Facebook,node.js,reactjs,npm,meta-tags,Node.js,Reactjs,Npm,Meta Tags,我已克隆应用程序并尝试使用。通过检查浏览器,我可以看到元标记值存在,但当我在Facebook上发布URL并尝试在此处查看元标记状态时,它表示应该传递属性。 任何人都可以提出这里出了什么问题 请找到我的组件代码 import '../assets/stylesheets/base.scss'; import React, { Component } from 'react'; import Helmet from "react-helmet"; class App extends Compone

我已克隆应用程序并尝试使用。通过检查浏览器,我可以看到元标记值存在,但当我在Facebook上发布URL并尝试在此处查看元标记状态时,它表示应该传递属性。 任何人都可以提出这里出了什么问题

请找到我的组件代码

import '../assets/stylesheets/base.scss';
import React, { Component } from 'react';
import Helmet from "react-helmet";

class App extends Component {
  render() {
    return(
        <div className="application">
            <Helmet
            htmlAttributes={{"lang": "en", "amp": undefined}} // amp takes no value
            title="My Title"
            titleTemplate="React Helmet - %s"
            defaultTitle="React Helmet Title"
            base={{"target": "_blank", "href": "http://myappname.herokuapp.com/"}}
            meta={[
                {"name": "description", "content": "Helmet application"},
                {"property": "fb:app_id", "content": "myfbid"},
                {"property": "og:title", "content": "My application title goes here."},
                {"property": "og:type", "content": "website"},
                {"property": "og:url", "content": "http://myappname.com/"},
                {"property": "og:image", "content": "https://imagename.png"},
                {"property": "og:description", "content": "Application description"},
                {"property": "og:site_name", "content": "MyAppname.com"},

            ]}
          />
          <h1>Welcome to the React helmet App, {this.props.name}!</h1>
        </div>  
    )
  }
};
export default App;
import'../assets/stylesheets/base.scss';
从“React”导入React,{Component};
从“反应头盔”导入头盔;
类应用程序扩展组件{
render(){
返回(
欢迎使用React头盔应用程序,{this.props.name}!
)
}
};
导出默认应用程序;

这是因为Facebook的页面scraper不执行javascript(我相信这与谷歌的页面scraper不同)。这意味着您需要在服务器端预处理并添加meta标记

在Chrome中,您可以使用
查看源代码

view-source:http://example.com

加载页面时,可能脚本尚未初始化。如果你让你的应用程序通用(或同构),那么它应该在页面加载上。我已经在使用react头盔使用服务器端渲染,但仍然面临同样的问题。请看一下这个问题: