2012-03-06 12 views
19

¿Cuál es la mejor solución para pasar {{STATIC_URL}} a los archivos javascript?Pasando STATIC_URL a un archivo javascript con django

Estoy trabajando con django y python.

Gracias de antemano. Saludos.

+0

¿Estás decir cargar archivos de javascript a una plantilla? ¿O quieres decir usar el valor de {{STATIC_URL}} en el archivo javascript? – arnkore

Respuesta

19

django-compressor le permite hacer esto, así como optimizar su sitio al condensar todo el JS o CSS requerido en un archivo y optimizar el tamaño del archivo.

ACTUALIZACIÓN: De forma predeterminada, el compresor convertirá las URL relativas en direcciones URL absolutas utilizando STATIC_URL. Si descarga la versión de desarrollo, viene con un analizador de motor de plantilla django que le permite usar todo el código de plantilla de django directamente en sus archivos CSS, como la etiqueta {% static %}.

https://github.com/jezdez/django_compressor

Active la TemplateFilter en settings.py después de instalar para analizar sus js o css a través del motor de plantillas.

COMPRESS_JS_FILTERS = [ 
    'compressor.filters.template.TemplateFilter', 
] 

Ahora cualquier JS dentro {% compress js %} bloques serán analizados por el lenguaje de plantillas de Django ...

{% compress js %} 
    <script src="/my_script.js" type="text/javascript"></script> 
{% endcompress %} 

// my_script.js 
alert('{{ STATIC_URL|escapejs }}'); 

en que pidió la mejor manera - Creo que esta es la mejor. Ciertamente, es mejor que servir archivos dinámicos.

+2

¡Esta es una excelente sugerencia! django-compressor es un proyecto genial. – slypete

+0

@slypete, sí, es increíble! Optimice el conteo de archivos, el tamaño del archivo e incluso agregue variables de plantilla. Brillante. Este es mi último gran cambio de juego django ... ¿qué sigue? –

+0

Me gusta esta herramienta, una nota es instalarla usando 'pip install django_compressor' en lugar de clonarla desde github; me llevó menos de 10 minutos configurarla. El único problema que tuve fue establecer explícitamente 'COMPRESS_ENABLED = True' en mi settings.py ... como si ya tuvieras DEBUG = True de alguna otra aplicación, lo leerá y no lo comprime. – JayCrossler

36

Usando una variable javascript global con el valor URL estática es más sencilla:

<script language="javascript">var STATIC_URL = "{{ STATIC_URL|escapejs }}";</script> 
<script src="{{ STATIC_URL }}js/myfile.js"></script> 

A continuación, sólo tiene que utilizar la dirección URL estática llamando STATIC_URL en myfile.js:

html = '<img src="'+STATIC_URL+'/icons/flags/tn.gif">'; 
+0

¡eso es genial! –

+0

¡Me gusta esta solución! – andi

5

Creo que esto complementa el comentario de @Yuji 'Tomita' Tomita, como una configuración completa.

esto funcionó para mí.

Así es como hice la configuración completa del compresor django para usar STATIC_URL en el archivo django js.

https://github.com/jezdez/django_compressor

pip install django_compressor 

Add 'compresor' a su entorno INSTALLED_APPS:

INSTALLED_APPS = (
    # other apps 
    "compressor", 
) 

Para la prueba de compresión en modo de depuración, en settings.py:

COMPRESS_ENABLED = True 

En caso de que utilice la aplicación contrib de staticfiles de Django (o su contraparte independiente django-staticfiles) que tiene que publicar buscador de archivos de Django d Compresor al ajuste STATICFILES_FINDERS, por ejemplo, con django.contrib.staticfiles:

STATICFILES_FINDERS = (
    'django.contrib.staticfiles.finders.FileSystemFinder', 
    'django.contrib.staticfiles.finders.AppDirectoriesFinder', 
    # other finders.. 
    'compressor.finders.CompressorFinder', 
) 

Activar el TemplateFilter en la configuración.py después de la instalación para analizar sus archivos js o css a través del motor de plantillas.

COMPRESS_JS_FILTERS = [ 
    'compressor.filters.template.TemplateFilter', 
] 

Ahora cualquier JS dentro de {% compresa js%} bloques serán analizados por el lenguaje de plantillas de Django ...

{% load compress %} 

{% compress js %} 
    <script src="/my_script.js" type="text/javascript"></script> 
{% endcompress %} 

// my_script.js 

alert('{{ STATIC_URL|escapejs }}'); 
+0

Estaba leyendo los documentos y no encontré este ajuste "STATICFILES_FINDERS" allí. Después de leer su comentario y agregarlo, mi aplicación comenzó a funcionar. ¡Gracias! – mk2