Error: Content-Type is not allowed by Access-Control-Allow-Headers

AjaxCors

Ajax Problem Overview

I am getting this error in Chrome when trying to send an ajax request:

Content-Type is not allowed by Access-Control-Allow-Headers

Everything works fine in Firefox.

Can anyone help me to resolve this issue?

Ajax Solutions

Solution 1 - Ajax

I solved the problem adding to Apache Web Server virtual host configuration the following settings

Header set Access-Control-Allow-Origin "*"
Header set Access-Control-Allow-Headers "Origin, X-Requested-With, Content-Type, Accept"

Solution 2 - Ajax

Solution for PHP:

header('Access-Control-Allow-Origin: *');
header('Access-Control-Allow-Methods: POST,GET,OPTIONS');
header('Access-Control-Allow-Headers: Origin, X-Requested-With, Content-Type, Accept');

(Need to send that before any other content)

Solution 3 - Ajax

Set up CORS (Cross-site HTTP Requests) in node. For me it looks like the following:

app.use('/api', function(req, res, next) {
  res.header('Access-Control-Allow-Origin', '*');
  res.header('Access-Control-Allow-Headers', 'X-Requested-With, Content-Type');
  next();
});

Solution 4 - Ajax

for nginx

location / {
    proxy_pass http://localhost:59100;
    proxy_http_version 1.1;
    # proxy_set_header Upgrade $http_upgrade;
    # proxy_set_header Connection 'upgrade';
    proxy_set_header Host $host;

    # Simple requests
    if ($request_method ~* "(GET|POST)") {
      add_header "Access-Control-Allow-Origin"  *;
    }

    # Preflighted requests
    if ($request_method = OPTIONS ) {
      add_header "Access-Control-Allow-Origin"  *;
      add_header "Access-Control-Allow-Methods" "GET, POST, OPTIONS, HEAD";
      add_header "Access-Control-Allow-Headers" "Authorization, Origin, X-Requested-With, Content-Type, Accept";
    }

    # proxy_cache_bypass $http_upgrade;
    # add_header Access-Control-Allow-Origin *;
    # add_header Access-Control-Allow-Headers Content-Type;
}

see https://distinctplace.com/2017/04/17/nginx-access-control-allow-origin-cors/

Solution 5 - Ajax

I had the same problem and I solved it by adding the following header: Access-Control-Allow-Headers: content-type

Solution 6 - Ajax

To me with PHP, localy works even if i set only this header setting:

header('Access-Control-Allow-Headers: Origin, X-Requested-With, Content-Type, Accept');

Categories
Recommended Ajax Solutions
Recommended Cors Solutions

Previous Solution:

In Mustache, How to get the index of the current Section

TemplatesMustache

Next Solution:

PHP errors NOT being displayed in the browser [Ubuntu 10.10]

PhpApacheApache2LampUbuntu 10.10

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionVinay VermaView Question on Stackoverflow
Solution 1 - AjaxGiulio RoggeroView Answer on Stackoverflow
Solution 2 - AjaxBlaMView Answer on Stackoverflow
Solution 3 - AjaxGentryRiggenView Answer on Stackoverflow
Solution 4 - AjaxdcsanView Answer on Stackoverflow
Solution 5 - AjaxVan CodingView Answer on Stackoverflow
Solution 6 - AjaxPauls BebrisView Answer on Stackoverflow