RequestInit 가져오기 - 범위, 전역
RequestInit API는 가져오기 요청을 구성하는 옵션을 제공합니다.
RequestInit 객체를 Request() 생성자에 전달하거나 fetch() 함수 호출에 직접 전달할 수 있습니다. RequestInit() 호출로 요청을 구성하고 다른 RequestInit()와 함께 요청을 fetch() 호출에 전달할 수도 있습니다. 두 위치에 동일한 옵션이 설정되어 있을 때 이 작업을 수행하면 fetch() 에 직접 전달된 값이 사용됩니다.
- 페치 - 페치(문자열 자원, 객체 옵션): 네트워크에서 자원을 가져오는 프로세스를 시작합니다.
- 헤더 가져오기 - 범위, 전역: 요청 및 응답 헤더를 검색하고 수정합니다.
- 가져오기 요청 - 범위, 전역: 새 요청 객체를 만듭니다.
- RequestInit 가져오기 - 범위, 전역: 가져오기 요청을 구성하는 옵션을 설정합니다.
- 응답 가져오기 - 범위, 전역: 새 응답 객체를 생성합니다.
가져오기 작업을 지원하기 위해 시스템 속성인 glide.hosts.allowlist를 사용하면 가져오기 메서드가 액세스할 수 있는 호스트를 제어할 수 있습니다. RestMessageV2 및 위에서 언급한 것과 같은 HTTP API에 적용됩니다. glide.hosts.allowlist에 대한 자세한 내용은 다음 문서를 참조하십시오Available system properties.
RequestInit 가져오기 - RequestInit
가져오기 요청을 구성하는 옵션을 설정합니다. RequestInit 객체를 Request() 생성자에 전달하거나 fetch() 함수 호출에 직접 전달할 수 있습니다.
RequestInit 속성
RequestInit API는 HTTP 요청 동작을 구성하는 데 사용할 수 있는 몇 가지 선택적 속성을 지원합니다. 속성에는 메서드 (HTTP 메서드), 헤더 (요청 헤더), 본문 (보낼 데이터), 모드 (CORS 모드), 자격 증명 (인증 세부 정보), 캐시 (캐시 동작) 및 리디렉션, 참조자 및 무결성과 같은 기타 항목이 포함됩니다. 이러한 옵션을 사용하면 다양한 사용 사례에 대한 요청 동작을 미세 조정할 수 있습니다. 각 속성에 대한 자세한 설명을 읽으려면 다음 문서를 참조하십시오 https://developer.mozilla.org/en-US/docs/Web/API/RequestInit.
| 속성 이름 | 설명 |
|---|---|
| 속성보고 | 옵션입니다. 요청의 응답에서 JavaScript 기반 어트리뷰션 소스 또는 어트리뷰션 트리거를 등록할 수 있기를 원하는지를 나타냅니다. attributionReporting 은 다음 속성을 포함하는 객체입니다.
데이터 유형: 객체 |
| 본문 | 옵션입니다. 요청 본문에는 POST 또는 PUT 요청과 같이 서버로 보낼 콘텐츠가 포함되어 있습니다. 허용되는 유형:
|
| browsingTopics | 옵션입니다. 현재 사용자에 대해 선택한 주제를 연결된 요청과 함께 Sec-Browsing-Topics 헤더로 보내야 하는지 여부를 나타내는 플래그입니다. 허용되는 값:
데이터 유형: 부울 |
| 캐시 | 옵션입니다. 요청에 사용할 캐시 모드입니다. 허용되는 값:
캐시된 데이터 유형: 문자열 |
| 자격 증명 | 옵션입니다. 브라우저가 요청과 함께 자격 증명을 보낼지 여부와 Set-Cookie 응답 헤더가 적용되는지 여부를 통제합니다. 자격 증명은 쿠키, TLS 클라이언트 인증서 또는 사용자 이름과 암호를 포함하는 인증 헤더입니다. 허용되는 값:
기본값: same-origin 데이터 유형: 문자열 |
| 헤더 | 옵션입니다. 요청에 추가할 헤더(Headers 객체 또는 키가 헤더 이름이고 값이 헤더 값인 객체 리터럴 내에 포함됨)입니다. 많은 헤더는 브라우저에 의해 자동으로 설정되며 스크립트로 설정할 수 없습니다. 이를 금지된 헤더 이름이라고 합니다.
데이터 유형: 문자열 |
| 무결성 | 옵션입니다. 요청의 하위 자원 무결성 값을 포함합니다. 자원을 가져올 때 확인됩니다. 브라우저는 지정된 알고리즘을 사용하여 가져온 자원의 해시를 계산하고, 결과가 지정된 값과 일치하지 않으면 네트워크 오류와 함께 가져오기 요청을 거부합니다. 이 옵션의 형식은 <hash-algo>-<hash-source> 이며,
기본값은 빈 문자열입니다. 데이터 유형: 문자열 |
| 연결 유지 | 옵션입니다. 요청이 완료되기 전에 요청을 시작한 페이지가 언로드된 경우 연결된 요청을 중단할지 여부를 나타내는 플래그입니다.
유효한 값은 다음과 같습니다.
데이터 유형: 부울 기본값: false |
| 방법 | 옵션입니다. 요청 메서드입니다. 데이터 유형: 문자열 기본값: GET |
| 모드 | 옵션입니다. 요청에 대한 교차 원본 동작을 설정합니다. 유효한 값은 다음과 같습니다.
데이터 유형: 문자열 기본값: cors |
| 우선순위 | 옵션입니다. 같은 유형의 다른 요청과 비교했을 때 가져오기 요청의 우선순위를 지정합니다. 유효한 값은 다음과 같습니다.
데이터 유형: 문자열 기본값: auto |
| redirect | 옵션입니다. 서버가 리디렉션 상태로 응답하는 경우 브라우저의 동작을 결정합니다. 허용되는 값:
데이터 유형: 문자열 기본값: 팔로우 |
| 참조자 | 옵션입니다. 요청의 참조자 헤더에 사용할 값을 지정하는 문자열입니다. 허용되는 값 및 데이터 유형:
기본값: about:client |
| 참조자 정책 | 옵션입니다. Referrer 헤더에 대한 정책을 설정하는 문자열입니다. 이 옵션의 구문과 의미 체계는 Referrer-Policy 헤더와 정확히 동일합니다. 데이터 유형: 문자열 |
| 신호 | 옵션입니다. AbortSignal입니다. 이 옵션이 설정되어 있으면 해당 AbortController에서 abort()를 호출하여 요청을 취소할 수 있습니다.데이터 유형: 문자열 |
| 유형 | 설명 |
|---|---|
| 없음 |
fetch()에 옵션 전달
이 예제는 메서드, 본문 및 헤더 옵션을 fetch() 메서드에 직접 전달하는 방법을 보여줍니다.
async function post() {
const response = await fetch("https://example.org/post", {
method: "POST",
body: JSON.stringify({ username: "example" }),
headers: {
"Content-Type": "application/json",
},
});
console.log(response.status);
}Request() 생성자에 옵션 전달
이 예제는 요청을 만들고 메서드, 본문 및 헤더 옵션을 생성자에 전달하고 요청을 fetch()에 전달하는 방법을 보여줍니다.
async function post() {
const request = new Request("https://example.org/post", {
method: "POST",
body: JSON.stringify({ username: "example" }),
headers: {
"Content-Type": "application/json",
},
});
const response = await fetch(request);
console.log(response.status);
}Request() 및 fetch() 모두에 옵션 전달
이 예제에서는 Request() 를 만들고 메서드, 본문 및 헤더 옵션을 생성자에 전달하는 방법을 보여줍니다. 그런 다음 스크립트는 본문 및 참조자 옵션과 함께 요청을 fetch() 로 전달합니다.
- 메서드: "POST"
- 헤더: {"Content-Type": "application/json"}
- 본문: '{"username":"example2"}'
- 참조자: ""
async function post() {
const request = new Request("https://example.org/post", {
method: "POST",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify({ username: "example1" }),
});
const response = await fetch(request, {
body: JSON.stringify({ username: "example2" }),
referrer: "",
});
console.log(response.status);
}