角7拦截器

Question

我正在调用一个API，它将重定向到外部URL，执行身份验证，并再次重定向到我的主页，并在主页url中附加一些参数。

默认网址：https://mytesting.com

重定向网址后：https://mytesting.com/?someValue=123E234

当我重定向到默认页面(SomeValue)时，我想检索“https://mytesting.com/?someValue=123E234”。在java中，我们可以通过过滤器检索它。在角度上，我使用的是拦截器，但是拦截器永远不会被调用，也不知道如何使用拦截器来实现这一点。

共享/exampleAuth.拦截器。

@Injectable()
export class ExampleAuth implements HttpInterceptor {

  intercept(request: HttpRequest<any>, next: HttpHandler):
    Observable<HttpEvent<any>> {

    console.log('Checking Interceptor'); // This is never called
    return next.handle(request);
  }

}

home.componet

  @Component({
  selector: 'home',
  templateUrl: './home.component.html',
  styleUrls: ['./home.component.scss']
   })

   export class LoginComponent implements OnInit{
   constructor(private someservice: SomeotherService,
          private _router: Router) {

    ngOnInit() {
    window.location.href ="https://GoingforAuthentication.com"
     }


   }


  }

app.module.ts

@NgModule({
  declarations: [
    AppComponent,
  ],
  imports: [
    BrowserModule,
    AppRoutingModule,
    HttpModule
  ],
  providers: [
    SomeotherService,
    ExampleAuth
  ],
  bootstrap: [AppComponent]
})
export class AppModule {
}

Answer 1

我不认为你需要用拦截器。此逻辑将特定于您的组件。您可以订阅ActivatedRoute中的可观测值来动态获取查询参数。

import { ActivatedRoute } from '@angular/router';
...

  constructor(
    private route: ActivatedRoute
  ) { }

  ngOnInit() {
    this.route.queryParams.subscribe(queryParam => {
      console.log(queryParam.someValue);
      // Do something with new query param here. Eg. update view, api call, etc.
    });
  }

这样，即使在内部更新角度代码中的查询参数，也可以在订阅查询参数时相应地更新视图。

Answer 2

providers的变化

ExampleAuth

至：

{ provide: HTTP_INTERCEPTORS, useClass: ExampleAuth, multi: true }

还请检查以下内容：https://angular.io/guide/http#intercepting-requests-and-responses

Answer 3

Http拦截器用来通过HttpClient的调用拦截您的请求。当你的应用程序启动时，你所需要的只是检查你是否需要在url中使用params。为此，您需要在您的ActivatedRoute中注入app.component.ts服务。

constructor(private _route: ActivatedRoute, ....) { ... }

并在someValue中检查ngOnInit

ngOnInit() {
    const someValue = this._route.snapshot.queryParams['someValue'];
    if (someValue == '....') {
        // have been redirected from auth
    }
}

https://angular.io/api/router/ActivatedRoute