fetchClient and CORS

I am using the fetchClient to fetch results from a perl script on another domain.

If I don’t do custom headers, I get a CORS error. This is completely reasonable, so I tried to set up custom headers like so:

(based on this link: https://github.com/aurelia/fetch-client/issues/8)

self.httpClient.configure(config => {
          config.withDefaults({
              headers: {
                  'Access-Control-Allow-Origin': '*',
              },
              mode : 'no-cors',
          })
        });

When I do this, I get Unexpected end of input as an error.

I have also tried:

self.httpClient.configure(config => {
              config.withDefaults({
                  headers: {
                      'Access-Control-Allow-Origin': '*',
                      'mode' : 'no-cors',
                  },
                  
              })
          });

and also:

self.httpClient.configure(config => {
              config.withDefaults({
                  headers: {
                      'Access-Control-Allow-Origin': '*',
                  },
              'mode' : 'no-cors',
              })
          });

If I comment out the headers, I get the CORS error, but eventually it goes away.

My questions are:

  1. How do I configure the headers properly?
  2. Why is the CORS error going away without me configuring the headers?

Thanks in advance.

1 Like

Access-Control-Allow-Origin must be set by a server, not client.

3 Likes

Thanks. I figured out how to set the headers in perl, and it seems to be working now.

I did these headers:

print $cgi->header(-type => "application/json",
                     -charset => "utf-8",
                     -access_control_allow_headers =>'X-Requested-With',
                     -access_control_allow_methods => 'GET,POST,OPTIONS',
                     -access_control_allow_credentials => 'true',
                     -access_control_allow_origin => '*');
2 Likes