Maison >développement back-end >tutoriel php >Pourquoi mes CSS, JS et images sont-ils cassés après la mise en œuvre d'URL optimisées pour le référencement ?

Pourquoi mes CSS, JS et images sont-ils cassés après la mise en œuvre d'URL optimisées pour le référencement ?

DDD
DDDoriginal
2024-12-25 12:42:20759parcourir

Why Are My CSS, JS, and Images Broken After Implementing SEO-Friendly URLs?

Les URL optimisées pour le référencement ont un impact sur les fonctionnalités CSS, JS et d'image : une stratégie de réécriture

Pour améliorer l'optimisation des moteurs de recherche (SEO), vous J'ai réécrit votre fichier .htaccess avec l'intention de mettre en œuvre des URL optimisées pour le référencement. Cependant, vous avez rencontré un problème inattendu : CSS, JS et images ne fonctionnent pas comme prévu sur les pages modifiées.

Le problème vient du fait que la configuration de votre fichier .htaccess d'origine crée des URL optimisées pour le référencement à l'aide de les règles suivantes :

RewriteRule ^swift-details/([0-9]+)/([0-9a-zA-Z_-]+)$ swift-details.php?id= [NC,L]
RewriteRule ^swift-details/(css|js|img)/(.*)?$ // [L,QSA,R=301]

La première règle réécrit l'URL dans un format plus convivial pour le référencement. Le problème réside dans la deuxième règle. il tente de mapper les requêtes CSS, JS et images à leurs homologues absolus tout en conservant des liens relatifs au sein de vos pages.

Cependant, cette approche modifie l'URI de base de vos pages, provoquant des liens relatifs (tels que "styles" .css") échoue car le navigateur les interprète désormais par rapport à l'URL modifiée (par exemple, "/swift-details/2/abblinbb"). Par conséquent, CSS, JS et images ne sont pas chargés correctement.

Correction : injection d'URI absolue ou de base

Il existe deux solutions possibles pour résoudre ce problème :

  • Utilisez des liens absolus : Modifiez les liens dans vos pages pour utiliser des URL absolues au lieu d'URL relatives. (par exemple, "/css/styles.css").
  • Infecter l'URI de base : Ajoutez un avec un URI de base absolu dans le de vos pages :
<head>
  <base href="/" />
</head>

Cela forcera le navigateur à résoudre les liens relatifs avec l'URI de base approprié, garantissant ainsi que CSS, JS et les images se chargent comme prévu.

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!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn