1.1.0 & 1.2.0 Cors Error

[BurnedChris]

After upgrading from 1.0.0 to 1.1.0 or 1.2.0 it causes our webside now have cors problems.

Before this we did not have any cors problems

graphql.ts
export const handler = createGraphQLHandler({
  loggerConfig: {
    logger,
    options: {
      tracing: true,
      operationName: true,
      requestId: true,
      query: true,
    },
  },
  getCurrentUser,
  directives,
  sdls: schemas,
  services,
  context: setContext,
  cors: {
    origin: [
      'https://dashboard.everfund.io',
    ],
    credentials: true,
  },
  // extraPlugins,
  onException: () => {
    // Disconnect from your database with an unhandled exception.
    db.$disconnect()
  },
})

React Query Provider
const useGraphqlClient = () => {
  const { uri } = useFetchConfig()
  const graphqlClient = new GraphQLClient(uri, {
    // credentials: 'include',
    mode: 'no-cors',
  })
  return graphqlClient
}

This could be a my problem? as our next.js website works and passes cors, its just our redwood dashboard using react-query provider does not. maybe i got the mode wrong or something.

I just found it weird it worked on 1.0.0 but since not.

[thedavidprice]

I think the access-control-allow-origin: * is the key — that should be a specific domain, I believe. Where are you setting that?

My guess is react query related. Are you correctly configured in your App.tsx file? E.g.
https://github.com/redwoodjs/deploy-target-ci/blob/main/serverless-aws/web/src/App.tsx

[BurnedChris]

just checked my production requests.

It looks like in the 1.1.0 and 1.2.0 it automatically sends a access-control-allow-origin: * back to the client without the correct url.

There must be a breaking change in RW.

[thedavidprice]

Could you confirm whether or not you're seeing similar behavior for this site (deployed on Flightcontrol)?
https://d2dub2qmgsm5yj.cloudfront.net

It's still unclear to me which hosting provider you're using.

Also, to confirm, you have a Next client that is working but the Redwood Web client is not, correct?

Lastly, I had the same issue with access-control-allow-origin: * in our Serverless AWS deploy. What was missing was AWS API Gateway config here:
https://github.com/redwoodjs/deploy-target-ci/blob/main/serverless-aws/api/serverless.yml

[BurnedChris]

So we are self hosting with pm2 baremetal. has @cannikin ran into this problem.

Yeah am seeing similar behaviour on that cloudfront website

Just to confirm, updated from 1.0.0 to 1.1.0 or 1.2.0 no other changes and we now get CORS problems. Self hosted on PM2 with nginx.

And this is my browser
https://www.whatismybrowser.com/w/ENZCYT8

i believe in the test i did yes it was working on my next site. that makes it even more confusing!

nginx config

server {
    server_name api.everfund.co.uk;
    server_name api.everfund.io;
    

    location / {
        proxy_pass http://localhost:8911/graphql;
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection 'upgrade';
        proxy_set_header Host $host;
        proxy_cache_bypass $http_upgrade;
        proxy_set_header X-Forwarded-Proto $scheme;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    }

    location /qrcode-gen {
        proxy_pass http://localhost:8911/qrcode-gen;
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection 'upgrade';
        proxy_set_header Host $host;
        proxy_cache_bypass $http_upgrade;
        proxy_set_header X-Forwarded-Proto $scheme;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    }

   location /status {
        proxy_pass http://localhost:8911/status;
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection 'upgrade';
        proxy_set_header Host $host;
        proxy_cache_bypass $http_upgrade;
        proxy_set_header X-Forwarded-Proto $scheme;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    }

     location /graphql {
        proxy_pass http://localhost:8911/graphql;
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection 'upgrade';
        proxy_set_header Host $host;
        proxy_cache_bypass $http_upgrade;
        proxy_set_header X-Forwarded-Proto $scheme;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    }
    

    location /downloadCsv {
        proxy_pass http://localhost:8911/downloadCsv;
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection 'upgrade';
        proxy_set_header Host $host;
        proxy_cache_bypass $http_upgrade;
        proxy_set_header X-Forwarded-Proto $scheme;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        add_header Cache-Control "max-age=2629746, public";
    }


    location /imagekitAuth {
        proxy_pass http://localhost:8911/imagekitAuth;
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection 'upgrade';
        proxy_set_header Host $host;
        proxy_cache_bypass $http_upgrade;
        proxy_set_header X-Forwarded-Proto $scheme;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        add_header Cache-Control "max-age=2629746, public";
    }


    location /webhook {
        proxy_pass http://localhost:8911/webhook;
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection 'upgrade';
        proxy_set_header Host $host;
        proxy_cache_bypass $http_upgrade;
        proxy_set_header X-Forwarded-Proto $scheme;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        add_header Cache-Control "max-age=2629746, public";
    }


    location /file-upload {
        proxy_pass http://localhost:8913/;
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection 'upgrade';
        proxy_set_header Host $host;
        proxy_cache_bypass $http_upgrade;
        proxy_set_header X-Forwarded-Proto $scheme;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        add_header Cache-Control "max-age=2629746, public";
    }


   location /uppy {
        rewrite ^/uppy(/.*)$ $1 break;
       proxy_pass http://localhost:3020;

        # Disable request and response buffering
        proxy_request_buffering  off;
        proxy_buffering          off;
        proxy_http_version       1.1;

        # Add X-Forwarded-* headers
        proxy_set_header X-Forwarded-Host $hostname;
        proxy_set_header X-Forwarded-Proto $scheme;

        proxy_set_header         Upgrade $http_upgrade;
        proxy_set_header         Connection "upgrade";
        client_max_body_size     0;
    }


    listen 443 ssl; # managed by Certbot
    ssl_certificate /etc/letsencrypt/live/api.everfund.io/fullchain.pem; # managed by Certbot
    ssl_certificate_key /etc/letsencrypt/live/api.everfund.io/privkey.pem; # managed by Certbot
    include /etc/letsencrypt/options-ssl-nginx.conf; # managed by Certbot
    ssl_dhparam /etc/letsencrypt/ssl-dhparams.pem; # managed by Certbot


}

server {
    server_name api.everfund.io;
    listen 80;
}server {
    if ($host = api.everfund.co.uk) {
        return 301 https://$host$request_uri;
    } # managed by Certbot


    if ($host = api.everfund.io) {
        return 301 https://$host$request_uri;
    } # managed by Certbot


    server_name api.everfund.co.uk;
    server_name api.everfund.io;
    listen 80;
    return 404; # managed by Certbot
}

[cannikin]

Bah, ignore the original comment I had here, I just realized your screenshot above is from trying the sample Flightcontrol URL!

Can you try changing your origin to be just a string, instead of an array of strings?

cors: {
  origin: 'https://dashboard.everfund.io',
},

[mabadir]

Hi All,
I can confirm this issue has hit other Flightcontrol customers. I am up to help on that, any thoughts of where to look for the issue?

[mabadir]

Can you try changing your origin to be just a string, instead of an array of strings?

cors: {
  origin: 'https://dashboard.everfund.io',
},

Hello @cannikin, in the test Flightcontrol app, we have it as a single value, but still not working:
https://github.com/redwoodjs/deploy-target-ci/blob/5b681dc58e4e2e9f1d2c617e5573295ad9f50833/flightcontrol/api/src/functions/graphql.ts#L22

[dac09]

Hey both! Thanks for reporting this - I suspect this is a change downstream in one of the yoga dependencies. I’ll take a look tomorrow and post some tips on where to look as well if I can’t see an obvious solution.