Question

我在角度为5的项目中创建了拦截器，但是没有用，我在文件app.module.ts中插入了拦截器，但是也出错，并且我在console.log中添加了用于测试的console.log，但未显示console.log

代码拦截器：

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 AuthInterceptor implements HttpInterceptor {

      intercept(req: HttpRequest<any>, next: HttpHandler):
        Observable<HttpEvent<any>> {
            console.log('redfùmfs');
            const clonedRequest = req.clone({
                headers: req.headers.set('Authorization', 'Bearer '+localStorage.getItem('token'))

            });
        return next.handle(clonedRequest);
      }
    }

代码app.module.ts：当我在提供程序中添加名称拦截器

时

import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { HttpModule } from '@angular/http';
import { RouterModule } from '@angular/router';

import { AppRoutingModule } from './app.routing';
import { ComponentsModule } from './components/components.module';

import { AppComponent } from './app.component';

import { DashboardComponent } from './dashboard/dashboard.component';
import { UserProfileComponent } from './user-profile/user-profile.component';
import { TableListComponent } from './table-list/table-list.component';
import { TypographyComponent } from './typography/typography.component';
import { IconsComponent } from './icons/icons.component';
import { MapsComponent } from './maps/maps.component';
import { NotificationsComponent } from './notifications/notifications.component';
import { UpgradeComponent } from './upgrade/upgrade.component';

import { ArticleService } from './services/article.service';
import { AuthInterceptor } from './services/auth.interceptor';
import { HTTP_INTERCEPTORS } from '@angular/common/http';

import {
  AgmCoreModule
} from '@agm/core';
import { AdminLayoutComponent } from './layouts/admin-layout/admin-layout.component';

@NgModule({
  imports: [
    BrowserAnimationsModule,
    FormsModule,
    HttpModule,
    ComponentsModule,
    RouterModule,
    AppRoutingModule,
    AgmCoreModule.forRoot({
      apiKey: 'YOUR_GOOGLE_MAPS_API_KEY'
    })
  ],
  declarations: [
    AppComponent,
    AdminLayoutComponent,
  ],
  providers: [
  ArticleService,
    {
      provide: HTTP_INTERCEPTORS,
      useClass: AuthInterceptor,
      multi: true
    }
  ],
  bootstrap: [AppComponent]
})
export class AppModule { }

我在提供程序appmodule中注入了拦截器，但也出错了

Answer 1

您在app.module.ts中犯了错误。您导入了HttpModule的早期版本。将代码替换为以下内容：

import { HttpClientModule } from '@angular/common/http';

并导入AppModule的导入

角5拦截器

1 个答案: