🛡️始める

早速、あなたのサイトをnonstressで保護しましょう！

Scriptタグを追加する

以下のタグをあなたのページのhtmlに追加してください。

<script src="https://hamutan86.pythonanywhere.com/nonstress/nonstress.js" async defer></script><script src="https://hamutan86.pythonanywhere.com/nonstress/nonstress.js" async defer></script>

トークンを取得する

サーバーサイドでリクエストの安全性を確認するには「トークン」が必要です。トークンはユーザーがページを開いたときに自動で作成されます。

トークンの準備ができたらnonstressCompletedイベントが発火します。言葉で言うよりも見るほうがわかりやすいので、このコード例を見てみてください。

document.addEventListener("nonstressCompleted", (e) => {
    console.log(e.detail.success); // true|false
    console.log(e.detail.token); // "0dc240c66802f7329a1cb9f85804c49f6bb34a..."
});

e.detail.tokenがトークンです。nonstressが失敗したらe.detail.successがfalseになります。その時は、ページを再読み込みさせるか、nonstress.generateToken() を使用してください。 イベント発火時でなくても、以下のように直接トークンを取得することもできます。

nonstress.getToken(); // "0dc240c66802f7329a1cb9f85804c49f6bb34a..."

とてもシンプルですね。この場合、nonstressがまだ完了していない、あるいは失敗したときは空のStringが返ってきます。

トークンを再生成する

ユーザーがパスワードを間違えたり、アクションをキャンセルしたり、あるいはnonstressに失敗した？一度認証したトークンは使いまわせません。でも、nonstressのためにページを再読み込みさせる必要はありません。

nonstress.generateToken()

これにより、トークンの再生成が行われ、イベントはもう一度発火し、nonstress.getToken()も新しいトークンを返してくれます。