0% found this document useful (0 votes)
3 views

Cors in JavaScript

Details notes of js
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
3 views

Cors in JavaScript

Details notes of js
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 5

01

CORS in
JavaScript
(Must have Understand full stack developers)
02

What is CORS?
CORS (Cross-Origin Resource Sharing)

This is browsers to control how web pages can


request resources (e.g., API data) from a different
domain (cross-origin).

et index.html
G

Same origin(domain)
xdomain.com
Get
font
.wof
f
Client
Acce
ss-co
ntrol-
allow
-orig cross origin(domain)
in:* ydomain.com

@KaliyappanRangan https://kaliyappan-r.web.app
03

What is Cross-Origin?
Origin refers
Protocol (e.g., http, https)
Domain (e.g., example.com)
Port (e.g., :80, :443)

cross-origin when the web page running on one origin


(say, https://example.com) tries to access a resource
(like an API) on another origin (say,
https://api.anotherdomain.com).

@KaliyappanRangan https://kaliyappan-r.web.app
04
Client Request

fetch('https://api.anotherdomain.com/data', {
method: 'GET',
mode: 'cors'
})
.then(response => response.json())
.then(data => console.log(data))
.catch(error => console.error('Error:', error));

Server Response

HTTP/1.1 200 OK
Access-Control-Allow-Origin: https://example.com
Access-Control-Allow-Methods: GET, POST
Access-Control-Allow-Headers: Content-Type

@KaliyappanRangan https://kaliyappan-r.web.app
Portfolio - https://kaliyappan-r.web.app

Email - [email protected]

Mobile - +91 63826 89586

Follow for more

You might also like