⚔️🔰ジャバスクリプト🛡️⚔️

コードのセキュリティ詳細

誰かがあなたのウェブサイトを訪問するとき、あなたのJavaScriptコードは彼らのブラウザーで動きます.したがって、任意の機密データがあれば、あなたのコードは潜在的に誰でも見られるかもしれないこのデータを公開するでしょう.
例えば、
コードを管理者パスワードを含まないようにしてください.または任意のパスワードをどこかのJSコードです.
誰かがあなたのコードを見たいならば、彼らがしなければならないすべては彼らのブラウザのdevツールに行って、源をクリックして、JSファイルをクリックすることです.時々、彼らがWebpackまたは類似したツールを使用しているならば、WebPackによって生成されるコードはトップであります、そして、人間の読めるコードは一番下にあります.

いくつかのケースでは、彼らは“1つのライナー”のコードが表示されますが、人々がそれを読みやすくするために行う必要がある唯一のものは、JavaScriptフォーマッタツールをオンラインに行って、それをブームに貼り付けることです!読みやすい!
一方、APIキーを公開しないようにするAPIもあります.APIの一部は、IPS、ドメイン名などに基づいてAPIキーの使用を制限することができます.いくつかのセキュリティ資格情報を共有するのを避けるもう一つの方法はenvironment variables そして、何らかの理由で、あなたのコードにいくつかの機密データを持っている必要があるなら、あなたのサーバー側コードにNODEJSのようにそれを持っているように提案します.

😨 クロスサイトスクリプト攻撃😱

私はXSSの攻撃を聞くだけであなたのことを知らない!もう怖いです.
この攻撃はフロントエンド側にのみ適用される.私はバックエンドが脆弱であることができないと言っていません.
この攻撃は👹 悪意のあるJavaScriptが注入され、実行されます.
基本的に、誰かが何らかのコードをアプリケーションに注入することができれば、それは多くのことをすることができます.Googleや航空会社のページに行ったり、ローカルストレージにアクセスしてJavaScriptからたくさんの情報を集めているかのように考えてください.
セキュリティGurusのおかげで、より新しいブラウザは、我々のinnerhtmlで実行されているタグをブロックすることによって、これで助けます.はい、まだ注入することができますが、それは実行されません.
だけど!が、常にです.を使用する場合 innerhtmlを通して注入することによって、あなたは以下をすることができます:

<img src="" onerror="alert('xss')/>

したがって、コードが実行されると、イメージソースを探すでしょう.それが1つもないので、警告()を表示します.
innerhtmlを使う代わりにこれを避けることができます.TextContentを使用します.しかし、時々、あなたは実際にinnerhtmlを必要とするかもしれません.その場合は、レンダリングする前にコードを消去する必要があります.あなたは非常にクールなNPMパッケージを使用して、そうすることができますsanitize-html . このパッケージはあなたのテキストを「きれいにします」、そして、悪意のあるコードが実行されないように、不要なタグを取り除きます.また、サーバー側でいくつかの衛生を行う必要があります.形式で情報を入力するとき、私は悪意のあるコードをじっと見つめることができました、そして、このコードはDBに格納されます.一旦それがレンダリングされるならば、それは実行されることができます.データベースに当る前に、このNPMパッケージをサーバーに使用してください.

第三者図書館

サードパーティライブラリを使用するときは、彼らが安全であることを確認する必要があります.時々、ダウンロードの数やGithubの星は、これが安全なライブラリであることを意味しません.
チェックアウトthis 記事はどのように誰かがNPMパッケージを使用してCryptosを盗む非常に興味深い話について.
NPMは、パッケージをインストールするときに脆弱性スキャンを実行することによって、これで少し役立ちます.注意:すべての脆弱性は悪いです!解凍する前にいくつかの研究をしなさい.

クロスサイトリクエスト

この種の攻撃は、準備されたページにつながるリンクをクリックして、あなたのローカルクッキーを乱用して、通常、同様に話をするページにリクエストを送るときです.
これはサービス側の問題ですが、言及することは重要です.イマジン
たとえば、“X”のウェブサイトに行くことができますし、ローカルストレージからの情報の一部を盗む.その後、彼らは偽のウェブサイトにあなたを再指示;例えば、PayPalのサイトを見てみましょう.彼らはあなたのローカルストレージから得た情報で、彼らはあなたがお金を送信したくない人にお金を送るためにこれを操作することができます.それはハッカーのための長いプロセスでありえます、しかし、それはできます.
この攻撃はNODEJSやJavaScriptテクノロジに適用されるだけでなく、一般的にWeb開発にも適用されます.
CRFは阻止できますか?はい.
CSRFの攻撃を防ぐための3つのテクニックがあります.

同じサイトクッキーメソッドを使用して:これは、特定のクッキーのサードパーティ製の使用を許可しないようにブラウザに指示するためにあなたのクッキーに追加することができます新しく開発された属性です.この属性は、クッキー自身を設定すると同時に、サーバーによって設定されます.

チャレンジ応答:保護の追加層として、フォームが提出されたときにユーザーからのチャレンジ応答を必要とすることができます.チャレンジレスポンスの例としては、

- captchaの検証(非常に一般的です).
-パスワード認証や個人情報の認証を再度要求する
-ワンタイムトークンを発行する
注意:高いセキュリティを必要とするアプリケーションでは、トークンとチャレンジ応答の両方を使用してセキュリティを確保する必要があります.
3 .アンチCSRFトークン:ユーザーが情報を送信したり、サイトとやり取りしたり、クッキーを生成する他の何かを行うと、CSRFトークンもクッキーリクエストに含まれているはずです.リクエストを処理する前に、このトークンの確実性または存在さえ確認される検証プロセスを通して、この要求はそれから実行されます.トークンが不足しているか間違っているなら、要求は拒絶されることができます.

クロスオリジンリソース共有😅

このコンセプトは、ブラウザ側のアプリケーションからの要求は、同じサーバー上で実行バックエンドにのみ行うことができます.
何らかの理由で、フロントエンドと別のサーバーでバックエンドをホストする場合は、この問題がありますが、応答のヘッダーを指定することでこれを修正することができます.これはデフォルトでブラウザが他のサーバに「話をする」ことを許可しないが、右側サーバ側のヘッダではこれをオーバーライドできるという概念です.Cors NPMパッケージを使用するか、手動で行うことができます.
ノード.JSコード

app.use(function(req, res, next) {
  res.header("Access-Control-Allow-Origin", "*");
  res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
  res.json({data: [1,2,3,4]})
});

注意:フロントエンドとバックエンドと対話するコードを持つWebアプリケーションには、Corsの概念が適用されます.NodeJs、PHP、または何が問題ではない.