将标题添加到角度服务工作者响应

Question

一些服务人员的答复违反了CSP，我可能需要添加此标头：

Content-Security-Policy =“ connect-src *;”

按照here和here的说明对服务人员的所有答复。

如何使用角度PWA将响应标头添加到服务人员响应中？

Answer 1

您可以使用http拦截器在一个地方拦截任何类型的http请求和响应。它也适用于服务人员。

请找到详细的说明here。

https://angular.io/api/common/http/HttpInterceptor

示例：

intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
    return next.handle(request).pipe(
    ...          
));
}

Answer 2

不需要在服务工作者返回的缓存响应上设置响应标头，而是解决方案是在服务器上为SW脚本的响应设置特殊的CSP标头。也就是说，当浏览器请求ngsw-worker.js（Angular SW脚本的默认名称）时，服务器应在该响应中附加特殊的CSP标头（例如Content-Security-Policy：connect-src *）。