CORS configuration in Nginx - Practice Problems & Coding Challenges

Challenge - 5 Problems

💻 Command Output

intermediate

What is the effect of this nginx CORS configuration?

Given this nginx snippet, what will be the value of the Access-Control-Allow-Origin header in the response?

Nginx

location /api/ {
    add_header Access-Control-Allow-Origin "https://example.com";
    add_header Access-Control-Allow-Methods "GET, POST, OPTIONS";
    if ($request_method = OPTIONS) {
        add_header Access-Control-Allow-Headers "DNT,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Range";
        add_header Access-Control-Max-Age 1728000;
        add_header Content-Type "text/plain; charset=UTF-8";
        add_header Content-Length 0;
        return 204;
    }
}

A The response will include 'Access-Control-Allow-Origin: https://example.com' only for OPTIONS requests.

B The response will never include 'Access-Control-Allow-Origin' header because it is inside an if block.

C The response will always include 'Access-Control-Allow-Origin: https://example.com' for all requests to /api/.

D The response will include 'Access-Control-Allow-Origin: *' for all requests.

💡 Hint

Remember that add_header outside if applies to all requests unless overridden.

The add_header directive outside the if block applies to all requests matching /api/. The if block only adds headers for OPTIONS requests but does not remove the Access-Control-Allow-Origin header set outside.

❓ Configuration

intermediate

Which nginx config snippet correctly allows CORS from any origin?

Select the nginx configuration that correctly sets CORS headers to allow any origin to access resources.

A add_header "Access-Control-Allow-Origin" "*" always;

B add_header Access-Control-Allow-Origin "*";

C add_header "Access-Control-Allow-Origin" *;

D add_header Access-Control-Allow-Origin *;

💡 Hint

The header name and value must be quoted properly and the 'always' flag ensures headers are added on all response codes.

Option A correctly quotes the header name and value and uses 'always' to ensure the header is added even on error responses. Option A and C are invalid syntax. Option A misses the 'always' flag, so header may not be added on some responses.

❓ Troubleshoot

advanced

Why does this nginx CORS config fail to allow credentials?

This nginx config snippet is intended to allow CORS with credentials, but browsers still block requests. Why?

Nginx

add_header Access-Control-Allow-Origin "*";
add_header Access-Control-Allow-Credentials "true";

A Because Access-Control-Allow-Origin cannot be '*' when Access-Control-Allow-Credentials is true.

B Because add_header directives must be inside a location block to work.

C Because Access-Control-Allow-Credentials must be set to 'yes' not 'true'.

D Because the headers must be added only for OPTIONS requests.

💡 Hint

Check the CORS specification about credentials and allowed origins.

The CORS specification forbids using '*' as Access-Control-Allow-Origin when Access-Control-Allow-Credentials is true. The origin must be explicit.

🔀 Workflow

advanced

What is the correct order to configure CORS in nginx for a REST API?

Arrange these steps in the correct order to properly configure CORS in nginx for a REST API.

A 2,1,3,4

B 1,2,3,4

C 1,3,4,2

D 3,4,1,2

💡 Hint

Think about what headers must be sent always and what response is needed for preflight.

First set the origin header to allow the client. Then handle OPTIONS preflight with 204. The methods and headers allowed must be declared in headers sent for preflight and actual requests.

✅ Best Practice

expert

Which nginx CORS configuration is best practice for security and flexibility?

Choose the nginx configuration snippet that follows best practices for CORS by allowing only specific origins dynamically and supporting credentials.

A

add_header Access-Control-Allow-Origin "https://example.com" always;
add_header Access-Control-Allow-Credentials "false" always;

B

add_header Access-Control-Allow-Origin "*" always;
add_header Access-Control-Allow-Credentials "true" always;

C

add_header Access-Control-Allow-Origin "$http_origin" always;
add_header Access-Control-Allow-Credentials "true" always;

D

if ($http_origin ~* (https?://(www\.)?(example\.com|example\.org))) {
    add_header Access-Control-Allow-Origin "$http_origin" always;
    add_header Access-Control-Allow-Credentials "true" always;
}

💡 Hint

Dynamic origin matching with regex and conditional headers is more secure than wildcard.

Option D uses a regex to allow only trusted origins dynamically and sets credentials properly. Option D uses wildcard origin with credentials which is disallowed. Option D allows any origin dynamically without restriction, which is insecure. Option D disables credentials and restricts to one origin, less flexible.