Heroku và @ font-face - phông chữ nhúng sẽ không hiển thị trên Heroku

Question

Tôi có một số ít được cấp phép phông chữ mà tôi đã nhúng vào ứng dụng Rails của mình bằng cách sử dụng thẻ CSS @font-face. Những phông chữ này nằm trong đường dẫn "../Public/Fonts/" trong ứng dụng Rails 3 của tôi và hiển thị hoàn hảo trên bất kỳ máy cục bộ nào mà tôi kéo xuống repo và chạy.

Tuy nhiên, khi tôi đẩy ứng dụng của mình lên Heroku, dường như không tìm thấy phông chữ. Bạn có thể nói rằng nó đang tìm trong thư mục phông chữ nhưng không bao giờ có thể truy cập chúng. Dường như tôi không đặt phông chữ hay cách tôi nhập đường dẫn phông chữ vào khai báo phông chữ @.

phông chữ của tôi được đặt tại #{RAILS.root}/public/fonts/ChunkFive

Đây là @ của tôi font-face khai:

@font-face { 
font-family: "ChunkFive"; 
src: url("../fonts/ChunkFive/ChunkFive-webfont.eot"); 
src: local("?"), 
url("../fonts/ChunkFive/ChunkFive-webfont.woff") format("woff"), 
url("../fonts/ChunkFive/ChunkFive-webfont.ttf") format("truetype"), 
url("../fonts/ChunkFive/ChunkFive-webfont.svg") format("svg"); 
} 

Dưới đây là tài nguyên 404 không tìm thấy thông điệp mà tôi nhận được cho mỗi chữ:

Request URL:http://thedanbarrett.heroku.com/fonts/ChunkFive/ChunkFive-webfont.woff 
Request Method:GET 
Status Code:404 Not Found 
Request Headers 
Referer:http://thedanbarrett.heroku.com/home 
User-Agent:Mozilla/5.0 (Windows; U; Windows NT 6.1; en-US) AppleWebKit/534.10 
(KHTML,like Gecko) Chrome/8.0.552.224 Safari/534.10 
Response Headers 
Age:0 
Connection:keep-alive 
Content-Length:727 
Content-Type:text/html 
Date:Wed, 05 Jan 2011 15:25:21 GMT 
Server:nginx/0.7.67 
Via:1.1 varnish 
X-Runtime:0.001344 
X-Varnish:764492621 

Điều kỳ lạ là nó tìm và tải các bảng định kiểu, biểu tượng và hình ảnh trong cùng một thư mục gốc. Chỉ cần nhắc lại các phông chữ được nhúng và hoạt động hoàn toàn chạy từ máy chủ cục bộ, ngay cả trên các máy chủ không cài đặt phông chữ.

Tôi đã tìm thấy một tài liệu tham khảo trên mạng với ai đó rằng đã có một vấn đề tương tự đã thay đổi họ config.ru và environment.rb file để làm cho nó thân thiện với Heroku, nhưng tôi dường như không thể tìm thấy nó.

Cảm ơn trước SO minions cho tất cả sự giúp đỡ của bạn!

~ Dan

Answer 1

Vì vậy, hóa ra gốc của tài nguyên đã được đặt thành Public/Stylesheets vì vậy khai báo đường dẫn của tôi trong phần phông chữ là vô nghĩa. Tôi đã dễ dàng ra và di chuyển các phông chữ theo thư mục stylesheets và tất cả mọi thứ hoạt động hoàn hảo ngay bây giờ!

Answer 2

Dưới đây là một ví dụ mà đang làm việc trên Heroku: http://www.arailsdemo.com/posts/12

Đây là kiểu tương ứng http://www.arailsdemo.com/stylesheets/application.css

Tôi không nhớ cần bất kỳ thay đổi cấu hình. Hy vọng rằng, nó giúp.

Answer 3

Fonts thư mục: app/assets/fonts/

Thêm dòng dưới đây để production.rb

config.serve_static_assets = true 

Trong styles.css.scss bạn

@font-face { 
    font-family: "mycustomfont"; 
    src:url(asset_path("mycustomfont.eot")); 
    src:url(asset_path("mycustomfont.eot?#iefix")) format("embedded-opentype"), 
    url(asset_path("mycustomfont.ttf")) format("truetype"), 
    url(asset_path("mycustomfont.svg#mycustomfont")) format("svg"), 
    url(asset_path("mycustomfont.woff")) format("woff"); 
    font-weight: normal; 
    font-style: normal; 
} 

Môi trường: Rails 4.0.1Ruby 2.0.0-p247

Nó sẽ làm việc trên cô ấy oku :)