🐥

next.jsで検索に引っかからないように設定する

1 min read

やりたいこと

  • 既にデプロイしているサイトを、検索エンジンの検索結果に表示させたくない。

対応策

  • noindexを設定する。
  • 設定方法は2つあるが、今回はメタタグで設定するやり方で対応する。
  • サイトページのheadタグ内にnoindexを設定することで、ウェブクローラにインデックス登録されないようにすることができる。

手順

  1. metaタグ用のコンポーネントを作成する。

    ※コンポーネント化は任意

    // src/components/pages/Meta/Meta.tsx
    
    import Head from "next/head"
    
    export const Meta = () => {
      return  (
        <Head>
          <meta name="robots" content="noindex" />
        </Head>
      )
    }
    
  2. _app.tsxで呼び出す

    import { Meta } from 'components/pages/Meta/Meta'
    
    function MyApp({ Component, pageProps }: any) {
      return (
        <>
          <Meta />
          <Component {...pageProps} />
        </>
      )
    }
    
    export default MyApp
    
  3. 実装した内容をサイトに反映後、デプロイしたサイトを確認すると、noindexが設定されているのが確認できる

参考サイト

https://developers.google.com/search/docs/advanced/crawling/block-indexing?hl=ja

https://qiita.com/TK-C/items/cd34d0f6d4b001053443

Discussion

ログインするとコメントできます