Question

我们正在尝试将nebular / auth（已添加nebular / theme）集成到我们的新角度项目中，以实现配置Google Oauth2。还可以在AppModule的imports数组中配置HttpClientModule。

在将星云/身份验证模块集成到新的angualar（Angualar 8.2.9）中以实现配置Google Oauth2身份验证机制时遇到上述错误。

AppModule.ts

import { BrowserModule } from "@angular/platform-browser";
import { NgModule } from "@angular/core";
import { FormsModule } from "@angular/forms";
import { AppRoutingModule } from "./app-routing.module";
import { AppComponent } from "./app.component";
import {
  NbAuthModule,
  NbOAuth2AuthStrategy,
  NbAuthOAuth2JWTToken,
  NbOAuth2ResponseType
} from "@nebular/auth";
import { HttpClientModule } from "@angular/common/http";
@NgModule({
  declarations: [AppComponent],
  imports: [
    HttpClientModule,
    BrowserModule,
    AppRoutingModule,
    FormsModule,
    NbAuthModule.forRoot({
      strategies: [
        NbOAuth2AuthStrategy.setup({
          name: "google",
          clientId:
            "xxx",
          clientSecret: "xxx",
          authorize: {
            endpoint: "https://accounts.google.com/o/oauth2/v2/auth",
            responseType: NbOAuth2ResponseType.TOKEN,
            scope: "https://www.googleapis.com/auth/userinfo.profile",

            redirectUri: "http://localhost:4201/pages"
          },
          token: {
            class: NbAuthOAuth2JWTToken,
            requireValidToken: false
          }
        })
      ]
    })
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule {}

AppComponent.ts

import { Component } from "@angular/core";
import { NbAuthService } from "@nebular/auth";
@Component({
  selector: "app-root",
  templateUrl: "./app.component.html",
  styleUrls: ["./app.component.css"]
})
export class AppComponent {
  title = "oauth2";

  constructor(private authService: NbAuthService) {}

  sub() {
    // this.authService.authenticate('google')
  }
}

AppComponent.html

<div class="container">
  <h1>Sign-in with Google</h1>
  <form #login="ngForm" (ngSubmit)="sub()">
    <button type="submit" class="btn btn-success">Login</button>
  </form>
</div>
<router-outlet></router-outlet>

如果一切配置正确，应该显示“登录”按钮，该按钮会将用户带到Google身份验证页面。但是显示该错误（注释sub（）方法中的代码）如何解决此问题？有版本冲突吗？

Answer 1

Nebular Auth模块也需要安装主题模块。

在您的app.module.ts中将其添加到providers

        providers: [ ..., NbThemeModule.forRoot() ]

那应该可以解决该错误。

StaticInjectorError（AppModule）[NbOAuth2AuthStrategy-> InjectionToken Window]； NullInjectorError：InjectionToken窗口没有提供程序

1 个答案: