javascript - React.js - 每个页面的动态规范 url

Question

我正在使用Vulcan.js对于我的网站，默认情况下，它已将所有页面的规范 url 设置为指向主页。现在我想设置规范以指向每个页面的页面 url。

Vulcan 使用 React Helmet用于制作头部标签，如果这对您有意义的话。它还使用 React Router 。

这是我当前的代码:

  import React, { PropTypes, Component } from 'react';
  import Helmet from 'react-helmet';
  import Header from './Header.jsx';


  const canonical = window.location.href;  // this don't work, says ReferenceError: window is not defined



  const Layout = ({children}) =>

    <div className="wrapper" id="wrapper">

      <link rel="canonical" href={canonical} />

      <Header/>

      <div className="main">

        {children}

      </div>


    </div>

  export default Layout;

所以我得到的错误是:

ReferenceError:窗口未定义

我不是 React.js 的专家，所以我无法独自解决这个问题。但我认为对于比我更有经验的人来说，这是一个简单的解决方案。

如有任何帮助，我们将不胜感激。

Answer 1

我必须说，“const canonical = window.location.href”的方法不是您应该定义规范网址的方式。规范 url 的作用之一是向搜索引擎机器人表明，这是页面的真实 url，它并不总是与用户输入的 URL 相同。如果您使用 url 重写，并且有不止 1 种方法可以进入该页面，这种方法会给您带来问题，因为规范(应该是一种)将被设置为用户输入的值(或者来自您内部某处的错误链接)页，否则...)。另一件事是，规范 url 用于将用户从他进入的页面重定向，如果看起来不一样，例如尝试转到 https://www.gsmarena.com/apple_iphone_7-8064.php然后将 id 从“8064”更改为“8858” - 看看 url 会发生什么!您的页面应该有一个通用的规范 url 生成器，它可以通过使用页面的一些严格数据(例如电话 ID)来解决完整的 url，并且如果用户带有另一个 url，您还应该将用户重定向到规范 url。更多信息:https://support.google.com/webmasters/answer/139066?hl=en