Domain has been blocked by CORS policy: No 'Access-Control-Allow-Origin'

Help
1

Hi !

I’ve been trying to set up a basic authentication integration to my angular SPA with PHP backend. I’ve mostly been following this as well as Auth0 documentation.

At this point, the backend is basically the code provided by the official doc :

    public function authenticate($get) {
         if (! empty($get['error']) || ! empty($get['error_description'])) {
             printf( '<h1>Error</h1><p>%s</p>', htmlspecialchars( $get['error_description'] ) );
         die();
    }

    $auth0 = new Auth0([
        'domain' => 'auth0domain',
        'client_id' => 'clientID',
        'client_secret' => 'XXX',
        'redirect_uri' => 'https://st-frontend.auth.test:4200/',
        'scope' => 'openid email profile',
    ]);
    
    try {
        $userinfo = $auth0->getUser();
    } catch (Exception $e) {
        die( $e->getMessage() );
    }
    
    if (empty($userinfo)) {
        $auth0->login();
    }
    
    echo 'ok';
}

On the frontend side, I’m calling this endpoint and setting up the authClientConfig

this.authClientConfig.set({
    clientId: AppConfigService.settings.clientId,
    domain: AppConfigService.settings.domain
 });

Of course, I’ve read many posts on this subject already and tried to apply all solutions. Both frontend and backend on HTTPS with a valid certificate, no localhost, URLs added to the Application URIs settings.
Still, I keep getting this error on CORS policy (both Chrome and Firefox) :

Access to XMLHttpRequest at ‘auth0domain/authorize?scope=openid%20email%20profile&response_mode=query&response_type=code&redirect_uri=https%3A%2F%2Fst-frontend.auth.test%3A4200%2F&state=da30ce31ccc45bd7e1e18a9ec861c1c1&nonce=c1dfae0ab77213c18b4dd064620d35b7&client_id=clientID’ (redirected from ‘https://st-backend.dev/api/v1/auth’) from origin ‘https://st-frontend.auth.test:4200’ has been blocked by CORS policy: No ‘Access-Control-Allow-Origin’ header is present on the requested resource.

Any ideas ?

2

Your snippet indicates that you are using XMLHttpRequest. Calls to /authorize can never be made with XMLHttpRequest. They should only be made via a redirect or other top-level browser navigation and this is why CORS is not supported at that API.

Please check this similar question where I explained this in a bit more detail Received CORS issue trying to reproduce quickstart demo in Rails - #4 by luuuis

Hope this helps.

1 Like
3

That was the issue indeed. Thanks a lot.

1 Like
4

Perfect! Thanks for helping on this one @luuuis !