Cross-Origin Resource Sharing (CORS)

Abhishek Ghosh

By Abhishek Ghosh September 8, 2014 7:02 pm Updated on September 8, 2014

Cross-Origin Resource Sharing (CORS)

What is Cross-Origin Resource Sharing (CORS)? Why we need to know about (CORS) in the context of HTTPS? Here is in details discussion. You can read which SSL certificate you need if you yet not have installed SSL certificate. It is quite common with SSL to get errors for this Cross-Origin Resource Sharing (CORS) part. Minimum should be known.

Table of Contents

1 Introduction
2 Basics of Cross-Origin Resource Sharing
3 Implementation of CORS
4 Relationship With JSONP

Basics of Cross-Origin Resource Sharing (CORS)

Cross-origin resource sharing (CORS) is a specification of a technology browsers that defines means for server to allow its resources to be accessed by a web page from a different domain. This type of access would otherwise be denied the same origin policy. CORS defines a means by which a web browser and web server may interact to determine whether or not the cross-origin requests will be allowed. It is an agreement that allows great flexibility, but it is safer to allow all requests of this type. Support for Cross-orign was originally proposed by Matt Oshry, Brad Porter and Michael Bodell from Tellme Networks in March 2004 for inclusion in the VoiceXML 2.1 to allow requests for cross-orign data securely VoiceXML browsers. The mechanism was considered to be general in nature and not specific to VoiceXML and was later implemented via a separate Implementation Note. The WebApps Working Group of the W3C with participation of the major browser vendors have begun to formalize Note on a W3C Working Draft in the way of a formal status of a W3C Recommendation.

---

Cross-Origin Resource Sharing (CORS)

Implementation of Cross-Origin Resource Sharing (CORS)

Implement the CORS on a server is as simple as sending additional HTTP headers, for example:

Access-Control-Allow-Origin: *
Access-Control-Allow-Origin: https://example.com:443 http://cdn.example.com

1 2	Access-Control-Allow-Origin: * Access-Control-Allow-Origin: https://example.com:443 http://cdn.example.com

The CORS is supported by all browsers based on the engines – Gecko 1.9.1 (Firefox 3.5, SeaMonkey 2.0) and above, WebKit (Unsure about the initial version, Safari 4 and higher, Google Chrome 3 and higher, possibly earlier), MSHTML / Trident 4.0 (Internet Explorer 8) provides partial support via XDomainRequest object.

Usage of CORS in Nginx :

 # multiple contributors
 # see http://enable-cors.org/index.html
location / {

    if ($http_origin ~* (https?://[^/]*\.rackcdn\.com(:[0-9]+)?)) {
        set $cors "true";
    }
    if ($request_method = 'OPTIONS') {
        set $cors "${cors}options";  
    }

    if ($request_method = 'GET') {
        set $cors "${cors}get";  
    }
    if ($request_method = 'POST') {
        set $cors "${cors}post";
    }

    if ($cors = "trueget") {
        add_header 'Access-Control-Allow-Origin' "$http_origin";
        add_header 'Access-Control-Allow-Credentials' 'true';
        # add_header 'Access-Control-Expose-Headers' 'myresponseheader';
    }

    if ($cors = "truepost") {
        add_header 'Access-Control-Allow-Origin' "$http_origin";
        add_header 'Access-Control-Allow-Credentials' 'true';
    }
    if ($cors = "trueoptions") {
        add_header 'Access-Control-Allow-Origin' "$http_origin";
        add_header 'Access-Control-Allow-Credentials' 'true';
        add_header 'Access-Control-Max-Age' 1728000;
        add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS';
        add_header 'Access-Control-Allow-Headers' 'Authorization,Content-Type,Accept,Origin,User-Agent,DNT,Cache-Control,X-Mx-ReqToken,Keep-Alive,X-Requested-With,If-Modified-Since';
        add_header 'Content-Length' 0;
        add_header 'Content-Type' 'text/plain charset=UTF-8';
        return 204;
    }
    # other stuffs
}
 # copyleft under gnu gpl 3.0

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

39

40

41

# multiple contributors

# see http://enable-cors.org/index.html

location / {

if ($http_origin ~* (https?://[^/]*\.rackcdn\.com(:[0-9]+)?)) {

set $cors "true";

}

if ($request_method = 'OPTIONS') {

set $cors "${cors}options";

}

if ($request_method = 'GET') {

set $cors "${cors}get";

}

if ($request_method = 'POST') {

set $cors "${cors}post";

}

if ($cors = "trueget") {

add_header 'Access-Control-Allow-Origin' "$http_origin";

add_header 'Access-Control-Allow-Credentials' 'true';

# add_header 'Access-Control-Expose-Headers' 'myresponseheader';

}

if ($cors = "truepost") {

add_header 'Access-Control-Allow-Origin' "$http_origin";

add_header 'Access-Control-Allow-Credentials' 'true';

}

if ($cors = "trueoptions") {

add_header 'Access-Control-Allow-Origin' "$http_origin";

add_header 'Access-Control-Allow-Credentials' 'true';

add_header 'Access-Control-Max-Age' 1728000;

add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS';

add_header 'Access-Control-Allow-Headers' 'Authorization,Content-Type,Accept,Origin,User-Agent,DNT,Cache-Control,X-Mx-ReqToken,Keep-Alive,X-Requested-With,If-Modified-Since';

add_header 'Content-Length' 0;

add_header 'Content-Type' 'text/plain charset=UTF-8';

return 204;

}

# other stuffs

}

# copyleft under gnu gpl 3.0

Relationship of Cross-Origin Resource Sharing (CORS) and JSONP

CORS can be used with a modern alternative to standard JSONP. While JSONP requests only supports using the GET method, CORS also supports other types of HTTP requests. With CORS it is possible to use common XMLHttpRequest. On the other hand, JSONP works with legacy browsers without CORS support. CORS is supported by most modern browsers.

Go To Top of This Article

Tagged With cors mshtml , Cross-Origin Resource Sharing (CORS) on Kayako , is CORS on https , paperuri:(da2c02f5753b792a35d4c36ded6e629d) , what is CORS (Cross-Origin Resource Sharing)

Cross-Origin Resource Sharing (CORS)

Basics of Cross-Origin Resource Sharing (CORS)

Implementation of Cross-Origin Resource Sharing (CORS)

Relationship of Cross-Origin Resource Sharing (CORS) and JSONP

About Abhishek Ghosh

Here’s what we’ve got for you which might like :

Take The Conversation Further ...

Popular Articles

Basics of Cross-Origin Resource Sharing (CORS)

Implementation of Cross-Origin Resource Sharing (CORS)

Relationship of Cross-Origin Resource Sharing (CORS) and JSONP

About Abhishek Ghosh

Here’s what we’ve got for you which might like :

Articles Related to Cross-Origin Resource Sharing (CORS)

Take The Conversation Further ...