説明
外部 API のエンドポイントに http: を使用すると、リクエストが実際に送信される環境では、TLS による機密性、完全性、サーバー認証が得られません。通信経路にアクセスできる攻撃者がリクエストや応答を読み取ったり改ざんしたりするおそれがあります。ただし、HTTPS ページからの Axios リクエストは、通常、ブラウザーの混在コンテンツポリシーでブロックされます。この場合は平文で送信されず、リクエストが失敗します。
送受信する機密情報と、コードを実行するブラウザーやサーバーの環境を併せて確認してください。
想定される影響
- 平文で送信されると、認証情報、トークン、個人情報など、通信に含まれるデータが漏えいする可能性があります。
- 攻撃者が応答を書き換え、誤ったデータや悪意のあるコンテンツをアプリケーションに渡すおそれがあります。
- HTTPS ページでは混在コンテンツのブロックにより API リクエストが失敗し、機能が利用できなくなる場合があります。
対処方法
- エンドポイントを
https:に変更し、API が HTTPS で同じリソースを提供することを確認してください。最初に HTTP で API リクエストを送り、その後リダイレクトする方式に依存しないでください。 - 有効なサーバー証明書と最新の TLS 設定を構成し、API の平文 HTTP リクエストを拒否してください。ブラウザーで使用する HTTPS の出所には HSTS を適用してください。
- ローカル開発用のアドレスは環境別の設定で管理し、本番用のバンドルに含まれないことを確認してください。証明書検証やブラウザーの混在コンテンツ保護を無効にしないでください。
例
変更前
tsx
import axios from 'axios';
axios.post('http://api.example.com/login', credentials);
const api = axios.create({
baseURL: 'http://api.example.com/v1',
});
変更後
tsx
import axios from 'axios';
axios.post('https://api.example.com/login', credentials);
const api = axios.create({
baseURL: 'https://api.example.com/v1',
});
説明:
- 変更前: 保護されていないコンテキストやブラウザー以外の実行環境では、平文 HTTP で送受信される可能性があります。HTTPS ページでは、ブラウザーがリクエストをブロックする場合があります。
- 変更後: 適切に設定された HTTPS により、転送中の機密性、完全性、サーバー認証を保護します。アプリケーションの URL と併せて、サーバーの TLS 設定も確認が必要です。