About Ionic/angular framework

Ionic Framework
1

i have an err to sign in with google :pensive: please can anyone help me to how i can overcome this error…:

error shows in console:

Uncaught {error: ‘idpiframe_initialization_failed’, details: ‘You have created a new client application that use…i/web/guides/gis-migration) for more information.’}

here is my code :

home.page.html:

<ion-title>

  Google Sign In

</ion-title>

<ion-button (click)=“signIn()” *ngIf="!user">

<ion-icon name="logo-google" slot="start"></ion-icon>Sign In

<ion-button expand=“full” (click)=“signOut()” *ngIf=“user”>Sign Out

<ion-item *ngIf=“user”>

<ion-avatar>

  <img [src]="user.imageUrl" />

</ion-avatar>

<ion-label>

  {{user.givenName}} {{user.familyName}}

  <p>{{user.email}}</p>

</ion-label>

home.page.ts file:

import { Component } from ‘@angular/core’;

import { GoogleAuth } from ‘@codetrix-studio/capacitor-google-auth’;

import { isPlatform } from ‘@ionic/angular’;

@Component({

selector: ‘app-home’,

templateUrl: ‘home.page.html’,

styleUrls: [‘home.page.scss’],

})

export class HomePage {

user = null;

constructor() {

if (!isPlatform('capacitor')) {

  GoogleAuth.initialize();

}

}

async signIn() {

this.user = await GoogleAuth.signIn();

console.log('user:', this.user);

}

async signaOut() {

await GoogleAuth.signOut();

this.user = null;

}

}

in index.html

Ionic App <meta name="viewport" , 
content="viewport-fit =cover, width =device-width,  initial-scale= 1.0   maximum-scale=1.0, minimum-scale=1.0, user-scale=">
<meta name="google-signin-client_id" 
content="458018620622-91talg7l9qc56gt6n3697jir7335u8lf.apps.googleusercontent.com" />

in capacitor.config.json:

{

“appId”: “io.ionic.starter”,

“appName”: “form”,

“webDir”: “www”,

“bundledWebRuntime”: false,

“plugins”: {

"GoogleAuth": {

  "scopes": ["profile", "email"],

  "serverCliendId": "458018620622-26eoi0kd5fjodcs4l6ihdnddpg0osg4f.apps.googleusercontent.com",

  "forceCodeRefreshTokken": true

}

}

}