Mengatasi Pemuatan Fon Silang Asal dalam Firefox dengan Amazon S3 CORS
Firefox mempunyai isu lama dengan memuatkan fon daripada asal yang berbeza daripada halaman web tersebut. Masalah ini sering timbul apabila fon dihoskan pada CDN. Walaupun pelbagai penyelesaian telah dicadangkan, bolehkah Amazon S3 CORS (Perkongsian Sumber Silang Asal) digunakan untuk menyelesaikan isu ini?
Konfigurasi CORS untuk Pemuatan Fon
Untuk mendayakan fon dimuatkan melalui CORS, konfigurasi baldi S3 anda dengan CORS berikut dasar:
<CORSConfiguration xmlns="http://s3.amazonaws.com/doc/2006-03-01/" > <CORSRule> <AllowedOrigin>https://mydomain.com</AllowedOrigin> <AllowedMethod>GET</AllowedMethod> <MaxAgeSeconds>3000</MaxAgeSeconds> <AllowedHeader>Content-*</AllowedHeader> <AllowedHeader>Host</AllowedHeader> </CORSRule> <CORSRule> <AllowedOrigin>https://*.mydomain.com</AllowedOrigin> <AllowedMethod>GET</AllowedMethod> <MaxAgeSeconds>3000</MaxAgeSeconds> <AllowedHeader>Content-*</AllowedHeader> <AllowedHeader>Host</AllowedHeader> </CORSRule> </CORSConfiguration>
Konfigurasi ini membenarkan permintaan GET daripada domain yang anda tentukan dengan pengepala khusus, membolehkan pemuatan fon silang asal.
Penyelesaian Rentetan Pertanyaan
Jika Cloudfront meng-cache pengepala Access-Control-Allow-Origin, pertimbangkan untuk menggunakan rentetan pertanyaan untuk membezakan antara panggilan daripada domain berbeza:
Sebagai contoh, untuk Domain A:
https://hashhashhash.cloudfront.net/font.woff?https_a.domain.com
Dan untuk Domain B:
https://hashhashhash.cloudfront.net/font.woff?http_b.domain.com
Penyelesaian ini memastikan Cloudfront menyediakan CORS yang betul pengepala untuk setiap domain.
Atas ialah kandungan terperinci Bolehkah Amazon S3 CORS Menyelesaikan Isu Pemuatan Fon Silang Asal Firefox?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!