Apa tanggapan yang tidak jelas, dan apa tujuannya?

172

Saya mencoba fetchURL situs web lama, dan terjadi kesalahan:

Fetch API cannot load http://xyz.
No 'Access-Control-Allow-Origin' header is present on the requested resource.
Origin 'http://abc' is therefore not allowed access.
If an opaque response serves your needs, set the request's mode to 'no-cors'
to fetch the resource with CORS disabled.

Saya mengerti pesannya, dan mencoba melakukan permintaan yang mengembalikan respons buram:

fetch("http://xyz", {'mode': 'no-cors'})

Ok, sekarang berfungsi ... tapi saya tidak bisa membacanya. = \

Apa tujuan dari tanggapan yang tidak jelas itu?

Miguel Angelo
sumber

Jawaban:

149

Pertimbangkan kasus di mana seorang pekerja layanan bertindak sebagai cache agnostik. Satu-satunya tujuan Anda adalah melayani sumber daya yang sama dengan yang Anda dapatkan dari jaringan, tetapi lebih cepat. Tentu saja Anda tidak dapat memastikan semua sumber daya akan menjadi bagian dari asal Anda (pertimbangkan perpustakaan yang dilayani dari CDNs, misalnya). Karena pekerja layanan berpotensi mengubah respons jaringan, Anda perlu memastikan bahwa Anda tidak tertarik pada konten respons, atau pada headernya, atau bahkan pada hasilnya. Anda hanya tertarik pada respons sebagai kotak hitam untuk kemungkinan menyimpannya dan menyajikannya lebih cepat.

Ini { mode: 'no-cors' }dibuat untuk apa.

Salva
sumber
2
Tetapi Status codeselalu 0, bagaimana cara mengecek apakah itu berhasil jika status is never 200?
Angshuman Agarwal
3
Kamu tidak bisa. Itu adalah bagian dari blackbox .
Salva
67

Respons buram tidak dapat diakses oleh JavaScript, tetapi Anda masih bisa men-cache-nya dengan API Cache dan menanggapinya dalam fetchevent handler di pekerja layanan. Jadi mereka berguna untuk membuat aplikasi Anda offline, juga untuk sumber daya yang tidak dapat Anda kontrol (mis. Sumber daya pada CDN yang tidak mengatur header CORS).

Marco
sumber
1

Ada juga solusi untuk aplikasi Node JS. CORS Anywhere adalah proxy NodeJS yang menambahkan header CORS ke permintaan yang diproksi.

Url ke proksi secara harfiah diambil dari jalur, divalidasi dan diproksi. Bagian protokol dari URI yang diproksi adalah opsional, dan standarnya adalah "http". Jika port 443 ditentukan, protokol default ke "https".

Paket ini tidak membatasi metode http atau header, kecuali untuk cookie. Meminta kredensial pengguna tidak diizinkan. Aplikasi ini dapat dikonfigurasikan untuk memerlukan tajuk untuk memproxy permintaan, misalnya untuk menghindari kunjungan langsung dari browser. https://robwu.nl/cors-anywhere.html

NinjaG
sumber
-2

javascript agak sulit untuk mendapatkan jawabannya, saya memperbaikinya dengan mengambil api dari backend dan kemudian memanggilnya ke frontend.

public function get_typechange () {

    $ url = "https://........";
    $ json = file_get_contents ($url);
    $ data = json_decode ($ json, true);
    $ resp = json_encode ($data);
    $ error = json_last_error_msg ();
    return $ resp;

}
Marcos Chacaliaza Altamirano
sumber