透過攔截，開發人員可以宣告攔截器來檢查和轉換從應用程式到伺服器的 HTTP 請求。 相同的攔截器還可以在返回應用程式的途中檢查和轉換伺服器的響應。

多個攔截器共同形成請求/響應處理程式的前向和後向鏈。

攔截器可以以常規、標準的方式為每個 HTTP 請求/響應執行各種隱式任務，包括但不限於身份驗證到日誌記錄。

如果沒有攔截器的概念，開發人員將不得不為每個 HttpClient 方法呼叫顯式地實現這些任務。

要實現攔截器，開發人員必須宣告一個實現 `HttpInterceptor` 介面的 `intercept()` 方法的類。

下面是一個攔截器的實現，雖然攔截了 HTTP 請求之後，並未執行任何邏輯，只是簡單的把請求傳遞給後向鏈：

```typescript
import { Injectable } from '@angular/core';
import {
  HttpEvent, HttpInterceptor, HttpHandler, HttpRequest
} from '@angular/common/http';

import { Observable } from 'rxjs';

/** Pass untouched request through to the next request handler. */
@Injectable()
export class NoopInterceptor implements HttpInterceptor {

intercept(req: HttpRequest<any>, next: HttpHandler):
    Observable<httpevent>> {
    return next.handle(req);
  }
}
```
`intercept` 方法將請求轉換為最終返回 HTTP 響應的 Observable。

大多數攔截器在進入的過程中檢查請求，並將可能更改的請求轉發到實現 HttpHandler 介面的下一個物件的 handle() 方法。

與 intercept() 一樣，handle() 方法將 HTTP 請求轉換為 HttpEvents 的 Observable，最終包含伺服器的響應。 intercept() 方法可以檢查該 observable 並在將其返回給呼叫者之前對其進行更改，比如新增日誌記錄，欄位過濾等等邏輯。

看個具體的例子：

![](https://img-blog.csdnimg.cn/img_convert/4739099cb36225a1a10690d508ff8d89.png)

上圖是 SAP Spartacus UI SiteContextInterceptor 的實現，關鍵點如上圖圖例1和2所示：

1. 使用 `request.url.includes(this.occEndpoints.getBaseUrl()` 判斷當前請求 url 是否包含 `baseUrl` 片段。

2. 如果包含，使用 `request.clone`, 給當前 HTTP 請求，新增 language 和 curr 引數。

這兩個自動新增的引數，效果如下:

![](https://img-blog.csdnimg.cn/img_convert/8008868827d091b100276a7a5a4b04fa.png)

url：`http://aaa/occ/v2/electronics-spa/currencies?lang=en&curr=USD`

`next` 物件代表攔截器鏈中的下一個攔截器。鏈中的最後一個是 HttpClient `後端處理程式`，它將請求傳送到伺服器並接收伺服器的響應。

大多數攔截器呼叫 next.handle() 以便請求流向下一個攔截器，最終流向後端處理程式。 攔截器可以跳過呼叫 next.handle()，使鏈短路，並返回自己的 Observable 和人工伺服器響應。

這是 Express.js 等框架中常見的中介軟體模式。</httpevent></any>

Angular 裡 HTTP 請求和響應結構的攔截器(interceptors)在 SAP Spartacus 中的應用

相關文章