Helped me through, despite not being the same problem the use the URL quote helped me solve this by changing a bit how I thought about it!
The final result became a little too big to paste here, but the handling ended up being relatively straightforward:
useEffect(() => { if (result?.type === "success") { const { token, iv } = getParamsFromUrl(result.url) const session = decrypt(token, key, iv) console.log({ session }) } }, [result])
I was able to fix the problem.
I simply needed to provide a deep link from the Expo browser to the mobile app. The result would return success once I set up the redirect URL to the deep link provided by the Expo browser.
So
const result = await Browser.openAuthSessionAsync(
`${frontEndUrl}/auth/google?mobile=true`,
`${frontEndUrl}`);
Simply became
const result = await Browser.openAuthSessionAsync(
`${frontEndUrl}/auth/google?mobile=true`,
`exp://192.168.2.100:8081`);
And then on my backend Authentication handler, I had to redirect to exp://192.168.2.100:8081 once completed.
https://docs.expo.dev/guides/deep-linking/
You can use WebBrowser.dismissAuthSession() to programmatically close the web browser.
More documentation here.
For the no result part: I had the same issue and I switched to the WebBrowser.openBrowserAsync and it fixed the issue for me.
Update: found the issue. It was caused by the discovery failing silently. The example code is not well engineered here. There should be a check (even in the example) that detects errors when doing the discovery part.
If you are encountering this, make sure the actual endpoint URL delivered to the auth mechanism is actually set from the discovery.
In My case it was like missing scheme. After adding it worked in expo go
{
"expo": {
"scheme": "your-app-slug"
}
}
I am having issue with WebBrowser.openAuthSessionAsync not opening on Android. We are using the webBrowser for user to login or create an account on the WebBrowser, but currently nothing open when I press on handlePressLoginAccount:
const disabledDeepLinks = [
'https://www.mydomain.com/app-login',
'https://www.mydomain.com/app-signup'
];
const handlePressLoginAccount = async () => {
const redirectUri = AuthSession.makeRedirectUri({ scheme: 'mtlblog' });
console.log('Redirect URI:', redirectUri);
const loginAuthUrl = `https://www.mydomain.com/app-login?redirect_uri=${encodeURIComponent(redirectUri)}`;
const baseLoginUrl = loginAuthUrl.split('?')[0];
try {
let result;
if (Platform.OS === 'android' && disabledDeepLinks.includes(baseLoginUrl)) {
Alert.alert('android open webbrowser ' +
disabledDeepLinks.includes(baseLoginUrl));
result = await WebBrowser.openAuthSessionAsync(loginAuthUrl, redirectUri);
} else {
result = await WebBrowser.openAuthSessionAsync(loginAuthUrl, redirectUri);
}
console.log('Browser opened successfully', JSON.stringify(result));
if (result.type === 'success' || result.url) {
const { token, userId } = extractParams(result.url);
if (token && userId) {
await SecureStore.setItemAsync('token', token);
await SecureStore.setItemAsync('userId', userId);
setAuthenticated(true);
setSkippedLoginUser(false);
} else {
console.log('Login Failed', 'No authentication data found.');
}
} else {
console.log('Login Failed', 'Authentication was not completed.');
}
} catch (error) {
console.log('Error', 'Failed to open web browser.');
console.error('Failed to open web browser:', error);
}
};We are not sure if this issue is due to how we configure the deep link for android:
"intentFilters": [
{
"action": "VIEW",
"autoVerify": true,
"data": [
{
"scheme": "https",
"host": "www.mydomain.com",
"pathPrefix": ""
}
],
"category": [
"DEFAULT",
"BROWSABLE"
]
}
]
» npm install expo-web-browser
hi! Using the expo-web-browser package, I get this pop up when openAuthSessionAsync is called. Is there a way to prevent this? I understand why it's there, but terrible UX 🤣
popup