개요
CORS (Cross-Origin Resource Sharing)는 웹 애플리케이션에서 동일 출처 정책을 우회하여 다른 도메인 간의 데이터 교환을 가능하게 해주는 메커니즘입니다. 이를 이용하여 다른 도메인의 로드 밸런싱을 수행할 수 있습니다. 이번 포스트에서는 CORS를 활용하여 다른 도메인의 로드 밸런싱을 수행하는 방법에 대해 알아보겠습니다.
CORS 설정
CORS를 사용하기 위해서는 서버 측에서 CORS 설정을 해주어야 합니다. 서버는 응답 헤더에 Access-Control-Allow-Origin
헤더를 포함시켜야 합니다. 이 헤더의 값으로 다른 도메인의 URL을 입력하면 해당 도메인에서 오는 요청을 허용하게 됩니다.
일반적으로는 다음과 같은 형태로 Access-Control-Allow-Origin
응답 헤더를 설정합니다:
response.setHeader('Access-Control-Allow-Origin', 'http://example.com');
만약 모든 도메인에서의 요청을 허용하고 싶다면, *
를 사용합니다:
response.setHeader('Access-Control-Allow-Origin', '*');
자바스크립트에서 CORS 사용하기
CORS를 사용하여 다른 도메인의 로드 밸런싱을 수행하기 위해서는 자바스크립트의 XMLHttpRequest
객체나 fetch
API를 사용하여 요청을 보내야 합니다.
XMLHttpRequest 사용 예시
var xhr = new XMLHttpRequest();
xhr.open('GET', 'http://example.com/api/data', true);
xhr.onreadystatechange = function() {
if (xhr.readyState === 4 && xhr.status === 200) {
var response = JSON.parse(xhr.responseText);
// 로드 밸런싱에 필요한 작업 수행
}
};
xhr.send();
fetch API 사용 예시
fetch('http://example.com/api/data')
.then(function(response) {
if (response.ok) {
return response.json();
} else {
throw new Error('HTTP error, status = ' + response.status);
}
})
.then(function(data) {
// 로드 밸런싱에 필요한 작업 수행
})
.catch(function(error) {
console.log('Error:', error);
});
결과
CORS를 통해 다른 도메인의 로드 밸런싱을 수행할 수 있습니다. 서버에서 Access-Control-Allow-Origin
헤더를 적절히 설정하여 다른 도메인에서 오는 요청을 허용하도록 설정하고, 자바스크립트 코드에서는 CORS를 지원하는 XMLHttpRequest 객체나 fetch API를 사용하여 요청을 보내면 됩니다.
이를 통해 웹 애플리케이션에서 다른 도메인의 리소스를 활용하여 로드 밸런싱을 수행할 수 있습니다.