1. tsukiwakka

    No comment

    tsukiwakka
Changes in body
Source | HTML | Preview
@@ -1,9 +1,9 @@
-## Nuxtで直接アクセスを拒否するページを作成する
+## Nuxtで直接アクセスさせないページを作成する
Nuxt.jsでuniversalモードでの開発で、応募や購入など何らかのアクション後の完了画面で直接アクセスをさせない方法を紹介します。
-### ミドルウェアを使って実装する
+### ミドルウェアを使って直接アクセス禁止機能の実装
ミドルウェアを使って簡単に実装・持ち回りができます。
早速、以下コードになります。
```js:/middleware/reject-direct.js
@@ -13,11 +13,11 @@
}
}
```
Nuxtでは、SSR時に`ssrContext`に値が設定されるので、
それがあるかないだけのシンプルな判定で直接アクセスを拒否して、別のページに飛ばす機能を実現できます。
-使い方は、このミドルウェアを直接アクセスを禁止したいページで持ち回るだけです。
+使い方は、このミドルウェアを直接アクセス禁止にしたいページで持ち回るだけです。
### 作成した直接アクセス拒否のミドルウェアをページコンポーネントで読み込む
普通にscript内で`middleware: 'reject-direct'`と書いて、利用ミドルウェアを設定します。
完了ページは検索エンジンに載せたくないと思いますので、metaタグの`noindex,nofollow`も合わせて設定しています。