2013-03-14 19 views
5

Gần đây, chúng tôi đã chuyển các nội dung của mình trên một Cloudfront CDN. Chúng tôi đã nhận thấy rằng các bề mặt đã bị hỏng trên Firefox. Sau một vài phút tìm kiếm, đó là một câu chuyện về CORS. Chúng tôi đã cho phép Cloudfront hiện trường.Heroku + CDN Cloudfront + Fonts - Lỗi Firefox

application_controller:

after_filter :set_access_control_headers 

def set_access_control_headers 
    headers['Access-Control-Allow-Origin'] = CDN_CLOUDFRONT 
end 

production.rb:

CDN_CLOUDFRONT = "http://xxx.cloudfront.net" 

này làm việc rất tốt cho đến khi ngày hôm qua. Sau một vài tìm kiếm và phản xạ, tôi đã không tìm thấy một giải pháp.

Bất kỳ ý tưởng nào?

+0

Bạn đã kiểm tra câu trả lời cho câu hỏi tương tự-sounding này? http://stackoverflow.com/questions/12229844/amazon-s3-cors-cross-origin-resource-sharing-and-firefox-cross-domain-font-loa – friism

+0

Câu hỏi đặt ra nghe có vẻ giống nhau nhưng các nhà cung cấp CDN là khác nhau - > câu trả lời khác. – ferrix

Trả lời

7

Tôi chưa từng làm việc với một thiết lập Heroku, nhưng AFAIK (và như minh họa ở developer.mozilla.org), tiêu đề Access-Control-Allow-Origin nên phản ánh giá trị của tên miền mà tiêu thụ tài sản tĩnh từ CDN.

ví dụ .: Đối với một trang web lưu trữ tại http://mydomain.net và tài sản tiêu thụ từ http://wefe342r34r23.cloudfront.net

headers['Access-Control-Allow-Origin'] = 'http://mydomain.net'

sẽ cho phép mydomain.net để truy cập tài sản qua http://wefe342r34r23.cloudfront.net. Nói cách khác, thay thế CDN_CLOUDFRONT bằng tên miền của trang web của bạn sẽ giải quyết được vấn đề.

Hy vọng điều này sẽ hữu ích.

P.S .: Tôi không chắc chắn cách thiết lập của bạn làm việc cho đến ngày hôm qua. :)

P.P.S: Thêm Tên thay thế tên miền (CNAME) để CDN của bạn sẽ giúp bạn trong một kịch bản trong đó bạn muốn nhanh chóng loại bỏ một phân phối hiện có tiếp xúc qua http://xxx.cloudfront.net và bắt đầu sử dụng một bản phân phối tươi http://yyy.cloudfront.net. Bạn sẽ không cần phải thay đổi bất kỳ điều gì trong mã ứng dụng của mình nếu bạn đang sử dụng Tên miền thay thế chẳng hạn như http://cdn.mydomain.net trong trường hợp đó.

+0

Cảm ơn rhetonik – hypee

+0

@hypee: Không có vấn đề. :) – rhetonik

+0

Tiêu đề này phải được đặt trên truy vấn nội dung phải không? Hoặc trên các truy vấn html? Tôi đang phải vật lộn với điều này ([và tôi không phải là người duy nhất] (http://stackoverflow.com/questions/20585703/cloudfront-firefox-cors-issues)) vì vậy nếu bạn chi tiết hơn một chút, nó sẽ là đánh giá cao! –

0

Đây là bản sao của những gì tôi đăng tải trong một trang stack Trao đổi liên quan đến cùng một chủ đề, và tôi rời khỏi đây trong trường hợp người khác có vấn đề tương tự nhưng không tìm thấy câu trả lời đúng.

tôi đã cùng một vấn đề với một ứng dụng Rails 3 trên Heroku; Các biểu tượng Font-Awesome không hiển thị vì tôi đang chạy tài sản của mình thông qua Sumo CDN. Có một số câu trả lời liên quan đến điều này, một trong số đó là đặt một after_filter trong application_controller của bạn để đặt giá trị tiêu đề (bởi freemanoid), nhưng điều đó không hiệu quả đối với tôi và tôi phải sử dụng phần mềm trung gian tùy chỉnh được đề xuất bởi Peter Marklund.

Cả hai giải pháp này được đăng ở đây dưới sự Rails 3.1 phiên bản: How to set access-control-allow-origin in webrick under rails?

0

workaround Tôi đã sử dụng - tải lên các phông chữ riêng để S3 và thiết lập cấu hình CORS vào xô. Hardcode liên kết phông chữ với phông chữ S3. Tất cả nội dung (trừ phông chữ) sẽ đến từ cloudfront - phông chữ của bạn sẽ đến từ S3. Cái xấu xí của nó - nhưng nó hoạt động ....

+0

này sẽ không làm việc trừ khi bạn cấu hình đúng CloudFront để chuyển tiếp tiêu đề CORS. –

Các vấn đề liên quan