Description
Bug Report
Plugin(s)
@capacitor/browser: 7.0.1
Capacitor Version
💊 Capacitor Doctor 💊
Latest Dependencies:
@capacitor/cli: 7.2.0
@capacitor/core: 7.2.0
@capacitor/android: 7.2.0
@capacitor/ios: 7.2.0
Installed Dependencies:
@capacitor/android: not installed
@capacitor/cli: 7.2.0
@capacitor/ios: 7.2.0
@capacitor/core: 7.2.0
[success] iOS looking great! 👌
Platform(s)
iOS
Current Behavior
I'm implementing an authentication flow using Auth0. At the click of a login button, the Browser plugin is used to open the Auth0 authorize
endpoint, which then redirects to a custom URL scheme which is assigned to my app, where the authentication details are extracted.
The first time this happens for my user, the following flow happens:
- The
authorize
endpoint is opened with the Browser plugin. - This returns a 302 to redirect to the Auth0
login
endpoint. - The user enters their credentials and submits the login form, which redirects to the
authorize/resume
endpoint. - This finally returns a 302 redirect to my custom scheme, which triggers the listener in my app.
This all works fine. But if I open the authorize
endpoint for a user that already has an auth session then I get this flow:
- The
authorize
endpoint is opened with the Browser plugin. - This returns a 302 redirect to my custom scheme.
- The Browser does not seem to deal with this - sometimes it just hangs, sometimes it hangs for a while and then throws a -1001 timeout error, sometimes it throws a -1005 no network error.
Expected Behavior
I would expect the 302 redirect to a custom URL scheme to be handled correctly whether it happens at the end of a series of interactions in the Browser, or whether it happens immediately in response to the URL that the Browser was opened with.
Code Reproduction
The following code can be used as the basis of a reproduction - it requires an Auth0 account however:
import { Browser } from '@capacitor/browser';
const auth0Config = {
domain: 'login.mydomain.com',
clientId: 'xxxxxxxxxx',
audience: 'https://www.mydomain.com',
redirectUri: 'customscheme://login-callback',
scope: 'openid profile email'
};
export async function login() {
try {
const authUrl = new URL(`https://${auth0Config.domain}/authorize`);
authUrl.searchParams.append('client_id', auth0Config.clientId);
authUrl.searchParams.append('response_type', 'token id_token');
authUrl.searchParams.append('scope', auth0Config.scope);
authUrl.searchParams.append('redirect_uri', auth0Config.redirectUri);
authUrl.searchParams.append('audience', auth0Config.audience);
authUrl.searchParams.append('nonce', generateNonce());
console.log("Opening browser with URL:", authUrl.toString());
await Browser.open({
url: authUrl.toString()
});
console.log("Browser opened successfully");
} catch (error) {
console.error("Error in login process:", error);
}
}
function generateNonce() {
return Math.random().toString(36).substring(2, 15) +
Math.random().toString(36).substring(2, 15);
}
Other Technical Details
XCode Version 16.3 (16E140)