Django media URLs in CSS files

StackOverflow https://stackoverflow.com/questions/1023888

  •  06-07-2019
  •  | 
  •  

Question

Dans les modèles django, il est courant de procéder comme suit: 

<img src="{{ MEDIA_URL }}/img/someImage.jpg">

Comment pouvez-vous accomplir cela dans un fichier CSS qui n'est pas servi de modèle? 

.someClass {
    /* can't do this this */
    background: url("{{ MEDIA_URL }}/img/someImage.jpg");        
    /* either this */
    background: url("http://media.domain.com/img/someImage.jpg");
    /* or this */
    background: url("/django_static_media/img/someImage.jpg");
    /* can't do both... what to do? */
}

Je dois pouvoir servir mes fichiers à partir du sous-domaine de média ou pendant le travail hors connexion et les servir directement en tant que vue statique django. Mais les fichiers CSS posent problème car ils ne sont pas traités en tant que modèles et je ne peux pas utiliser la variable de contexte MEDIA_URL .

Quelle est la solution?

Modifier: Je dois noter que le problème se pose car mes fichiers multimédias statiques sont en fait situés sur un sous-domaine multimédia distinct, , ce qui empêche l'utilisation de chemins relatifs. Compris, merci!

Était-ce utile?

La solution

D'où provient votre fichier css? Ce n'est généralement pas un problème en tant que structure multimédia commune telle que: 

media/
    images/
    css/
    js/

(ou similaire) autorise des chemins de fichiers relatifs pour les images, par exemple: 

background: url('../images/foo.png');

Si vous n'êtes pas prêt à modifier la structure de votre dossier multimédia afin de l'adapter aux chemins de fichiers relatifs, il se peut que vous n'ayez pas d'autre choix que d'écraser les déclarations css à partir du modèle, en utilisant un fichier css secondaire en mode hors connexion: 

{% if DEBUG %}
    <link rel="stylesheet" href="{{ MEDIA_URL }}css/offline-mode.css" />
{% endif %}

Bien sûr, la première option est beaucoup plus ordonnée.

Autres conseils

Désolé, vous n'aimerez pas la réponse.

J'ai le même problème:

Il n’existe pas de moyen simple de le faire avec des fichiers CSS à service statique.

Ce que je fais:

  • serveur de débogage, travail local, média servi localement
  • le serveur de production est hébergé quelque part dans le commerce avec les médias sur Amazon S3
  • Le fichier settings.py définit automatiquement MEDIA_URL (DEBUG, etc.) via la vérification du nom d'hôte (pour différencier la production par rapport au répertoire local / home / debug)
  • Les fichiers HTML ont tous des liens css avec {{MEDIA_URL}} (+ RequestContext contextes pour les vues)
  • J'aime les noms de chemin absolus, donc un " update_s3 " scénario: (1) modifie chaque fichier CSS à corriger temporairement "url (" / media "à" url ("s3.mydomain.com/media" et (2) met à jour / télécharge mon répertoire / media sur Amazon S3

Je passe ensuite à la production et effectue un svn update & amp; touchez le fichier WSGI & amp; valider

L'utilisation de chemins d'accès relatifs (pour les fichiers image) dans vos fichiers CSS n'est-elle pas une option viable pour vous?

Si vous souhaitez utiliser les directives de modèle dans un fichier, pourquoi ne pas le servir via un modèle?

Licencié sous: CC-BY-SA avec attribution
Non affilié à StackOverflow
scroll top