프론트 엔드 분리 프로젝트에서 API 응답 헤더의 올바른 설정 구현

M66 2025-05-28

프론트 엔드, 백엔드, 프론트 엔드 (일반적으로 VUE, React, Angular와 같은 프레임 워크를 기반으로 한 단일 페이지 응용 프로그램) 및 백엔드 (일반적으로 PHP, Node.js, Python 등을 기반으로 한 API 서비스)로 분리 된 프로젝트에서 HTTP 인터페이스를 통해 상호 작용합니다. 프론트 엔드로 API 응답을 올바르게 처리 할 수 있도록하려면 도메인 교차 도메인 문제를 피하고 보안 및 표준화를 보장하려면 HTTP 응답 헤더를 올바르게 설정해야합니다.

PHP에서 가장 일반적으로 사용되는 도구는 헤더 () 함수입니다. 이 기사는 특정 예제를 사용하여 헤더 () 함수를 사용하여 프론트 엔드 분리 프로젝트에서 공통 API 응답 헤더를 설정하는 방법을 설명합니다.

1. 컨텐츠 유형 응답 헤더를 설정하십시오

API에 의해 반환 된 데이터는 일반적으로 JSON 형식이므로 프론트 엔드와 클라이언트 에게이 시점에 알려야합니다.

 header('Content-Type: application/json; charset=utf-8');

이 코드 줄은 반환 된 데이터 유형이 JSON이고 문자 세트는 UTF-8임을 나타냅니다. 프론트 엔드는이 정보에 따라 응답을 올바르게 구문 분석 할 수 있습니다.

2. CORS (Cross-Domain) 응답 헤더를 설정하십시오

현재와 백엔드가 동일한 도메인에 있지 않으면 브라우저는 요청을 가로 채 웁니다. 프론트 엔드 액세스를 허용하려면 크로스 도메인 응답 헤더를 추가해야합니다.

 header('Access-Control-Allow-Origin: https://m66.net');
header('Access-Control-Allow-Methods: GET, POST, PUT, DELETE, OPTIONS');
header('Access-Control-Allow-Headers: Content-Type, Authorization');

이러한 설정을 통해 https://m66.net 에서 API에 대한 프론트 엔드 액세스가 가능하며 지정된 요청 메소드 및 사용자 정의 요청 헤더가 허용됩니다. 참고 : 생산 환경에서 사용 하지 않고 보안을 향상시키기 위해 특정 도메인 이름을 지정하는 것이 가장 좋습니다.

3. 캐시를 방지하도록 응답 헤더를 설정하십시오

프론트 엔드가 매번 최신 데이터를 가져 오도록하기 위해 캐싱을 비활성화 할 수 있습니다.

 header('Cache-Control: no-store, no-cache, must-revalidate');
header('Pragma: no-cache');
header('Expires: 0');

이 응답 헤더는 클라이언트와 프록시 서버가 반환 된 컨텐츠를 캐시하지 않도록 알립니다.

4. HTTP 상태 코드를 반환합니다

때로는 데이터를 반환해야 할뿐만 아니라 해당 HTTP 상태 코드도 설정해야합니다.

예를 들어, 201으로 돌아가서 성공적으로 만들었습니다.

 http_response_code(201);

또는 헤더를 사용하여 설정하십시오.

 header('HTTP/1.1 201 Created');

400, 401, 403, 404, 500과 같은 일반적인 오류 응답의 경우 비즈니스 요구에 따라 유연하게 설정할 수 있습니다.

5. 완전한 예

다음은 완전한 API 응답 샘플 코드입니다.

 <?php
// 설정 JSON 응답 헤더
header('Content-Type: application/json; charset=utf-8');

// 설정跨域
header('Access-Control-Allow-Origin: https://m66.net');
header('Access-Control-Allow-Methods: GET, POST, PUT, DELETE, OPTIONS');
header('Access-Control-Allow-Headers: Content-Type, Authorization');

// 캐시를 비활성화합니다
header('Cache-Control: no-store, no-cache, must-revalidate');
header('Pragma: no-cache');
header('Expires: 0');

// 반품 200 상태 코드
http_response_code(200);

// 반품 JSON 데이터
$response = [
    'status' => 'success',
    'message' => 'API 응답이 성공적으로',
    'data' => ['id' => 1, 'name' => '测试데이터']
];

echo json_encode($response);
?>

header