请求头字段授权是不允许的

Question

I have an Laravel based API on my Server. And I try to access this api from an AngularJS Frontend. Unfortunately this error shows up.

Where do I have to add the configuration to allow the Authorization Header? I tried to find a solution but couldn't manage to solve it.

I tried to insert it in the httpd.conf and in the .htaccess of the Angular frontend but unfortunately it didn't work:

Request header field Authorization is not allowed by Access-Control-Allow-Headers in preflight response.

Answer 1

Quick Answer

If your server is using Apache, add the following snippet to your api's respective .htaccess file:

<IfModule mod_headers.c>
          Header set Access-Control-Allow-Headers "Authorization"
</IfModule>

More details

in the above snippet, we are asking Apache to allow Authorization header:

Header set Access-Control-Allow-Headers "Authorization"

you can add multiple headers in one line, like this, but keep in mind that it's advised to only allow the headers required by your app .

Header set Access-Control-Allow-Headers "Authorization, X-Requested-With"

Side Note

In a related note, people often need to allow cross-origin request (also known as Cross-Origin Resource Sharing or CORS). The following snippet allows cross requests from https://example.com origin:

Header set Access-Control-Allow-Origin "https://example.com"

or you might use "*" to allow requests from all origins: Not Recommended

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

Wrap up

<IfModule mod_headers.c>
    # To allow headers
    Header set Access-Control-Allow-Headers "Authorization"

    # to allow cross origin request from https://example.com
    Header set Access-Control-Allow-Origin "https://example.com"
</IfModule>