Mengaktifkan CORS di VestaCP

Kalau anda menggunakan layanan CDN pada website yang dihosting dalam VestaCP maka mungkin akan ada beberapa elemen yang gagal dimuat, paling sering adalah konten berjenis font. Jadi tampilannya akan rusak karena browser tidak mau mendownloadnya dengan alasan keamanan karena konten dimuat dari lokasi berbeda. Kenapa saya bilang mungkin? Karena saya baru tahu terjadi satu kali pada laptop baru saya dan ini menggunakan Windows 10. Mungkin ada hubungannya, atau tidak.

Tapi yang pasti akan muncul pesan error dalam console browser anda semacam ini: Font from origin 'http://cdn.servernesia.com' has been blocked from loading by Cross-Origin Resource Sharing policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://servernesia.com' is therefore not allowed access.

Ini solusinya harus disetting kebijakan CORS (Cross-Origin Resource Sharing) agar dimuat oleh browser. Dan karena yang kita bicarakan adalah VestaCP maka anda bisa mengikuti solusi berikut.

Pada Apache

Salah satu mesin yang ada dalam Vesta ada Apache, ini menjamin kompatibilitas dengan berbagai macam CMS dan tentunya adalah fitur rewrite. Silahkan tempatkan kode berikut dalam konfigurasi Apache, bisa di: <Directory>, <Location>, <Files>, <VirtualHost> dan tentunya dalam file .htaccess:

Header set Access-Control-Allow-Origin "*"

Pada Nginx

Bisa juga lewat Nginx dan memang lebih baik lewat sini karena biasanya berposisi didepan Apache sebagai reverse proxy atau pada versi terbaru Vesta digunakan langsung. Silahkan edit file /home/user/conf/web/nginx.conf dan tambahkan kode dibawah didalamnya:

location ~ \.(ttf|ttc|otf|eot|woff|woff2|font.css|css|js)$ {
           add_header Access-Control-Allow-Origin "*";
}

Untuk kedua cara diatas sangat disarankan merestart web server yang dimodifikasi konfigurasinya agar segera aktif. Tapi pilih salah satu saja lho metodenya, jangan keduanya dijalankan. Bisa tapi tidak diperlukan.

Semoga bermanfaat. 🙂

Tinggalkan komentar