I'm setting up a page where I can Id with a Google account. This is my code:
import React from "react"import { StyleSheet, Text, View, Image, Button } from "react-native"import * as Google from "expo-google-app-auth";export default class App extends React.Component { constructor(props) { super(props) this.state = { signedIn: false, name: "", photoUrl: "" } } signIn = async () => { try { const result = await Google.logInAsync({ androidClientId:"1051966217196.apps.googleusercontent.com", iosClientId:"1051966217196.apps.googleusercontent.com", scopes: ["profile", "email"] }) if (result.type === "success") { this.setState({ signedIn: true, name: result.user.name, photoUrl: result.user.photoUrl }) } else { console.log("cancelled") } } catch (e) { console.log("error", e) } } render() { return (<View style={styles.container}> {this.state.signedIn ? (<LoggedInPage name={this.state.name} photoUrl={this.state.photoUrl} /> ) : (<LoginPage signIn={this.signIn} /> )}</View> ) }}const LoginPage = props => { return (<View><Text style={styles.header}>Sign In With Google</Text><Button title="Sign in with Google" onPress={() => props.signIn()} /></View> )}const LoggedInPage = props => { return (<View style={styles.container}><Text style={styles.header}>Welcome:{props.name}</Text><Image style={styles.image} source={{ uri: props.photoUrl }} /></View> )}const styles = StyleSheet.create({ container: { flex: 1, backgroundColor: "#fff", alignItems: "center", justifyContent: "center" }, header: { fontSize: 25 }, image: { marginTop: 15, width: 150, height: 150, borderColor: "rgba(0,0,0,0.2)", borderWidth: 3, borderRadius: 150 }})
On Android it's ok, everything is fine but in IOS I have that mistake :
Google 400 - That's an error - Error : redirect_uri_mismatch
Where is it goes wrong? I'm new to react native so I need detailed explanations.