Django phương tiện truyền thông URL trong CSS file

Question

Trong mẫu django, nó phổ biến để làm như sau:

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

Làm thế nào bạn sẽ thực hiện điều này trong một file CSS mà không được phục vụ như một mẫu?

.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? */ 
} 

Tôi cần khả năng phân phát tệp từ tên miền phụ truyền thông hoặc trong khi làm việc ngoại tuyến và trực tiếp phục vụ chúng dưới dạng chế độ xem tĩnh django. Nhưng tệp CSS là một vấn đề vì chúng không được xử lý dưới dạng mẫu và tôi không thể sử dụng biến ngữ cảnh MEDIA_URL.

Giải pháp là gì?

Chỉnh sửa: Tôi nên lưu ý rằng vấn đề phát sinh do tệp phương tiện tĩnh của tôi nằm trên miền phụ phương tiện riêng lẻ, do đó phủ nhận việc sử dụng đường dẫn tương đối. OK, cảm ơn!

Answer 1

Tệp css của bạn được phân phát từ đâu? Điều này thường không phải là một vấn đề như một cấu trúc chung phương tiện truyền thông như:

media/ 
    images/ 
    css/ 
    js/ 

(hoặc tương tự) cho phép các đường dẫn tập tin tương đối cho hình ảnh, ví dụ:

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

Nếu bạn không chuẩn bị để thay đổi cấu trúc thư mục phương tiện truyền thông của bạn để phù hợp với đường dẫn tập tin tương đối, bạn có thể không có thay thế nhưng để ghi đè lên tờ khai css từ bên trong mẫu, sử dụng một file css phụ khi ẩn:

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

Dĩ nhiên tùy chọn đầu tiên là nhiều tidier.

Answer 2

Có sử dụng đường dẫn tương đối (đối với tệp hình ảnh) trong tệp CSS của bạn không phải là tùy chọn khả thi cho bạn không?

Answer 3

Nếu bạn muốn sử dụng chỉ thị mẫu trong một tệp, tại sao tệp không được phân phối qua mẫu?

Answer 4

Rất tiếc, bạn sẽ không thích câu trả lời.

Tôi gặp vấn đề tương tự:

Không có cách nào dễ dàng để thực hiện việc này với các tệp CSS được phân phối tĩnh.

Những gì tôi làm:

• debug máy chủ, làm việc tại địa phương, phương tiện truyền thông phục vụ tại địa phương
• máy chủ sản xuất được lưu trữ ở đâu đó ra thương mại w/phương tiện truyền thông trên Amazon S3
• tập tin settings.py tự động đặt MEDIA_URL (DEBUG, vv) qua kiểm tra tên máy chủ (để phân biệt sản xuất so với địa phương/home/debug)
• Tất cả các tệp HTML đều có liên kết css với {{MEDIA_URL}} (+ RequestContext ngữ cảnh cho chế độ xem)
• Tôi thích tên đường dẫn tuyệt đối, do đó, tập lệnh "update_s3": (1) thay đổi mỗi tệp css tạm thời để sửa chữa 'url ("/ media' thành 'url (" s3.mydomain.com/phương tiện truyền thông và (2) cập nhật/uploads/phương tiện truyền thông thư của tôi đến Amazon S3

sau đó tôi đi vào sản xuất và làm một bản cập nhật svn & touch file WSGI & Validate