Position actuelle: Accueil> Derniers articles> Implémentez les paramètres corrects des en-têtes de réponse API dans les projets de séparation frontale

Implémentez les paramètres corrects des en-têtes de réponse API dans les projets de séparation frontale

M66 2025-05-28

Dans les projets séparés par back-end frontal, le frontal (généralement une application à une seule page basée sur des frameworks tels que Vue, React, Angular) et le back-end (généralement un service API basé sur PHP, Node.js, Python, etc.) interagir via l'interface HTTP. Pour vous assurer que les réponses de l'API peuvent être gérées correctement par le frontal, évitez les problèmes de domaine transversal, assurez-vous la sécurité et la normalisation, nous devons configurer correctement l'en-tête de réponse HTTP.

En PHP, l'outil le plus utilisé est la fonction d'en-tête () . Cet article utilisera des exemples spécifiques pour expliquer comment utiliser la fonction d'en-tête () pour définir des en-têtes de réponse API courants dans les projets de séparation frontale.

1. Définissez l'en-tête de réponse de type contenu

Les données renvoyées par l'API se trouvent généralement au format JSON, vous devez donc dire ce point au frontal et au client.

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

Cette ligne de code indique que le type de données renvoyé est JSON et que le jeu de caractères est UTF-8. Le frontal peut analyser correctement la réponse en fonction de ces informations.

2. En-tête de réponse transversal (CORS)

Lorsque le courant et le backend ne sont pas dans le même domaine, le navigateur interceptera la demande. Nous devons ajouter des en-têtes de réponse transversale pour permettre l'accès frontal.

 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');

Ces paramètres permettent un accès frontal à l'API depuis https://m66.net et permettent des méthodes de demande spécifiées et des en-têtes de demande personnalisés. Remarque: il est préférable de ne pas utiliser * dans des environnements de production, mais de spécifier des noms de domaine spécifiques pour améliorer la sécurité.

3. Définissez les en-têtes de réponse pour empêcher le cache

Pour s'assurer que le front-end obtient les dernières données à chaque fois, la mise en cache peut être désactivée:

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

Ces en-têtes de réponse informeront le serveur client et proxy pour ne pas mettre en cache le contenu renvoyé.

4. Renvoie le code d'état HTTP

Parfois, vous devez non seulement renvoyer des données, mais également définir le code d'état HTTP correspondant.

Par exemple, revenez à 201 et créé avec succès:

 http_response_code(201);

Ou utilisez l'en-tête pour définir:

 header('HTTP/1.1 201 Created');

Pour les réponses d'erreur courantes, telles que 400, 401, 403, 404, 500, vous pouvez définir de manière flexible en fonction des besoins de l'entreprise.

5. Exemple complet

Voici un exemple de code complet de réponse à l'API:

 <?php
// installation JSON En-tête de réponse
header('Content-Type: application/json; charset=utf-8');

// installation跨域
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');

// Désactiver le cache
header('Cache-Control: no-store, no-cache, must-revalidate');
header('Pragma: no-cache');
header('Expires: 0');

// retour 200 Code d&#39;état
http_response_code(200);

// retour JSON données
$response = [
    'status' => 'success',
    'message' => 'API Réponse avec succès',
    'data' => ['id' => 1, 'name' => '测试données']
];

echo json_encode($response);
?>