微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

通过 Google 进行 angularx-social-login 在 Opera 中不起作用

如何解决通过 Google 进行 angularx-social-login 在 Opera 中不起作用

我在 Angular 中通过谷歌测试了 OAuth。我编写了以下代码以进行简单授权。但由于某种原因,它在 Opera 中引发了错误。但在谷歌浏览器中,Edge 可以完美运行。也许有人有同样的问题

enter image description here

我在 app.module.ts

中有以下代码
import { NgModule } from '@angular/core';
import { browserModule } from '@angular/platform-browser';
import {HttpClientModule} from "@angular/common/http"
import {FormsModule} from "@angular/forms"

import { AppComponent } from './app.component';
import { AppRoutingModule } from './app-routing.module';
import {LoginComponent} from "./login/login.component"

import {SocialAuthServiceConfig,SocialLoginModule,GoogleLoginProvider } from 'angularx-social-login';



@NgModule({
  declarations: [
    AppComponent,LoginComponent
  ],imports: [
    browserModule,AppRoutingModule,HttpClientModule,FormsModule
  ],providers: [
    {
      provide: 'SocialAuthServiceConfig',useValue: {
        autoLogin: false,providers: [
          {
            id: GoogleLoginProvider.PROVIDER_ID,provider: new GoogleLoginProvider(
              '324093147269-l4aepli8cfokli5fuiotn9huekmjugq7.apps.googleusercontent.com'
            )
          }
        ]
      } as SocialAuthServiceConfig,}
  ],bootstrap: [AppComponent]
})
export class AppModule { }

使用简单的app.component.html

<h2>fsdnklflsdkfn</h2>
<app-login></app-login>

login.component.ts

import { Component,OnInit } from '@angular/core';
import {SocialAuthService } from 'angularx-social-login';
import {SocialUser,GoogleLoginProvider } from 'angularx-social-login';

@Component({
  selector: 'app-login',templateUrl: './login.component.html',styleUrls: ['./login.component.css']
})
export class LoginComponent implements OnInit {

  user:SocialUser=new SocialUser();
  constructor(private socialAuthService: SocialAuthService) 
  {
    this.socialAuthService.authState.subscribe((user)=>{
      this.user=user;
      console.log("aadas");
    })
   }

  ngOnInit() {
      this.socialAuthService.authState.subscribe((user)=>{
      this.user=user;
      console.log("aadas");
    })
  } 
  signInWithGoogle(){
    this.socialAuthService.signIn(GoogleLoginProvider.PROVIDER_ID)
  console.log("aadas");
  }
  signOut(){
    this.socialAuthService.signOut();
  }
}

login.component.html

<div *ngIf="!user" class="card text-center">
  <h6 class="card-header">Google login</h6>
  <div class="card-clock">
    <h4 class="card-title">Not Signed in</h4>
    <p class="card-text">Sign in</p>
  </div>
</div>
<div class="card-block">
  <button (click)="signInWithGoogle()">Sign in</button>
</div>


<div *ngIf="user" class="card text-center">
  <h6 class="card-header">Google login</h6>
  <div class="card-clock">
    <h4 class="card-title">{{user.email}}</h4>
    <p class="card-text">{{user.authToken}}</p>
  </div>
</div>
<div class="card-block">
  <button (click)="signOut()">Sign out</button>
</div> 

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。