CORS stands for Cross-Origin Resource Sharing, it’s a mechanism that allow browser to access the content of other websites on their website. It adds security as it do not allow to access the content without the consent of author.

Above image depicts that browser runs a website example.com and requested for content from api.example.com which is a different server but the request got blocked because of CORS Policy due to which the browser will show below mentioned error in their console.

How will the browser identify that the domains are different?

So, here’s the answer to your question, when the domain have,

• Different name (Like https://example.com and https://demo.com)
• Different sub domain (Like https://one.example.com and https://two.example.com)
• Different port (Like https://example.com:8080 and https://example.com:8081)
• Different protocol (Like https://example.com and http://example.com)

To see content of different domain, we need to follow these points.

1. Either we need to disable security issue from browser so that it doesn’t check for CORS security
2. Or from server side we need to add some special headers values in HTTP requests and responses so that browser can understand that other domain is giving full permission to show his content on different domain

Browser blocks content by CORS Policy and it can be solved by server side by setting special headers.

Let’s explore this point in more detail.

Headers for CORS

The following are the new HTTP headers added by the CORS standard:

• Access-Control-Allow-Origin
• Access-Control-Allow-Credentials
• Access-Control-Allow-Headers
• Access-Control-Allow-Methods

There are lot more CORS’s headers, checkout this link for more headers CORS Headers.

Before going to these header value let’s get familiar with the term preflight request.

Preflight Request

It’s a HTTP request of OPTIONS method which is sent by browser before making actual request to determine if the actual request is safe to send or not.

This request will return some headers that browser will understand by itself and decide whether to make actual request or not.

Above image shows that browser send preflight request and get the response from the server and then browser reads response’s header and check whether server can accept POST request or not, if yes then browser will send POST request else shows request blocked by CORS policy.

Implement CORS

In Golang, we need to add CORS headers in OPTIONS method of HTTP request.

We need to create a function which will add all CORS headers

func setupCorsResponse(w *http.ResponseWriter, req *http.Request) {
   (*w).Header().Set("Access-Control-Allow-Origin", "*")
   (*w).Header().Set("Access-Control-Allow-Methods", "POST, GET, OPTIONS, PUT, DELETE")
   (*w).Header().Set("Access-Control-Allow-Headers", "Accept, Content-Type, Content-Length, Authorization")
}

and then create HTTP handler

// Register routing for creating customer
route.Handle("/"+APIVersion+"/customers", createUser()).
   Methods(http.MethodPost, http.MethodOptions).
   Name("Create customer")

and call function to add CORS headers

func createUser(w http.ResponseWriter, req *http.Request) {
   setupCorsResponse(&w, req)
   if (*req).Method == "OPTIONS" {
      return
   }

   // process the request...
}

After adding this, server will send CORS header in response and browser will accept it and will not restrict any content of this server.

Caution: Adding * in Access-Control-Allow-Origin means any website can show your content which can be risky so make sure to add the domain name for which you want to show your content.

Here is the official documentation of CORS policy https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS