Angular のインターセプター

導入

この記事では、Angular 17 で機能的な HTTP インターセプターを使用する方法について説明します。インターセプターを使用すると、HTTP リクエストと応答の操作が可能になり、ヘッダーの追加、ロギング、認証などの機能が容易になります。

機能的な HTTP インターセプターとは何ですか?

Angular で動作する HTTP インターセプターは、送信リクエストと受信レスポンスをインターセプトし、場合によっては変換するために使用されるミドルウェア関数です。 Angular 17 では、HttpInterceptorFn を使用して動作するインターセプターを作成できます。

コード例

これは、動作する HTTP インターセプターを作成する方法を示す簡単な例です:

リーリー

この例では、インターセプターは各送信リクエストの URL と対応する応答をログに記録します。

インターセプターの使用

このインターセプターを使用するには、アプリケーションの初期化中にprovideHttpClientとwithInterceptorsを使用して構成する必要があります:

リーリー

コードの説明

• HttpInterceptorFn: インターセプター関数を表す型。
• HttpRequest: HTTP リクエストを表します。
• HttpHandlerFn: インターセプターチェーン内の次のリクエストハンドラー関数を表します。
• next(req): チェーン内の次のインターセプターを呼び出すか、それが最後のインターセプターの場合はリクエストを送信します。

結論

Angular 17 の機能インターセプターは、HTTP リクエストとレスポンスを処理する柔軟かつ強力な方法を提供します。これらは、認証、ロギング、エラー処理などの機能横断的なタスクに特に役立ちます。

詳細については、インターセプターに関する Angular の公式ドキュメント【13†出典】【14†出典】を参照してください。

以上がAngular のインターセプターの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。