我可以使用httpclient功能，但无法获取数据

Question

以下是我收到的错误：

“NG02801：Angular 检测到

HttpClient

未配置为使用

fetch

API。强烈建议为使用服务器端渲染的应用程序启用

fetch

，以获得更好的性能和兼容性。要启用

fetch

，请添加

withFetch()

到应用程序根目录的 ProvideHttpClient()` 调用。”

我收到的上述问题的解决方案是：

“在您的 app.config.ts 中提供HttpClient(withFetch())。”

但是我使用的是 Angular 18 并且没有

app.config.ts

文件，而是有

app.module.ts

文件

那我该怎么办？

Answer 1

我猜测您使用的 SSR 版本没有

app.config.ts

，不共享配置，因此您需要手动导入它。下面您需要将

provideHttpClient(withFetch())

添加到

providers

和

app.module.ts

上的

app.module.server.ts

数组中，以消除错误，同时提供一个工作 stackblitz 供代码参考。

app.module.ts

import { NgModule } from '@angular/core';
import {
  BrowserModule,
  provideClientHydration,
} from '@angular/platform-browser';
import { provideHttpClient, withFetch } from '@angular/common/http';
import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';

@NgModule({
  declarations: [AppComponent],
  imports: [BrowserModule, AppRoutingModule],
  providers: [provideClientHydration(), provideHttpClient(withFetch())],
  bootstrap: [AppComponent],
})
export class AppModule {}

app.module.server.ts

import { NgModule } from '@angular/core';
import { ServerModule } from '@angular/platform-server';

import { AppModule } from './app.module';
import { AppComponent } from './app.component';
import { provideHttpClient, withFetch } from '@angular/common/http';

@NgModule({
  imports: [AppModule, ServerModule],
  bootstrap: [AppComponent],
  providers: [provideHttpClient(withFetch())],
})
export class AppServerModule {}

Stackblitz 演示 ->

cd test

->

npm i

->

npm run start