77 votes

Comment inclure des fichiers CSS et JS via HTTPS en cas de besoin?

J'ajoute un fichier CSS externe et un fichier JS externe à mes en-têtes et pieds de page. Lors du chargement d'une page HTTPS, certains navigateurs se plaignent du chargement de contenu non sécurisé.

Existe-t-il un moyen simple de faire en sorte que le navigateur charge le contenu externe via HTTPS lorsque la page elle-même est en HTTPS?

122voto

BalusC Points 498232

Utilisez des chemins relatifs au protocole.

Donc pas

 <link rel="stylesheet" href="http://example.com/style.css">
<script src="http://example.com/script.js"></script>
 

mais alors

 <link rel="stylesheet" href="http://stackoverflow.com//example.com/style.css">
<script src="//example.com/script.js"></script>
 

alors il utilisera le protocole de la page parente.

7voto

nute & James Westgate raison quand comenting sur le tard répondre.

Si nous prenons un coup d'oeil à miscelanous industrie-grade javascript externe comprend, le succès de ceux utiliser à la fois le document.emplacement.protocole de renifler et de l'élément de script injection tu utiliser le protocole approprié.

Vous pouvez utiliser quelque chose comme :

<script type="text/javascript">
  var protocol = (
      ("https:" == document.location.protocol) 
      ? "https" 
      : "http"
  );
  document.write(
      unescape(
          "%3Cscript"
              + " src='"
                  + protocol 
                  + "://"
                  + "your.domain.tld"
                  + "/your/script.js"
              + "'"
              + " type='text/javascript'
          + "%3E"
          + "%3C/script%3E"
      ) // this HAS to be escaped, otherwise it would 
        // close the actual (not injected) <script> element
  );
</script>

La même chose peut être fait pour CSS externe comprend.

Et en passant: veillez à n'utiliser l'url relative() chemin d'accès dans votre CSS, le cas échéant, sinon vous pourriez encore avoir de la "mixtes sécurisés et non sécurisés" alerte....

0voto

James Westgate Points 6789

Si vous utilisez des chemins relatifs (et que le contenu se trouve sur le même domaine), le contenu doit utiliser le protocole dans lequel la page a été demandée.

Toutefois, si vous passez d'un domaine à un autre CDN ou à un site de ressources, ou si vous devez utiliser des chemins absolus, vous devrez utiliser un script côté serveur pour modifier les liens ou toujours utiliser https: //.

0voto

gkempkens Points 1

En contradiction avec la réponse échappée (qui fonctionnera également), vous pouvez ignorer cette partie et utiliser la méthode correcte pour ajouter des nœuds à votre arborescence dom:

 <script type="text/javascript" language="javascript">
    var fileref=document.createElement('script');
    fileref.setAttribute("type","text/javascript");
    fileref.setAttribute("src", document.location.protocol + '//www.mydomain.com/script.js');
    document.getElementsByTagName("head")[0].appendChild(fileref);
</script>
 

Mais le chemin relatif au protocole serait la voie à suivre.

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by: