CODEWITHSUNDEEP
javascriptphpajax
Oscar
Oscar

Reputation: 855

Can't send CORS query: responds with "No 'Access-Control-Allow-Origin' header"

I have a plain form that includes only one input of type=file that I need to parse.

And I have a php handler that is located on a different server. There I have these headers:

header("Access-Control-Allow-Origin: *");
header("Content-Type: application/x-www-form-urlencoded;charset=UTF-8;");

And here is my ajax query:

    new Promise((resolve, reject) => {
        let xhr = new XMLHttpRequest();
        xhr.open('POST', 'http://localhost/ajax.php', true);
        xhr.setRequestHeader("Content-type", "multipart/form-data");

        let post = 'ajaxquery=psScript&config=' + JSON.stringify({
            path_to_include: 'include.php'
        });

        xhr.send(post);

        xhr.addEventListener('load', () => {
            resolve(JSON.parse(xhr.response));
        })

        xhr.addEventListener('error', () => {
            reject();
        });
    }).then((response) => {
        console.dir(response);
    });

As stated in the title, it responds with No 'Access-Control-Allow-Origin' header is present on the requested resource.. Though if I change this:

xhr.setRequestHeader("Content-type", "multipart/form-data");

To this:

xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");

Data would be send. But this way, I suppose, I can't send file to the server.

It seems like a strange behavior to me. How do I solve that and why is this happening?

Upvotes: 1

Views: 929

Answers (2)

Oscar
Oscar

Reputation: 855

Added this:

Header set Access-Control-Allow-Origin "*"

To my .htaccess file. That seemed to solve the issue.

Upvotes: 0

Shubham Khatri
Shubham Khatri

Reputation: 281990

In your php server you are setting the header to be header("Content-Type: application/x-www-form-urlencoded;charset=UTF-8;"); so if you try to set the content type to be multipart/form-data it won't allow.

You need to set this header value in the server 

header("Access-Control-Allow-Origin: *");
header("Content-Type: multipart/form-data;charset=UTF-8;");

Upvotes: 3

Related Questions