Getting CORS error on my R-Shiny app configured with shinyproxy and auth0

[wahiduzzamankhan007]

Hi there.
I am hosting an R-Shiny app with shinyproxy and using auth0 for authentication. But I am getting this CORS error:

Access to manifest at 'https://login.mysocialpulse.com/authorize?response_type=code&client_id=OYhoKqOAoChIk4WiFrTRmlY6oG7A3M3f&scope=openid%20email&state=PXVlaYgaShbDf-iOMgYxYUkr8cScffXuL-ne7tXv9Oc%3D&redirect_uri=https://mysocialpulse.com/login/oauth2/code/shinyproxy&nonce=pAohZkehH4tm8Jvismze9tQQNvU_VdrIirvC3tSxhYw' (redirected from 'https://mysocialpulse.com/app_direct/main/img/icon/manifest.json') from origin 'https://mysocialpulse.com' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

In my auth0 application settings I have,
Allowed callback URLs: https://mysocialpulse.com/login/oauth2/code/shinyproxy, https://www.mysocialpulse.com/login/oauth2/code/shinyproxy
Allowed logout URLs: https://mysocialpulse.com
Allowed Web Origins: https://.mysocialpulse.com
Allowed Origins (CORS): https://.mysocialpulse.com

I also have custom domain enabled and using Universal login.

Here is my Nginx configuration:

server {
     listen 80;
     listen [::]:80;
     server_name *.mysocialpulse.com;
     return 301 https://$host$request_uri;
}

server {
  listen 443 ssl http2;
  listen [::]:443 ssl http2;
  server_name mysocialpulse.com www.mysocialpulse.com;
  
  ssl_certificate /etc/letsencrypt/live/mysocialpulse.com/fullchain.pem;
  ssl_certificate_key /etc/letsencrypt/live/mysocialpulse.com/privkey.pem;
  ssl_trusted_certificate /etc/letsencrypt/live/mysocialpulse.com/chain.pem;
  ssl_protocols TLSv1 TLSv1.1 TLSv1.2 TLSv1.3;
  ssl_ciphers 'TLS13+AESGCM+AES128:ECDHE-ECDSA-CHACHA20-POLY1305:ECDHE-RSA-CHACHA20-POLY1305:ECDHE-ECDSA-AES128-GCM-SHA256:ECDHE-RSA-AES128-GCM-SHA256:ECDHE-ECDSA-AES256-GCM-SHA384:ECDHE-RSA-AES256-GCM-SHA384:DHE-RSA-AES128-GCM-SHA256:DHE-RSA-AES256-GCM-SHA384:ECDHE-ECDSA-AES128-SHA256:ECDHE-RSA-AES128-SHA256:ECDHE-ECDSA-AES128-SHA:ECDHE-RSA-AES256-SHA384:ECDHE-RSA-AES128-SHA:ECDHE-ECDSA-AES256-SHA384:ECDHE-ECDSA-AES256-SHA:ECDHE-RSA-AES256-SHA:DHE-RSA-AES128-SHA256:DHE-RSA-AES128-SHA:DHE-RSA-AES256-SHA256:DHE-RSA-AES256-SHA:ECDHE-ECDSA-DES-CBC3-SHA:ECDHE-RSA-DES-CBC3-SHA:EDH-RSA-DES-CBC3-SHA:AES128-GCM-SHA256:AES256-GCM-SHA384:AES128-SHA256:AES256-SHA256:AES128-SHA:AES256-SHA:DES-CBC3-SHA:!DSS';
  ssl_prefer_server_ciphers on;
  ssl_session_cache shared:SSL:50m;
  ssl_session_timeout 1d;
  ssl_session_tickets off;
  ssl_ecdh_curve X25519:sect571r1:secp521r1:secp384r1;

  location / {
    proxy_pass                            http://127.0.0.1:8081/;
    proxy_http_version                    1.1;
    proxy_set_header Upgrade              $http_upgrade;
    proxy_set_header Connection           "upgrade";
    proxy_read_timeout                    600s;
    proxy_redirect                        off;
    proxy_set_header Host                 $http_host;
    proxy_set_header X-Real-IP            $remote_addr;
    proxy_set_header X-Forwarded-For      $proxy_add_x_forwarded_for;
    proxy_set_header X-Forwarded-Proto    $scheme;
  }

}

[luuuis]

Hi @wahiduzzamankhan007,

The reason that you are getting this error is that CORS is not supported at the OAuth 2.0 authorization endpoint. This API is not designed to be called programmatically (for example using xhr or fetch request from Javascript) but only using browser navigation, normally through a redirect.

The general flow is as follows:

1. Your app performs a browser redirect to https://login.mysocialpulse.com/authorize.
2. Auth0 will create an authorization code and redirect to https://mysocialpulse.com/login/oauth2/code/shinyproxy.
3. From that page you may then perform a CORS request to https://login.mysocialpulse.com/oauth/token to perform the code exchange.

Hope this helps.

[konrad.sopala]

Thanks for helping on this one @luuuis !