Cara menggunakan CORS dengan Nginx

Apa itu CORS

CORS, juga dikenal sebagai perkongsian sumber silang sumber adalah teknik yang digunakan dalam penyemak imbas web moden yang mengawal akses ke sumber yang dihoskan di pelayan web. CORS menggunakan tajuk tambahan seperti asal, akses-kawalan-asal, dan banyak lagi untuk menentukan sama ada sumber yang diminta mempunyai kebenaran untuk dihantar ke penyemak imbas. Tujuan utama CORS adalah untuk mencegah aplikasi web yang berjalan di penyemak imbas web dari mengakses sumber yang dihoskan dalam asal yang berbeda ketika tidak ada izin, apa artinya aplikasi web tidak dapat memuat turun sumber daya, seperti gambar, skrip, css seperti sebarang kandungan dll. apabila mereka tidak dihoskan dalam asal yang sama (biasanya semua harus berada dalam domain yang sama) dengan aplikasi web kecuali pelayan dikonfigurasi untuk membenarkan tingkah laku ini. Dengan pelaksanaan ini dalam penyemak imbas web, pengguna dapat melindungi data mereka dari pihak yang tidak sah. Seorang penggodam secara diam-diam dapat mengubah laman web sambil berada di tengah-tengah sambungan untuk mengganggu perniagaan pengguna atau mendapatkan akses ke data berharga. Walau bagaimanapun, terdapat kelebihan CORS juga, seperti yang membolehkan pemaju memuat sumber dari asal yang berbeza kerana keberkesanan kos, atau hanya kemudahan. Dalam hal ini mereka harus mengubah pelayan web mereka untuk mengizinkan permintaan tersebut. Artikel ini menunjukkan cara menyelesaikannya di pelayan web Nginx dengan mudah.

Apa yang Mencetuskan Permintaan CORS

Tidak semua permintaan memicu permintaan CORS seperti biasanya sumber daya dihoskan dalam asal yang sama dengan aplikasi web. Sekiranya berbeza, maka CORS dicetuskan. CORS mempunyai dua jenis permintaan, permintaan sederhana dan permintaan pra-penerbangan CORS.

Permintaan Sederhana berfungsi sebagai permintaan biasa, penyemak imbas web mengirimkan permintaan ke pelayan untuk mengunduh sumber tertentu ketika pengguna memulai, kemudian pelayan web memeriksa asal permintaan, membandingkannya dengan aturan di pelayan web, jika ada sepadan, sumber dibekalkan. Jenis permintaan ini menggunakan tajuk OIRIGN, dan ACCESS-CONTROL-ALLOW-ORIGIN untuk menentukan sama ada sumber tersebut harus dibekalkan atau tidak. Permintaan mudah hanya dicetuskan jika kaedah permintaan seperti GET, HEAD, POST digunakan, dan tajuk seperti Accept, Accept-Language, Content-Language, Content-Type, DPR, Downlink, Save-Data, Viewport-Width, Width digunakan. Walaupun begitu, tidak semua jenis kandungan memicu permintaan sederhana. Di sini hanya jenis pengekodan bentuk yang mencetuskan permintaan mudah.

Jenis permintaan pra-penerbangan agak berbeza kerana tidak ada akses langsung ke sumber pada pusingan pertama. Apabila keadaan di atas diubah entah bagaimana, baik dengan menggunakan tajuk permintaan yang berbeza atau jenis kandungan yang berbeza, permintaan Pra-penerbangan dipicu. Dalam permintaan Pra-penerbangan, penyemak imbas web terlebih dahulu memastikan dapat mengakses sumber dengan berkomunikasi dengan penyemak imbas web, kemudian ketika penyemak imbas web menjawab dengan respons baik-baik saja (HTTP 200), maka ia mengirimkan permintaan lain untuk memuat turun sumber. Ini menggunakan kaedah permintaan PILIHAN HTTP untuk memulai permintaan pertama, kemudian menggunakan GET, POST seperti jenis permintaan untuk memuat turun sumber.

Cara Mengkonfigurasi Nginx untuk Menyokong Permintaan CORS

Bahagian ini menunjukkan cara mengkonfigurasi pelayan web nginx untuk membolehkan perkongsian sumber silang. Ini hanya dapat dilakukan jika pembangun mempunyai akses ke pelayan web, kerana melibatkan pengubahsuaian fail konfigurasi Nginx.

