如何解决通过 Google 进行 angularx-social-login 在 Opera 中不起作用
我在 Angular 中通过谷歌测试了 OAuth。我编写了以下代码以进行简单授权。但由于某种原因,它在 Opera 中引发了错误。但在谷歌浏览器中,Edge 可以完美运行。也许有人有同样的问题
我在 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 举报,一经查实,本站将立刻删除。