CODEWITHSUNDEEP
javascriptjquerycors
candy_man
candy_man

Reputation: 619

CORS issue with xhr resource download request

xhr.open('GET', 'url/url_filePath=mydownload.zip', true);
    xhr.responseType = 'blob';
    let that = this;
    
    xhr.onload = function(e) {
      if (this.status == 200) {
        let data = this.response;
        const blob = new Blob([data], {type: 'application/octet-stream'});
        const file = new File([blob], 'mydownload.zip', {type: 'application/zip'});
        that.han
        that.setState((prevState, props) => {
          return {
            install : false
          };
        });
      }
    };
    xhr.send();

I have the above lines of code to download and upload a zip file. I get an 'Access-Control-Allow-Origin' header not present error each time I try an make the request to download. I countered this with a chrome extension that handles this but I need a scaleable solution that will not require the chrome extension. Any pointers?

Upvotes: 0

Views: 4057

Answers (1)

Carey
Carey

Reputation: 670

CORS headers sent by the server basically state which origins are allowed to request resources from that particular server. From MDN:

For security reasons, browsers restrict cross-origin HTTP requests initiated from within scripts. For example, XMLHttpRequest and Fetch follow the same-origin policy. So, a web application using XMLHttpRequest or Fetch could only make HTTP requests to its own domain.

To allow your web application to fetch resources from that origin, the server must send a CORS header.

The format should follow: Access-Control-Allow-Origin: https://example.com.

Upvotes: 1

Related Questions