Question

我使用ngx-translator进行本地化。当我尝试读取存储在本地文件夹中的本地化的json文件时，我收到错误HttpErrorResponse {headers：HttpHeaders，status：404，statusText：“Not Found”，url：“http：/host.com/api/ assets / i18n / en.json“，ok：false，...}。我在我的应用程序中使用的拦截器问题。

// app.module.ts
export function HttpLoaderFactory(http: HttpClient) {
  return new TranslateHttpLoader(http, 'assets/i18n/', '.json');
}

如何在此功能中禁用拦截器？我试图将标题设置为X-Skip-Interceptor，但它没有帮助。

Answer 1

您可以使用HttpBackend

注入后，HttpBackend直接将请求分派给后端，无需经过拦截器链。

在您的app.module.ts中，将HttpBackend作为deps而不是HttpClient传递

TranslateModule.forRoot({
      loader: {
        provide: TranslateLoader,
        useFactory: (HttpLoaderFactory),
        deps: [HttpBackend],
      },
    }),

并按如下所示修改HttpLoaderFactory

export function HttpLoaderFactory(handler: HttpBackend) {

    const http = new HttpClient(handler);

    return new TranslateHttpLoader(http, './assets/i18n/', '.json');
}

Answer 2

//Read your local json data like below

private _productURL = 'api/products/products.json';    
getProducts(): Observable<any> {
        return this._http.get(this._productURL).map((response : Response) => <any> response.json())
        .do(data =>console.log(JSON.stringify(data))).catch(this.handleError);
}

Answer 3

对此有一个简单的解决方法。您可以像前面一样跳过翻译文件。

function MSALAngularConfigFactory(): MsalAngularConfiguration {
  return {
    popUp: false,
    consentScopes: [
      environment.backendConfig.resourceScope
    ],
    protectedResourceMap: [
      [environment.backendConfig.url, [environment.backendConfig.resourceScope]],
      ['./assets/i18n/*.json', null]
    ],
  };
}

我们在 protectedResourceMap 中设置了它。如果您收到错误消息“src/app/app.module.ts 中的错误：47:30 - 错误 TS2322：类型 'null' 不可分配给类型 'string[]'。”使用 as any。

protectedResourceMap: [
      [environment.backendConfig.url, [environment.backendConfig.resourceScope]],
      ['./assets/i18n/*.json', null as any]
    ]

如果您的图片没有加载到您的网站中，那可能是您的 CSS 的问题。将 background 样式从 background: url(../../assets/img/background.svg) 更改为 background: url(/assets/img/background.svg)。您可以在此GitHub issue中阅读更多内容。

如何在导出函数中禁用Interceptor？

3 个答案: