Comment résoudre le problème selon lequel les images inter-domaines ne sont pas affichées dans thinkphp

Tout d’abord, comprenons ce qu’est le cross-domain. Le cross-domain se produit entre deux sites Web avec des noms de domaine différents. Lorsque les ressources d'un site Web, telles que JS, CSS, Ajax ou images, demandent à accéder aux ressources d'un autre site Web, elles sont bloquées en raison des restrictions de celui-ci. politique d’origine. Restreindre un site Web à accéder uniquement aux ressources ayant le même nom de domaine, le même protocole et le même port est une fonctionnalité de sécurité clé de la politique de même origine.

Nous utilisons une bibliothèque tierce pour charger les images dans le projet, qui utilise des adresses avec différents noms de domaine pour stocker les images. Par conséquent, dans le navigateur, l’image ne peut pas s’afficher correctement lorsqu’elle est interdomaine.

Afin de résoudre ce problème, nous devons effectuer quelques réglages côté serveur. La solution la plus courante consiste à mettre en place CORS (Cross-Origin Resource Sharing) côté serveur. CORS permet au serveur de restreindre l'accès à la ressource à des noms de domaine spécifiques uniquement lorsqu'il répond aux demandes des clients.

Dans le framework ThinkPHP, nous pouvons implémenter CORS en ajoutant le code suivant dans le fichier index.php :

header('Access-Control-Allow-Origin:*'); //允许所有来源访问
header('Access-Control-Allow-Method:POST,GET'); //允许访问的方式

Ce code permet à toutes les sources d'accéder aux ressources, et permet l'accès POST et GET.

La chose importante à noter ici est que ce code doit être placé en haut de index.php afin que toutes les requêtes puissent utiliser ce paramètre.

En plus de configurer CORS, nous pouvons également utiliser d'autres méthodes pour résoudre les problèmes inter-domaines. Par exemple, JSONP (JSON with Padding) est une méthode réalisable pour résoudre les problèmes inter-domaines. En ajoutant une balise de script à la page, les données auxquelles il faut accéder sont regroupées dans une fonction, puis les résultats renvoyés sont reçus. un autre site internet.

Dans le framework ThinkPHP, nous pouvons utiliser le code suivant pour générer la méthode JSONP :

$callback = isset($_GET['callback']) ? $_GET['callback'] : 'callback';
$data = array('name' => 'test', 'age' => 18);
echo $callback . '(' . json_encode($data) . ')';

Nous vérifions d'abord si le paramètre GET a un paramètre de rappel, et si c'est le cas, utilisons ce paramètre comme nom de fonction. Ensuite, convertissez les données à renvoyer au format JSON et ajoutez-les à la fonction de rappel. Enfin, lors du renvoi des données, nous renvoyons la fonction au navigateur avec les données.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!