каноническая ссылка не отображается на странице-источнике response-шлем reactjs no ssr - PullRequest
Новая
       50

каноническая ссылка не отображается на странице-источнике response-шлем reactjs no ssr

1 голос
/ 13 июля 2020

У меня проблема с просмотром канонического URL-адреса в источнике страницы, и вот код на странице веб-приложения 


const Index = () => {
  const airportsQuery = useQuery(ALL_AIRPORTS_QUERY, {
    variables: {
      keyword: '',
    },
    skip: true,
    notifyOnNetworkStatusChange: false,
  });

  let timer = null;
  function fetchOptions(inputValue, callback) {
    clearTimeout(timer);

    timer = setTimeout(() => {
      const response = airportsQuery.refetch({ keyword: inputValue });

      response.then(
        ({ data }) => callback(data?.allAirports || []),
        ({ message }) => {
          console.error('Server Error:', message);
        }
      );
    }, 100);
  }

  return (
    <Layout>
      <Layout.Header />
      <Layout.Container width="full">
        <Helmet>
          <meta charSet="utf-8" />
          <title>eeeeee</title>
          <link rel="canonical" href="https://www.biletiniz.com/" />
        </Helmet>
        <HomePage
          fetchOptions={fetchOptions}
          onSubmit={variables =>
            Router.push(`/flight-offers?${qs.stringify(variables)}`)
          }
        />
      </Layout.Container>
      <Layout.Footer />
    </Layout>
  );
};

export async function getStaticProps() {
  const { default: lngDict = {} } = await import(
    `@biletiniz/intl/locales/tr.json`
  );
  return {
    props: { lng: 'tr', lngDict },
  };
}

export default withApollo({
  ssr: false,
})(Index);

когда я проверяю источник страницы, я не могу найти ссылка или заголовок Как я могу это решить? И у нас нет SSR, как я могу рендерить шлем на стороне клиента

1 Ответ

0 голосов
/ 13 июля 2020

React отображает это, используя DOM . DOM - это , измененное через JavaScript, то есть отправлено с HTML исходным кодом . Однако JS может изменять только DOM (то, что видит пользователь), не сам источник . Поэтому вам следует проверять DOM (F12 во всех основных браузерах или щелкните правой кнопкой мыши и проверьте), а не источник страницы. Современные сканеры , такие как Google Crawler , проверяют DOM, а не источник , в противном случае одностраничные приложения, такие как React, не могут понять его содержимое, потому что все отображается через JS. Таким образом, вы можете полностью оставить свой код как есть. Или измените его в React's stati c HTML file .

...