Bagaimanakah Saya Boleh Mengakses Sumber dari Asal Berbeza Menggunakan Ambil Apabila `mode: 'no-cors'` Gagal?

Mencuba Menggunakan Ambil dengan mod: no-cors

Dalam artikel ini, kami akan menangani isu penggunaan fetch dengan mod: 'no-cors' dan teroka alternatif yang berdaya maju untuk melumpuhkan CORS.

Memahami Isu

Apabila cuba mengakses sumber daripada asal yang berbeza, seperti API luaran, penyemak imbas melaksanakan langkah keselamatan yang dikenali sebagai dasar asal yang sama. Dasar ini menghalang kod JavaScript daripada mengakses terus sumber daripada asal lain melainkan pelayan bertindak balas dengan pengepala CORS yang sesuai.

Apabila anda menghadapi ralat "Tiada pengepala 'Access-Control-Allow-Origin' pada sumber yang diminta ," ini bermakna pelayan yang anda cuba ambil data tidak membenarkan akses kepada sumbernya dari asal semasa anda.

Melumpuhkan CORS

Perlu ambil perhatian bahawa mod tetapan: 'no-cors' dalam permintaan pengambilan anda sebenarnya tidak melumpuhkan CORS. Sebaliknya, ia menghalang kod JavaScript bahagian hadapan anda daripada mengakses badan respons dan pengepala. Dalam kebanyakan kes, ini bukan perkara yang anda ingin lakukan.

Menggunakan Proksi CORS

Penyelesaian yang disyorkan ialah menggunakan proksi CORS. Proksi CORS bertindak sebagai perantara antara kod bahagian hadapan anda dan pelayan sasaran. Ia membuat permintaan kepada pelayan sasaran, menerima respons, menambah pengepala CORS yang diperlukan, dan kemudian menghantar semula respons yang diubah suai kepada kod bahagian hadapan anda. Ini membenarkan kod bahagian hadapan anda mengakses sumber tanpa melanggar dasar asal yang sama secara langsung.

Menggunakan Proksi CORS Anda Sendiri

Anda boleh menggunakan proksi CORS Anywhere anda sendiri dengan mudah mengikut langkah berikut:

1. Klon repositori CORS Anywhere: git clone https://github.com/Rob--W/cors-anywhere.git
2. Tukar kepada direktori cors-anywhere: cd cors-anywhere/
3. Pasang kebergantungan: npm install
4. Buat apl Heroku: heroku create
5. Tolak kod ke Heroku: git push heroku master

Selepas langkah ini, anda akan mempunyai pelayan CORS Anywhere anda sendiri yang dijalankan pada Heroku.

Menggunakan Proksi CORS

Untuk menggunakan proksi CORS anda , hanya awalan URL permintaan anda dengan URL proksi, contohnya:

https://cryptic-headland-94862.herokuapp.com/https://example.com

Dengan menggunakan proksi CORS, anda boleh memintas dasar asal yang sama dan mengakses sumber daripada asal yang berbeza dalam kod bahagian hadapan anda.

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Mengakses Sumber dari Asal Berbeza Menggunakan Ambil Apabila `mode: 'no-cors'` Gagal?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!