chore(i18n,learn): processed translations (#44851)
This commit is contained in:
@@ -0,0 +1,63 @@
|
||||
---
|
||||
id: 587d8248367417b2b2512c3c
|
||||
title: helmet.hsts() を使用して、HTTPS 経由でサイトにアクセスするようブラウザーに指示する
|
||||
challengeType: 2
|
||||
forumTopicId: 301573
|
||||
dashedName: ask-browsers-to-access-your-site-via-https-only-with-helmet-hsts
|
||||
---
|
||||
|
||||
# --description--
|
||||
|
||||
注意点として、このプロジェクトは [Replit](https://replit.com/github/freeCodeCamp/boilerplate-infosec) にある次のスタータープロジェクトをベースに構築されているか、または [GitHub](https://github.com/freeCodeCamp/boilerplate-infosec/) からクローンされています。
|
||||
|
||||
HTTP Strict Transport Security (HSTS) は、プロトコルのダウングレード攻撃や Cookie のハイジャックからウェブサイトを保護するのに役立つウェブセキュリティポリシーです。 自分のウェブサイトが HTTPS 経由でのアクセスに対応している場合、ユーザーのブラウザーに対して、安全でない HTTP の使用を避けるよう求めることができます。 Strict-Transport-Security ヘッダーを設定することで、ブラウザーに対して、指定された期間、以降のリクエストで HTTPS を使用するよう指示します。 このポリシーは、最初のリクエスト後に発生するリクエストに対して有効になります。
|
||||
|
||||
# --instructions--
|
||||
|
||||
今後 90 日間 HTTPS を使用するように `helmet.hsts()` を設定してください。 config オブジェクト `{maxAge: timeInSeconds, force: true}` を渡してください。 変数 `ninetyDaysInSeconds = 90*24*60*60;` を作成し、 `timeInSeconds` に使用することができます。 Replit ではすでに hsts が有効になっています。 この設定を上書きするには、config オブジェクトの "force" フィールドを true に設定する必要があります。 Replit のヘッダーをインターセプトし、テストのために検査した後、復元します。
|
||||
|
||||
注:カスタムのウェブサイトで HTTPS を設定するには、ドメインと SSL/TLS 証明書を取得する必要があります。
|
||||
|
||||
# --hints--
|
||||
|
||||
helmet.hsts() ミドルウェアを正しくマウントする必要があります。
|
||||
|
||||
```js
|
||||
(getUserInput) =>
|
||||
$.get(getUserInput('url') + '/_api/app-info').then(
|
||||
(data) => {
|
||||
assert.include(data.appStack, 'hsts');
|
||||
assert.property(data.headers, 'strict-transport-security');
|
||||
},
|
||||
(xhr) => {
|
||||
throw new Error(xhr.responseText);
|
||||
}
|
||||
);
|
||||
```
|
||||
|
||||
maxAge を 7776000 秒 (90 日) にする必要があります。
|
||||
|
||||
```js
|
||||
(getUserInput) =>
|
||||
$.get(getUserInput('url') + '/_api/app-info').then(
|
||||
(data) => {
|
||||
assert.match(
|
||||
data.headers['strict-transport-security'],
|
||||
/^max-age=7776000;?/
|
||||
);
|
||||
},
|
||||
(xhr) => {
|
||||
throw new Error(xhr.responseText);
|
||||
}
|
||||
);
|
||||
```
|
||||
|
||||
# --solutions--
|
||||
|
||||
```js
|
||||
/**
|
||||
Backend challenges don't need solutions,
|
||||
because they would need to be tested against a full working project.
|
||||
Please check our contributing guidelines to learn more.
|
||||
*/
|
||||
```
|
@@ -0,0 +1,42 @@
|
||||
---
|
||||
id: 587d8248367417b2b2512c3a
|
||||
title: helmet.noSnifff() を使用して、レスポンスの MIME タイプの推測を回避する
|
||||
challengeType: 2
|
||||
forumTopicId: 301574
|
||||
dashedName: avoid-inferring-the-response-mime-type-with-helmet-nosniff
|
||||
---
|
||||
|
||||
# --description--
|
||||
|
||||
注意点として、このプロジェクトは [Replit](https://replit.com/github/freeCodeCamp/boilerplate-infosec) にある次のスタータープロジェクトをベースに構築されているか、または [GitHub](https://github.com/freeCodeCamp/boilerplate-infosec/) からクローンされています。 ブラウザーでコンテンツまたは MIME スニッフィングを使用すると、レスポンスの `Content-Type` ヘッダーを上書きし、暗黙のコンテンツタイプを使用してデータを推測し、処理することが可能になります。 これは便利な場合もありますが、危険な攻撃につながる可能性もあります。 このミドルウェアは、X-Content-Type-Options ヘッダーを `nosniff` に設定することで、提供された `Content-Type` を回避しないようにブラウザーに指示します。
|
||||
|
||||
# --instructions--
|
||||
|
||||
サーバーで `helmet.noSniff()` メソッドを使用してください。
|
||||
|
||||
# --hints--
|
||||
|
||||
helmet.noSniff() ミドルウェアを正しくマウントする必要があります。
|
||||
|
||||
```js
|
||||
(getUserInput) =>
|
||||
$.get(getUserInput('url') + '/_api/app-info').then(
|
||||
(data) => {
|
||||
assert.include(data.appStack, 'nosniff');
|
||||
assert.equal(data.headers['x-content-type-options'], 'nosniff');
|
||||
},
|
||||
(xhr) => {
|
||||
throw new Error(xhr.responseText);
|
||||
}
|
||||
);
|
||||
```
|
||||
|
||||
# --solutions--
|
||||
|
||||
```js
|
||||
/**
|
||||
Backend challenges don't need solutions,
|
||||
because they would need to be tested against a full working project.
|
||||
Please check our contributing guidelines to learn more.
|
||||
*/
|
||||
```
|
@@ -0,0 +1,50 @@
|
||||
---
|
||||
id: 587d8249367417b2b2512c40
|
||||
title: '「親」の helmet() ミドルウェアを使用して Helmet を構成する'
|
||||
challengeType: 2
|
||||
forumTopicId: 301575
|
||||
dashedName: configure-helmet-using-the-parent-helmet-middleware
|
||||
---
|
||||
|
||||
# --description--
|
||||
|
||||
注意点として、このプロジェクトは [Replit](https://replit.com/github/freeCodeCamp/boilerplate-infosec) にある次のスタータープロジェクトをベースに構築されているか、または [GitHub](https://github.com/freeCodeCamp/boilerplate-infosec/) からクローンされています。
|
||||
|
||||
`app.use(helmet())` では、前に紹介したすべてのミドルウェアが自動的にインクルードされますが、`noCache()` と `contentSecurityPolicy()` は除外されます。しかし、必要に応じてこれらを有効にすることができます。 config オブジェクトを使用して、他のミドルウェアを個別に無効化または構成することもできます。
|
||||
|
||||
**例:**
|
||||
|
||||
```js
|
||||
app.use(helmet({
|
||||
frameguard: { // configure
|
||||
action: 'deny'
|
||||
},
|
||||
contentSecurityPolicy: { // enable and configure
|
||||
directives: {
|
||||
defaultSrc: ["'self'"],
|
||||
styleSrc: ['style.com'],
|
||||
}
|
||||
},
|
||||
dnsPrefetchControl: false // disable
|
||||
}))
|
||||
```
|
||||
|
||||
説明の都合上、またテストのしやすさを考慮して、各ミドルウェアを別々に紹介しました。 実際のプロジェクトでは「親」の `helmet()` ミドルウェアを簡単に実装して使用できます。
|
||||
|
||||
# --hints--
|
||||
|
||||
テストはありません。説明のみのチャレンジです。
|
||||
|
||||
```js
|
||||
assert(true);
|
||||
```
|
||||
|
||||
# --solutions--
|
||||
|
||||
```js
|
||||
/**
|
||||
Backend challenges don't need solutions,
|
||||
because they would need to be tested against a full working project.
|
||||
Please check our contributing guidelines to learn more.
|
||||
*/
|
||||
```
|
@@ -0,0 +1,47 @@
|
||||
---
|
||||
id: 587d8249367417b2b2512c3e
|
||||
title: helmet.noCache() を使用してクライアントサイドのキャッシュを無効にする
|
||||
challengeType: 2
|
||||
forumTopicId: 301576
|
||||
dashedName: disable-client-side-caching-with-helmet-nocache
|
||||
---
|
||||
|
||||
# --description--
|
||||
|
||||
注意点として、このプロジェクトは [Replit](https://replit.com/github/freeCodeCamp/boilerplate-infosec) にある次のスタータープロジェクトをベースに構築されているか、または [GitHub](https://github.com/freeCodeCamp/boilerplate-infosec/) からクローンされています。
|
||||
|
||||
ウェブサイトのアップデートを行う際に、ユーザーに常に新しいバージョンをダウンロードしてもらいたい場合、クライアントのブラウザーでキャッシュの無効化を行う (または試みる) ことができます。 これは開発の場合にも役立ちます。 キャッシュにはパフォーマンス上の利点がありますが、それを失うことになるため、このオプションは本当に必要な場合にのみ使用してください。
|
||||
|
||||
# --instructions--
|
||||
|
||||
サーバーで `helmet.noCache()` メソッドを使用してください。
|
||||
|
||||
# --hints--
|
||||
|
||||
helmet.noCache() ミドルウェアを正しくマウントする必要があります。
|
||||
|
||||
```js
|
||||
(getUserInput) =>
|
||||
$.get(getUserInput('url') + '/_api/app-info').then(
|
||||
(data) => {
|
||||
assert.include(data.appStack, 'nocache');
|
||||
assert.equal(
|
||||
data.headers['cache-control'],
|
||||
'no-store, no-cache, must-revalidate, proxy-revalidate'
|
||||
);
|
||||
},
|
||||
(xhr) => {
|
||||
throw new Error(xhr.responseText);
|
||||
}
|
||||
);
|
||||
```
|
||||
|
||||
# --solutions--
|
||||
|
||||
```js
|
||||
/**
|
||||
Backend challenges don't need solutions,
|
||||
because they would need to be tested against a full working project.
|
||||
Please check our contributing guidelines to learn more.
|
||||
*/
|
||||
```
|
@@ -0,0 +1,44 @@
|
||||
---
|
||||
id: 587d8248367417b2b2512c3d
|
||||
title: helmet.dnsPrefetchControl() を使用して DNS プリフェッチを無効にする
|
||||
challengeType: 2
|
||||
forumTopicId: 301577
|
||||
dashedName: disable-dns-prefetching-with-helmet-dnsprefetchcontrol
|
||||
---
|
||||
|
||||
# --description--
|
||||
|
||||
注意点として、このプロジェクトは [Replit](https://replit.com/github/freeCodeCamp/boilerplate-infosec) にある次のスタータープロジェクトをベースに構築されているか、または [GitHub](https://github.com/freeCodeCamp/boilerplate-infosec/) からクローンされています。
|
||||
|
||||
ほとんどのブラウザーでは、パフォーマンスを向上させるために、ページ内のリンクの DNS レコードを先読み (プリフェッチ) します。 これにより、ユーザーがリンクをクリックしたときには、すでに目的の IP がわかっている状態になります。 その結果、DNS サービスの過度の使用 (何百万人もの人が訪れる大規模なウェブサイトの運営を想像してみてください…)、プライバシーの問題 (特定のページを閲覧しているユーザーを盗聴者が推測できる可能性がある)、ページ統計の改ざん (リンク先が訪問されていなくても訪問されているように表示される) などが発生する可能性があります。 高度なセキュリティを必要とする場合は、パフォーマンスの低下を犠牲にして、DNS プリフェッチを無効にすることができます。
|
||||
|
||||
# --instructions--
|
||||
|
||||
サーバーで `helmet.dnsPrefetchControl()` メソッドを使用してください。
|
||||
|
||||
# --hints--
|
||||
|
||||
helmet.dnsPrefetchControl() ミドルウェアを正しくマウントする必要があります。
|
||||
|
||||
```js
|
||||
(getUserInput) =>
|
||||
$.get(getUserInput('url') + '/_api/app-info').then(
|
||||
(data) => {
|
||||
assert.include(data.appStack, 'dnsPrefetchControl');
|
||||
assert.equal(data.headers['x-dns-prefetch-control'], 'off');
|
||||
},
|
||||
(xhr) => {
|
||||
throw new Error(xhr.responseText);
|
||||
}
|
||||
);
|
||||
```
|
||||
|
||||
# --solutions--
|
||||
|
||||
```js
|
||||
/**
|
||||
Backend challenges don't need solutions,
|
||||
because they would need to be tested against a full working project.
|
||||
Please check our contributing guidelines to learn more.
|
||||
*/
|
||||
```
|
@@ -0,0 +1,81 @@
|
||||
---
|
||||
id: 58a25bcff9fc0f352b528e7d
|
||||
title: パスワードを非同期的にハッシュ化して比較する
|
||||
challengeType: 2
|
||||
forumTopicId: 301578
|
||||
dashedName: hash-and-compare-passwords-asynchronously
|
||||
---
|
||||
|
||||
# --description--
|
||||
|
||||
注意点として、このプロジェクトは [Replit](https://replit.com/github/freeCodeCamp/boilerplate-bcrypt) にある次のスタータープロジェクトをベースに構築されているか、または [GitHub](https://github.com/freeCodeCamp/boilerplate-bcrypt/) からクローンされています。
|
||||
|
||||
ハッシュは計算量が多くなるように設計されているので、ハッシュ処理中に接続がブロックされないように、サーバー上で非同期的に処理することをお勧めします。 次の呼び出しを実行するだけで、パスワードを非同期にハッシュ化できます。
|
||||
|
||||
```js
|
||||
bcrypt.hash(myPlaintextPassword, saltRounds, (err, hash) => {
|
||||
/*Store hash in your db*/
|
||||
});
|
||||
```
|
||||
|
||||
# --instructions--
|
||||
|
||||
このハッシュ関数をサーバーに追加し (関数内で使用されている変数はすでに定義してあります)、コンソールに出力して確認してください。 通常はこの時点でハッシュをデータベースに保存します。
|
||||
|
||||
新しい入力がハッシュと同じデータかどうかを調べる必要がある場合は、compare 関数を使用します。
|
||||
|
||||
```js
|
||||
bcrypt.compare(myPlaintextPassword, hash, (err, res) => {
|
||||
/*res == true or false*/
|
||||
});
|
||||
```
|
||||
|
||||
完了したハッシュを出力し、compare の中でコンソールに "res" と出力した後、これを既存のハッシュ関数に追加してください (compare 関数を呼び出す前にハッシュの完了を待つ必要があるため)。 コンソールにハッシュが出力され、次に 'true' と出力されるはずです。 compare 関数の 'myPlaintextPassword' を 'someOtherPlaintextPassword' に変更すると、false と表示されます。
|
||||
|
||||
```js
|
||||
bcrypt.hash('passw0rd!', 13, (err, hash) => {
|
||||
console.log(hash);
|
||||
//$2a$12$Y.PHPE15wR25qrrtgGkiYe2sXo98cjuMCG1YwSI5rJW1DSJp0gEYS
|
||||
bcrypt.compare('passw0rd!', hash, (err, res) => {
|
||||
console.log(res); //true
|
||||
});
|
||||
});
|
||||
|
||||
```
|
||||
|
||||
正しいと思ったら、ページを送信してください。
|
||||
|
||||
# --hints--
|
||||
|
||||
非同期ハッシュを生成し、正しく比較する必要があります。
|
||||
|
||||
```js
|
||||
(getUserInput) =>
|
||||
$.get(getUserInput('url') + '/_api/server.js').then(
|
||||
(data) => {
|
||||
assert.match(
|
||||
data,
|
||||
/START_ASYNC[^]*bcrypt.hash.*myPlaintextPassword( |),( |)saltRounds( |),( |).*err( |),( |)hash[^]*END_ASYNC/gi,
|
||||
'You should call bcrypt.hash on myPlaintextPassword and saltRounds and handle err and hash as a result in the callback'
|
||||
);
|
||||
assert.match(
|
||||
data,
|
||||
/START_ASYNC[^]*bcrypt.hash[^]*bcrypt.compare.*myPlaintextPassword( |),( |)hash( |),( |).*err( |),( |)res[^]*}[^]*}[^]*END_ASYNC/gi,
|
||||
'Nested within the hash function should be the compare function comparing myPlaintextPassword to hash'
|
||||
);
|
||||
},
|
||||
(xhr) => {
|
||||
throw new Error(xhr.statusText);
|
||||
}
|
||||
);
|
||||
```
|
||||
|
||||
# --solutions--
|
||||
|
||||
```js
|
||||
/**
|
||||
Backend challenges don't need solutions,
|
||||
because they would need to be tested against a full working project.
|
||||
Please check our contributing guidelines to learn more.
|
||||
*/
|
||||
```
|
@@ -0,0 +1,66 @@
|
||||
---
|
||||
id: 58a25bcff9fc0f352b528e7e
|
||||
title: パスワードを同期的にハッシュ化して比較する
|
||||
challengeType: 2
|
||||
forumTopicId: 301579
|
||||
dashedName: hash-and-compare-passwords-synchronously
|
||||
---
|
||||
|
||||
# --description--
|
||||
|
||||
注意点として、このプロジェクトは [Replit](https://replit.com/github/freeCodeCamp/boilerplate-bcrypt) にある次のスタータープロジェクトをベースに構築されているか、または [GitHub](https://github.com/freeCodeCamp/boilerplate-bcrypt/) からクローンされています。
|
||||
|
||||
同期的にハッシュ化することも同様に簡単ですが、サーバーサイドで高いコストをかけて使用する場合や、頻繁にハッシュ化を行う場合には遅延が発生する可能性があります。 次の呼び出しだけで、このメソッドによるハッシュ化を実行できます。
|
||||
|
||||
```js
|
||||
var hash = bcrypt.hashSync(myPlaintextPassword, saltRounds);
|
||||
```
|
||||
|
||||
このハッシュメソッドをコードに追加し、結果をコンソールに表示してください。 ここでも、使用されている変数はすでにサーバーで定義されているため、変数を調整する必要はありません。 非同期関数と同じパスワードをハッシュ化しているにもかかわらず、コンソールに表示される結果が異なることに気づくかもしれません。これは、ハッシュの 3 番目の文字列の最初の 22 文字を見るとわかるように、ソルトが毎回ランダムに生成されるためです。 ここで、入力されたパスワードと新しい同期ハッシュを比較するために、compareSync メソッドを使用します。
|
||||
|
||||
```js
|
||||
var result = bcrypt.compareSync(myPlaintextPassword, hash);
|
||||
```
|
||||
|
||||
結果は true または false のブール値になります。
|
||||
|
||||
# --instructions--
|
||||
|
||||
関数を追加し、コンソールに結果を表示して動作を確認してください。
|
||||
|
||||
正しいと思ったら、ページを送信してください。
|
||||
|
||||
# --hints--
|
||||
|
||||
同期ハッシュを生成し、正しく比較する必要があります。
|
||||
|
||||
```js
|
||||
(getUserInput) =>
|
||||
$.get(getUserInput('url') + '/_api/server.js').then(
|
||||
(data) => {
|
||||
assert.match(
|
||||
data,
|
||||
/START_SYNC[^]*hash.*=.*bcrypt.hashSync.*myPlaintextPassword( |),( |)saltRounds[^]*END_SYNC/gi,
|
||||
'You should call bcrypt.hashSync on myPlaintextPassword with saltRounds'
|
||||
);
|
||||
assert.match(
|
||||
data,
|
||||
/START_SYNC[^]*result.*=.*bcrypt.compareSync.*myPlaintextPassword( |),( |)hash[^]*END_SYNC/gi,
|
||||
'You should call bcrypt.compareSync on myPlaintextPassword with the hash generated in the last line'
|
||||
);
|
||||
},
|
||||
(xhr) => {
|
||||
throw new Error(xhr.statusText);
|
||||
}
|
||||
);
|
||||
```
|
||||
|
||||
# --solutions--
|
||||
|
||||
```js
|
||||
/**
|
||||
Backend challenges don't need solutions,
|
||||
because they would need to be tested against a full working project.
|
||||
Please check our contributing guidelines to learn more.
|
||||
*/
|
||||
```
|
@@ -0,0 +1,40 @@
|
||||
---
|
||||
id: 587d8247367417b2b2512c37
|
||||
title: helmet.hidePoweredBy() を使用して危険性のある情報を隠す
|
||||
challengeType: 2
|
||||
forumTopicId: 301580
|
||||
dashedName: hide-potentially-dangerous-information-using-helmet-hidepoweredby
|
||||
---
|
||||
|
||||
# --description--
|
||||
|
||||
注意点として、このプロジェクトは [Replit](https://replit.com/github/freeCodeCamp/boilerplate-infosec) にある次のスタータープロジェクトをベースに構築されているか、または [GitHub](https://github.com/freeCodeCamp/boilerplate-infosec/) からクローンされています。
|
||||
|
||||
サイトで Express を使用していることがハッカーに知られた場合、ハッカーは Express や Node の既知の脆弱性を悪用する可能性があります。 デフォルトでは、Express からリクエストが発生するたびに `X-Powered-By: Express` が送信されます。 `helmet.hidePoweredBy()` ミドルウェアを使用して X-Powered-By ヘッダーを削除してください。
|
||||
|
||||
# --hints--
|
||||
|
||||
helmet.hidePoweredBy() ミドルウェアを正しくマウントする必要があります。
|
||||
|
||||
```js
|
||||
(getUserInput) =>
|
||||
$.get(getUserInput('url') + '/_api/app-info').then(
|
||||
(data) => {
|
||||
assert.include(data.appStack, 'hidePoweredBy');
|
||||
assert.notEqual(data.headers['x-powered-by'], 'Express');
|
||||
},
|
||||
(xhr) => {
|
||||
throw new Error(xhr.responseText);
|
||||
}
|
||||
);
|
||||
```
|
||||
|
||||
# --solutions--
|
||||
|
||||
```js
|
||||
/**
|
||||
Backend challenges don't need solutions,
|
||||
because they would need to be tested against a full working project.
|
||||
Please check our contributing guidelines to learn more.
|
||||
*/
|
||||
```
|
@@ -0,0 +1,53 @@
|
||||
---
|
||||
id: 587d8247367417b2b2512c36
|
||||
title: Helmet を install して require する
|
||||
challengeType: 2
|
||||
forumTopicId: 301581
|
||||
dashedName: install-and-require-helmet
|
||||
---
|
||||
|
||||
# --description--
|
||||
|
||||
これらのチャレンジに取り組むにあたり、以下の方法のうち 1 つを用いてコードを記述します。
|
||||
|
||||
- [GitHub リポジトリ](https://github.com/freeCodeCamp/boilerplate-infosec/)をクローンし、ローカル環境でプロジェクトを完了させる。
|
||||
- [Replit 始動プロジェクト](https://replit.com/github/freeCodeCamp/boilerplate-infosec)を使用して、チャレンジを完了させる。
|
||||
- 使い慣れたサイトビルダーを使用してプロジェクトを完了させる。 必ず GitHub リポジトリのすべてのファイルを取り込む。
|
||||
|
||||
完了したら、プロジェクトの動作デモをどこか公開の場にホストしてください。 そして、`Solution Link` フィールドでデモへの URL を送信してください。
|
||||
|
||||
Helmet を使用すると、さまざまな HTTP ヘッダーを設定することができ、Express アプリケーションのセキュリティを確保するのに役立ちます。
|
||||
|
||||
# --instructions--
|
||||
|
||||
これらのレッスンで使用するコードはすべて、`myApp.js`ファイルの中で、最初に示したコードの行の間に記載されています。 追加したコードを変更したり削除したりしないでください。
|
||||
|
||||
Helmet のバージョン `3.21.3` をインストールし、require してください。 `npm install --save-exact package@version` を使用するか、`package.json` に直接追加することで、特定のバージョンのパッケージをインストールできます。
|
||||
|
||||
# --hints--
|
||||
|
||||
`helmet` のバージョン `3.21.3` を `package.json` に含める必要があります。
|
||||
|
||||
```js
|
||||
(getUserInput) =>
|
||||
$.get(getUserInput('url') + '/_api/package.json').then(
|
||||
(data) => {
|
||||
const packJson = JSON.parse(data);
|
||||
const helmet = packJson.dependencies.helmet;
|
||||
assert(helmet === '3.21.3' || helmet === '^3.21.3');
|
||||
},
|
||||
(xhr) => {
|
||||
throw new Error(xhr.responseText);
|
||||
}
|
||||
);
|
||||
```
|
||||
|
||||
# --solutions--
|
||||
|
||||
```js
|
||||
/**
|
||||
Backend challenges don't need solutions,
|
||||
because they would need to be tested against a full working project.
|
||||
Please check our contributing guidelines to learn more.
|
||||
*/
|
||||
```
|
@@ -0,0 +1,64 @@
|
||||
---
|
||||
id: 587d8247367417b2b2512c38
|
||||
title: helmet.frameguard() を使用してクリックジャック攻撃のリスクを軽減する
|
||||
challengeType: 2
|
||||
forumTopicId: 301582
|
||||
dashedName: mitigate-the-risk-of-clickjacking-with-helmet-frameguard
|
||||
---
|
||||
|
||||
# --description--
|
||||
|
||||
注意点として、このプロジェクトは [Replit](https://replit.com/github/freeCodeCamp/boilerplate-infosec) にある次のスタータープロジェクトをベースに構築されているか、または [GitHub](https://github.com/freeCodeCamp/boilerplate-infosec/) からクローンされています。
|
||||
|
||||
あなたのページは、あなたの同意なしに `<frame>` や `<iframe>` に挿入される可能性があります。 こうした可能性は、特にクリックジャック攻撃につながるおそれがあります。 クリックジャック攻撃とは、ユーザーをだまして、ユーザーが意図しているものとは違うページとやり取りさせる手法です。 これを利用し、iframe を通じて悪意のあるコンテキストでページを実行することが可能です。 こうした状況では、ハッカーによってあなたのページ上に隠れたレイヤーが配置されます。 悪意のあるスクリプトを実行するために、隠しボタンが使用されることがあります。 このミドルウェアは、X-Frame-Options ヘッダーを設定して、 サイトをフレーム内に配置できるユーザーを制限します。 DENY、SAMEORIGIN、ALLOW-FROM の 3 つのモードがあります。
|
||||
|
||||
サンプルのアプリをフレームに配置する必要はありません。
|
||||
|
||||
# --instructions--
|
||||
|
||||
`helmet.frameguard()` を使用し、config オブジェクト `{action: 'deny'}` を渡してください。
|
||||
|
||||
# --hints--
|
||||
|
||||
helmet.frameguard() ミドルウェアを正しくマウントする必要があります。
|
||||
|
||||
```js
|
||||
(getUserInput) =>
|
||||
$.get(getUserInput('url') + '/_api/app-info').then(
|
||||
(data) => {
|
||||
assert.include(
|
||||
data.appStack,
|
||||
'frameguard',
|
||||
'helmet.frameguard() middleware is not mounted correctly'
|
||||
);
|
||||
},
|
||||
(xhr) => {
|
||||
throw new Error(xhr.responseText);
|
||||
}
|
||||
);
|
||||
```
|
||||
|
||||
helmet.frameguard() の 'action' を 'DENY' に設定する必要があります。
|
||||
|
||||
```js
|
||||
(getUserInput) =>
|
||||
$.get(getUserInput('url') + '/_api/app-info').then(
|
||||
(data) => {
|
||||
assert.property(data.headers, 'x-frame-options');
|
||||
assert.equal(data.headers['x-frame-options'], 'DENY');
|
||||
},
|
||||
(xhr) => {
|
||||
throw new Error(xhr.responseText);
|
||||
}
|
||||
);
|
||||
```
|
||||
|
||||
# --solutions--
|
||||
|
||||
```js
|
||||
/**
|
||||
Backend challenges don't need solutions,
|
||||
because they would need to be tested against a full working project.
|
||||
Please check our contributing guidelines to learn more.
|
||||
*/
|
||||
```
|
@@ -0,0 +1,51 @@
|
||||
---
|
||||
id: 587d8247367417b2b2512c39
|
||||
title: >-
|
||||
helmet.xssFilter() を使用してクロスサイトスクリプティング (XSS) 攻撃のリスクを軽減する
|
||||
challengeType: 2
|
||||
forumTopicId: 301583
|
||||
dashedName: mitigate-the-risk-of-cross-site-scripting-xss-attacks-with-helmet-xssfilter
|
||||
---
|
||||
|
||||
# --description--
|
||||
|
||||
注意点として、このプロジェクトは [Replit](https://replit.com/github/freeCodeCamp/boilerplate-infosec) にある次のスタータープロジェクトをベースに構築されているか、または [GitHub](https://github.com/freeCodeCamp/boilerplate-infosec/) からクローンされています。
|
||||
|
||||
クロスサイトスクリプティング (XSS) はよくある攻撃の一種で、セッションの cookie やパスワードなどの機密データを盗む目的で、悪意のあるスクリプトを脆弱なページに挿入するものです。
|
||||
|
||||
XSS 攻撃のリスクを軽減するための基本的なルールはシンプルで、「ユーザーの入力を決して信用しない」ことです。 開発者は外部からのすべての入力を常にサニタイズ (洗浄) する必要があります。 そうした入力には、フォームからのデータ、GET クエリ URL からのデータ、さらには POST ボディからのデータなどがあります。 サニタイズとは、<、> といったの危険性のある文字を検出してエンコードすることです。
|
||||
|
||||
最新のブラウザーでは、より優れたソフトウェア戦略が採用されており、リスクの軽減に役立つ可能性があります。 多くの場合、それらは http ヘッダーを介して設定できます。
|
||||
|
||||
X-XSS-Protection HTTP ヘッダーは、基本的な保護機能です。 ブラウザーは、ヒューリスティック (発見的) フィルターを使用して、挿入される可能性のあるスクリプトを検出します。 このヘッダーが有効であると、ブラウザーによってスクリプトコードが変更され、コードが無害化されます。 ただし、サポートはまだ限定的です。
|
||||
|
||||
# --instructions--
|
||||
|
||||
`helmet.xssFilter()` を使用して、サーバーに送信される入力をサニタイズしてください。
|
||||
|
||||
# --hints--
|
||||
|
||||
helmet.xssFilter() ミドルウェアを正しくマウントする必要があります。
|
||||
|
||||
```js
|
||||
(getUserInput) =>
|
||||
$.get(getUserInput('url') + '/_api/app-info').then(
|
||||
(data) => {
|
||||
assert.include(data.appStack, 'xXssProtection');
|
||||
assert.property(data.headers, 'x-xss-protection');
|
||||
},
|
||||
(xhr) => {
|
||||
throw new Error(xhr.responseText);
|
||||
}
|
||||
);
|
||||
```
|
||||
|
||||
# --solutions--
|
||||
|
||||
```js
|
||||
/**
|
||||
Backend challenges don't need solutions,
|
||||
because they would need to be tested against a full working project.
|
||||
Please check our contributing guidelines to learn more.
|
||||
*/
|
||||
```
|
@@ -0,0 +1,44 @@
|
||||
---
|
||||
id: 587d8248367417b2b2512c3b
|
||||
title: helmet.ieNoOpen() を使用して、IE が信頼できない HTML を開けないようにする
|
||||
challengeType: 2
|
||||
forumTopicId: 301584
|
||||
dashedName: prevent-ie-from-opening-untrusted-html-with-helmet-ienoopen
|
||||
---
|
||||
|
||||
# --description--
|
||||
|
||||
注意点として、このプロジェクトは [Replit](https://replit.com/github/freeCodeCamp/boilerplate-infosec) にある次のスタータープロジェクトをベースに構築されているか、または [GitHub](https://github.com/freeCodeCamp/boilerplate-infosec/) からクローンされています。
|
||||
|
||||
一部のウェブアプリケーションでは、信頼されていない HTML をダウンロード用に提供しています。 Internet Explorer の一部のバージョンではデフォルトで、あなたのサイトのコンテキストで、こうした HTML ファイルを開きます。 つまり、あなたのページのコンテキストで、信頼されていない HTML ページが悪意のある動作を始める可能性があります。 このミドルウェアは、X-Download-Options ヘッダーを設定して、そうしたファイルを開かないようにします。 これにより、IE ユーザーは信頼されたサイトのコンテキストでダウンロードを実行できなくなります。
|
||||
|
||||
# --instructions--
|
||||
|
||||
サーバーで `helmet.ieNoOpen()` メソッドを使用してください。
|
||||
|
||||
# --hints--
|
||||
|
||||
helmet.ieNoOpen() ミドルウェアを正しくマウントする必要があります。
|
||||
|
||||
```js
|
||||
(getUserInput) =>
|
||||
$.get(getUserInput('url') + '/_api/app-info').then(
|
||||
(data) => {
|
||||
assert.include(data.appStack, 'ienoopen');
|
||||
assert.equal(data.headers['x-download-options'], 'noopen');
|
||||
},
|
||||
(xhr) => {
|
||||
throw new Error(xhr.responseText);
|
||||
}
|
||||
);
|
||||
```
|
||||
|
||||
# --solutions--
|
||||
|
||||
```js
|
||||
/**
|
||||
Backend challenges don't need solutions,
|
||||
because they would need to be tested against a full working project.
|
||||
Please check our contributing guidelines to learn more.
|
||||
*/
|
||||
```
|
@@ -0,0 +1,71 @@
|
||||
---
|
||||
id: 587d8249367417b2b2512c3f
|
||||
title: helmet.contentSecurityPolicy() を使用してコンテンツセキュリティポリシーを設定する
|
||||
challengeType: 2
|
||||
forumTopicId: 301585
|
||||
dashedName: set-a-content-security-policy-with-helmet-contentsecuritypolicy
|
||||
---
|
||||
|
||||
# --description--
|
||||
|
||||
注意点として、このプロジェクトは [Replit](https://replit.com/github/freeCodeCamp/boilerplate-infosec) にある次のスタータープロジェクトをベースに構築されているか、または [GitHub](https://github.com/freeCodeCamp/boilerplate-infosec/) からクローンされています。
|
||||
|
||||
このチャレンジでは、最新のブラウザーでさまざまなタイプの攻撃のリスクや影響を大幅に軽減することができる、新しい有望な防御方法を紹介します。 コンテンツセキュリティポリシー (CSP) を設定および構成すると、意図しないものがページに挿入されるのを防ぐことができます。 これにより、XSS の脆弱性、望ましくないトラッキング、悪意のあるフレームなどのさまざまな攻撃からアプリが保護されます。 CSP を機能させるには、信頼できるコンテンツソースの許可リストを定義します。 これらは、ウェブページが必要とするリソースの種類ごと (スクリプト、スタイルシート、フォント、フレーム、メディアなど) に構成できます。 複数のディレクティブを利用できるため、ウェブサイトの所有者はきめ細かい制御が可能です。 詳細については、HTML 5 Rocks、KeyCDN を参照してください。 残念ながら、CSP は古いブラウザではサポートされていません。
|
||||
|
||||
デフォルトでは、ディレクティブは制限が緩く設定されているため、defaultSrc ディレクティブをフォールバックとして設定することが重要です。 Helmet は、defaultSrc と default-src の両方の命名スタイルをサポートしています。 フォールバックは、指定されていないほとんどのディレクティブに適用されます。
|
||||
|
||||
# --instructions--
|
||||
|
||||
この課題では `helmet.contentSecurityPolicy()` を使用してください。 `directives` オブジェクトを追加してポリシーを構成してください。 オブジェクトの中で、`defaultSrc` を `["'self'"]` に設定し (ソースの許可リストは配列である必要があります)、デフォルトで自分のウェブサイトのアドレスだけを信頼するようにしてください。 また、`scriptSrc` ディレクティブを設定して、自分のウェブサイト (`'self'`) とドメイン `'trusted-cdn.com'` からのスクリプトのダウンロードのみを許可してください。
|
||||
|
||||
ヒント: `'self'` キーワードでは、シングルクォートがキーワード自体の一部となっているため、有効にするにはダブルクォートで囲む必要があります。
|
||||
|
||||
# --hints--
|
||||
|
||||
helmet.contentSecurityPolicy() ミドルウェアを正しくマウントする必要があります。
|
||||
|
||||
```js
|
||||
(getUserInput) =>
|
||||
$.get(getUserInput('url') + '/_api/app-info').then(
|
||||
(data) => {
|
||||
assert.include(data.appStack, 'csp');
|
||||
},
|
||||
(xhr) => {
|
||||
throw new Error(xhr.responseText);
|
||||
}
|
||||
);
|
||||
```
|
||||
|
||||
csp の config は正しくありません。 defaultSrc を ["'self'"] にし、scriptSrc を ["'self'", 'trusted-cdn.com'] にする必要があります。
|
||||
|
||||
```js
|
||||
(getUserInput) =>
|
||||
$.get(getUserInput('url') + '/_api/app-info').then(
|
||||
(data) => {
|
||||
var cspHeader = Object.keys(data.headers).filter(function (k) {
|
||||
return (
|
||||
k === 'content-security-policy' ||
|
||||
k === 'x-webkit-csp' ||
|
||||
k === 'x-content-security-policy'
|
||||
);
|
||||
})[0];
|
||||
assert.equal(
|
||||
data.headers[cspHeader],
|
||||
"default-src 'self'; script-src 'self' trusted-cdn.com"
|
||||
);
|
||||
},
|
||||
(xhr) => {
|
||||
throw new Error(xhr.responseText);
|
||||
}
|
||||
);
|
||||
```
|
||||
|
||||
# --solutions--
|
||||
|
||||
```js
|
||||
/**
|
||||
Backend challenges don't need solutions,
|
||||
because they would need to be tested against a full working project.
|
||||
Please check our contributing guidelines to learn more.
|
||||
*/
|
||||
```
|
@@ -0,0 +1,72 @@
|
||||
---
|
||||
id: 58a25bcef9fc0f352b528e7c
|
||||
title: BCrypt ハッシュを理解する
|
||||
challengeType: 2
|
||||
forumTopicId: 301586
|
||||
dashedName: understand-bcrypt-hashes
|
||||
---
|
||||
|
||||
# --description--
|
||||
|
||||
以降のチャレンジについては、以前のチャレンジとは異なる新しいスタータープロジェクトで作業します。 新しいスタータープロジェクトは [Replit](https://replit.com/github/freeCodeCamp/boilerplate-bcrypt) にあります。または [GitHub](https://github.com/freeCodeCamp/boilerplate-bcrypt/) からクローンできます。
|
||||
|
||||
BCrypt ハッシュは非常に安全です。 ハッシュは、基本的には元のデータのフィンガープリントであり、常に一意です。 元のデータをアルゴリズムに入力し、固定長の結果を返すことで実現しています。 このプロセスをさらに複雑にして安全性を高めるため、ハッシュをソルト (*salt*) することもできます。 ハッシュをソルトするには、ハッシュ処理の前にランダムなデータを元のデータに追加する必要があります。これにより、ハッシュの解読がさらに困難になります。
|
||||
|
||||
BCrypt のハッシュは、常に `$2a$13$ZyprE5MRw2Q3WpNOGZWGbeG7ADUre1Q8QO.uUUtcbqloU0yvzavOm` のような構造になります。 データの先頭の小さなビット `$2a` は、どのようなハッシュアルゴリズムが使用されたかを定義しています。 次の部分 `$13` は*コスト*を定義しています。 コストとは、ハッシュの計算に必要となる処理能力のことです。 コストは 2 の累乗の対数スケールで示され、データが何回ハッシュアルゴリズムを通過するかを決定します。 たとえば、コストが 10 の場合は平均的なコンピュータで 1 秒間に 10 個のパスワードをハッシュ化できますが、コストが 15 の場合は 1 回のハッシュ化に 3 秒かかり、さらにコストが 31 の場合は 1 回のハッシュ化の完了に数日かかることになります。 現時点では、コスト 12 が非常に安全だと考えられています。 ハッシュの最後の部分 `$ZyprE5MRw2Q3WpNOGZWGbeG7ADUre1Q8QO.uUUtcbqloU0yvzavOm` は、数字、ピリオド、文字からなる 1 つの大きな文字列のように見えますが、実際には 2 つの別々の情報です。 最初の 22 文字はプレーンテキストのソルトで、残りはハッシュ化されたパスワードです。
|
||||
|
||||
# --instructions--
|
||||
|
||||
BCrypt の使用を始めるため、BCrypt を依存関係としてプロジェクトに追加し、サーバーで 'bcrypt' として require してください。
|
||||
|
||||
`server.js`ファイルの中に、これらのレッスンで使用するすべてのコードを最初に示したコードの間に追加してください。 追加したコードを変更したり削除したりしないでください。
|
||||
|
||||
正しいと思ったら、ページを送信してください。
|
||||
|
||||
# --hints--
|
||||
|
||||
BCrypt を依存関係にする必要があります。
|
||||
|
||||
```js
|
||||
(getUserInput) =>
|
||||
$.get(getUserInput('url') + '/_api/package.json').then(
|
||||
(data) => {
|
||||
var packJson = JSON.parse(data);
|
||||
assert.property(
|
||||
packJson.dependencies,
|
||||
'bcrypt',
|
||||
'Your project should list "bcrypt" as a dependency'
|
||||
);
|
||||
},
|
||||
(xhr) => {
|
||||
throw new Error(xhr.statusText);
|
||||
}
|
||||
);
|
||||
```
|
||||
|
||||
BCrypt を正しく require する必要があります。
|
||||
|
||||
```js
|
||||
(getUserInput) =>
|
||||
$.get(getUserInput('url') + '/_api/server.js').then(
|
||||
(data) => {
|
||||
assert.match(
|
||||
data,
|
||||
/bcrypt.*=.*require.*('|")bcrypt('|")/gi,
|
||||
'You should correctly require and instantiate socket.io as io.'
|
||||
);
|
||||
},
|
||||
(xhr) => {
|
||||
throw new Error(xhr.statusText);
|
||||
}
|
||||
);
|
||||
```
|
||||
|
||||
# --solutions--
|
||||
|
||||
```js
|
||||
/**
|
||||
Backend challenges don't need solutions,
|
||||
because they would need to be tested against a full working project.
|
||||
Please check our contributing guidelines to learn more.
|
||||
*/
|
||||
```
|
Reference in New Issue
Block a user