Gunakan coretan kod mudah berikut untuk membenarkan permintaan CORS. Ini mesti disalin ke fail lalai perkhidmatan nginx di Ubuntu atau platform lain.

lokasi \
jika ($ request_method = 'OPTIONS')
add_header 'Access-Control-Allow-Origin' https: // localhost;
add_header 'Access-Control-Allow-Methods "POST, OPTIONS';
add_header 'Access-Control-Max-Age' 1728000;
add_header 'Content-Type "text / plain; charset = utf-8';
pulangan 204;

jika ($ request_method = 'POST')
add_header 'Access-Control-Allow-Origin "https: // localhost;
add_header 'Access-Control-Allow-Methods' 'POST';

Coretan kod asas seperti di atas. Ini berisi arahan seperti request_method, add_header untuk mengenal pasti jenis permintaan, dan mengatur tajuk respons untuk penyemak imbas dibaca masing-masing. Header Access-control-allow-origin menentukan asal sumber yang boleh diakses oleh sumber, misalnya jika aplikasi web yang dihoskan di github ingin mengakses gambar yang dihoskan di myOwnServer.com, maka URL github harus digunakan sebagai nilai arahan Access-control-allow-origin di myOwnServer.com, maka setiap kali aplikasi web yang dihoskan di github mengirimkan permintaan ke myOwnServer.com untuk memuat turun fail gambar, semua yang diminta ini diberi kebenaran. Header Access-control-allow-method mendefinisikan permintaan apa jenis aplikasi web yang mengirimkan permintaan yang disokong, kemudian header selebihnya adalah untuk usia maksimum untuk menyembunyikan permintaan, dan jenis kandungan yang disokong.

Seperti yang dijelaskan di atas, setelah permintaan PILIHAN selesai, penyemak imbas menghantar permintaan lain untuk memuat turun sumber daya jika permintaan pertama berhasil, tajuknya diatur dalam metode request_mode pertama jika tanda kurung.

Selain arahan di atas, terdapat beberapa arahan penting lain di Nginx yang boleh digunakan dalam permintaan CORS. Salah satu arahan yang paling penting adalah akses-kawalan-izin-tajuk, apa yang dilakukannya adalah menetapkan tajuk respons dengan nama tajuk yang dibenarkan untuk disemak oleh penyemak imbas. Aplikasi web boleh mempunyai header sendiri untuk pelbagai tujuan, dan jika header tersebut hadir dalam permintaan berikutnya setelah permintaan OPTIONS awal, maka semua header ini harus diizinkan oleh pelayan web sebelum sumber yang diminta untuk dibagikan.

Adalah penting bahawa coretan kod ini berada di tempat yang tepat dalam fail lalai Nginx, kerana Nginx melaksanakan blok lokasi yang berbeza bergantung pada URL yang sesuai, jika blok lokasi tersebut tidak mengandungi potongan kod ini, maka tidak akan dilaksanakan sama sekali, dan oleh itu penting untuk menggunakan ini di semua blok lokasi untuk bahagian yang selamat. Beberapa blok lokasi penting ialah Imej, PHP (~ \.php $), CSS, dll ... blok.

Setelah coretan kod di atas disimpan, simpan fail Nginx, dan muatkan semula perkhidmatan Nginx kepada perubahan yang akan berlaku.

Kesimpulannya

CORS, dikenali sebagai perkongsian sumber silang sumber, dan merupakan teknik untuk mengawal akses sumber. Sumber-sumber ini boleh berupa fail dari gambar ke fail javascript. Tujuan utama CORS adalah untuk memperketat keselamatan aplikasi web untuk mencegah manusia dari serangan tengah. Walau bagaimanapun, CORS juga boleh mempunyai faedah. Sekiranya demikian, CORS harus dihidupkan kerana tidak dibenarkan secara lalai. Jenis permintaan CORS asas adalah jenis permintaan mudah, ia hanya menggunakan arahan ORIGIN, dan ACCESS-CONTROL-ALLOW-ORIGIN, dan dengan bantuan itu Nginx dapat memberikan kebenaran kepada penyemak imbas web untuk mengakses sumber yang diminta bergantung pada asal. Sama ada cara CORS cukup berguna dan harus digunakan dengan berhati-hati.