Using the security feature known as **Cross-Origin Resource Sharing** (CORS), web browsers can limit HTTP requests from different origins. By making web programs adhere to particular rules, it helps protect user data. The requirement to permit CORS queries between various domains may arise in some circumstances, though. Using JavaScript on the client and Golang on the server, we will examine how to enable CORS in this post [1]. ### Enabling CORS with JavaScript Using the `XMLHttpRequest` object or the more recent fetch API, JavaScript offers a method for sending HTTP requests from a web browser. To allow CORS requests, you need to set the appropriate headers in your JavaScript code. Here's an example of enabling CORS with JavaScript [2]: ``` const url = 'https://api.example.com/data'; fetch(url, { method: 'GET', mode: 'cors', headers: { 'Access-Control-Allow-Origin': '*', // Replace '*' with the actual domain you want to allow }, }) .then(response => response.json()) .then(data => { // Handle the response data }) .catch(error => { // Handle any errors }); ``` #### Definition of Code: In the above code snippet, we use the `fetch` API to make a `GET` request to the `https://api.example.com/data` URL. We set the mode property to 'cors' to enable CORS. Additionally, we include the `Access-Control-Allow-Origin` header in the request with the value set to the domain(s) you want to allow. Replace the * with the actual domain you want to allow or use the wildcard * to allow requests from any domain. ### Enabling CORS with Golang ![](https://hackmd.io/_uploads/S1p0KT0tn.png) Image Source: https://adiatma.github.io/setup-cors-origin-in-golang/ On the server-side, if you are using Golang, you can enable CORS by setting the appropriate headers in your HTTP handler [3]. Here's an example of enabling CORS with Golang: ``` package main import ( "net/http" ) func main() { http.HandleFunc("/data", func(w http.ResponseWriter, r *http.Request) { // Set the CORS headers w.Header().Set("Access-Control-Allow-Origin", "*") // Replace '*' with the actual domain you want to allow w.Header().Set("Access-Control-Allow-Methods", "GET, POST, PUT, DELETE") w.Header().Set("Access-Control-Allow-Headers", "Content-Type, Authorization") // Process the request // ... // Write the response w.WriteHeader(http.StatusOK) w.Write([]byte("Response data")) }) http.ListenAndServe(":8000", nil) } ``` #### Definition of Code: In the above code snippet, we define an HTTP handler for the `/data` endpoint. Within the handler function, we set the necessary CORS headers using the `w.Header().Set()` method. In this example, we set the `Access-Control-Allow-Origin` header to `*` to allow requests from any domain. Replace the `*` with the actual domain you want to allow or use the wildcard * to allow requests from any domain. We also set the `Access-Control-Allow-Methods` header to specify the allowed HTTP methods and the `Access-Control-Allow-Headers` header to specify the allowed request headers. ### Summary Enabling CORS is essential when you need to make cross-origin requests from JavaScript to a server-side API implemented in Golang or any other programming language. By setting the appropriate headers on both the client-side and server-side, you can allow CORS requests securely. ### References: [1] https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS [2] https://stackoverflow.com/questions/36878255/allow-access-control-allow-origin-header-using-html5-fetch-api [3] https://adiatma.github.io/setup-cors-origin-in-golang/