
I am trying to implement oauth2 with Google, but it keeps giving this weird 404 error.

// index.tsx
// ...
<Button
className="bg-white flex flex-row gap-2"
variant="outline"
size="lg"
onTouchEnd={() => {
auth.signIn.google();
}}
>
<AntDesign name="google" size={24} color="black" />
<Label className="text-black">
Sign in with Google
</Label>
</Button>
// ...

// AuthContext.tsx
import { useContext, createContext, useState, ReactNode } from "react";
import { makeRedirectUri } from "expo-auth-session";
import * as WebBrowser from "expo-web-browser";
import { account } from "@/lib/appwrite";
import { OAuthProvider, Models } from "react-native-appwrite";
import { Text, SafeAreaView } from "react-native";
import { AuthContextType } from "~/types/AuthContextType";
const AuthContext = createContext<AuthContextType>({
session: null,
user: null,
signIn: {
google: () => {},
},
signOut: () => {},
});
const AuthProvider = ({ children }: { children: ReactNode }) => {
const [loading, setLoading] = useState(false);
const [session, setSession] = useState<Models.Session | null>(null);
const [user, setUser] = useState<Models.Preferences | null>(null);
const signIn = {
google: async () => {
// Create a deep link that works across Expo environments
// Ensure localhost is used for the hostname to validation error for success/failure URLs
const deepLink = new URL(
makeRedirectUri({ preferLocalhost: true })
);
if (!deepLink.hostname) {
deepLink.hostname = "localhost";
}
const scheme = `${deepLink.protocol}//`; // e.g. 'exp://' or 'playground://'

// Explicitly URL-encode the redirect URLs
const successRedirect = encodeURIComponent(deepLink.toString());
const failureRedirect = encodeURIComponent(deepLink.toString() + "/fail");
// Start OAuth flow
const loginUrl = await account.createOAuth2Session(
OAuthProvider.Google,
successRedirect, // Use the encoded URL
failureRedirect // Use the encoded URL
);
console.log("Scheme: ", scheme);
console.log("Deep Link: ", deepLink);
console.log("Success Redirect: ", successRedirect);
console.log("Failure Redirect: ", failureRedirect);
console.log("Login URL: ", loginUrl);
// Open loginUrl and listen for the scheme redirect
const result = await WebBrowser.openAuthSessionAsync(
`${loginUrl}`,
scheme
);
console.log("Result: ", result);
// Extract credentials from OAuth redirect URL
if('url' in result) {
const url = new URL(result.url);
const secret = url.searchParams.get("secret");
const userId = url.searchParams.get("userId");
if(secret && userId) {
let session = await account.createSession(userId, secret);
setSession(session);
let user = await account.get();
setUser(user);
}
console.log(result, url, secret, userId, session);
} else {
throw new Error("OAuth login failed.");
}
},
};
const signOut = async (): Promise<boolean> => {
if(session) {
await account.deleteSession(session.$id);
setSession(null);
} else {
setSession(null);
}
return true;
};

const contextData: AuthContextType = { session, user, signIn, signOut };
return (
<AuthContext.Provider value={contextData}>
{loading ? (
<SafeAreaView>
<Text>Loading...</Text>
</SafeAreaView>
) : (
children
)}
</AuthContext.Provider>
);
};
const useAuth = () => {
return useContext(AuthContext);
};
export { useAuth, AuthContext, AuthProvider };

heres the console logs

I've tried account#createOAuth2Token and that doesnt change anything

Weird. What URL are you ending up at?

OAuth2 with React Native is not fully supported. The GitHub comment explains the current state: https://github.com/appwrite/sdk-for-react-native/issues/34#issuecomment-2654940715

but since oauth2 isnt support ig that doesnt matter - do you know if magic urls are supported either? im guessing the deeplinking also applies to that

Correct, deep linking is the problem so anything related to that will be an issue

Unless you use universal links
Recommended threads
- Bypass Error When Creating Account With ...
Suppose user first uses email/pass for log in using xyz@gmail.com, few month later on decides to use google oauth2 with same xyz@gmail.com (or in reverse orde...
- No mails from Appwrite
Hello, Since severals days, i have a problem : i d'ont received any mails from Appwrite. I'm using the auth by mail and i don't any code so any mails from App...
- dart function very slow
sometimes waiting too long, about 3mins to 5mins, sometimes very fast, not build time, just execute, anyway to speed up?
