Saya sudah menemukan ini yang sudah membantu saya, tetapi setelah menambahkan header seperti ini di proxy.js saya:
const proxy = require('http-proxy-middleware');
module.exports = function(app) {
app.use(function(req, res, next) {
//adding headers to allow CORS
res.header("Access-Control-Allow-Origin", "*");
res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
next();
});
app.use(proxy('/api', { target: 'http://localhost:8080' }));
}
Di ambil() saya juga menambahkan header untuk memastikannya berfungsi:
fetch('http://localhost:8080/api',{
headers:{
'Access-Control-Allow-Origin':'*'
},
})
.then(res => res.json())
.then((data) => {
this.setState({ contacts: data })
})
.catch(console.log)
}
Saya masih mendapatkan kesalahan: TypeError: "NetworkError ketika mencoba mengambil sumber daya."
this.setState({ contacts: data }) harus menyimpan Objek JSON yang dikirimkan oleh Program Java Backend saya. Objek JSON ada di localhost:8080/api dan hanya berupa String
React Frontend saya berjalan di localhost:3000
Header Respons terlihat seperti ini
Di mana saya memerlukan tajuk ini agar tidak mendapatkan kesalahan CORS, lebih baik saya ingin bekerja tanpa perpustakaan npm "cors", atau add-on browser apa pun. Saya juga harus mengganti '*' dengan localhost:8080 Kalau tidak salah kan? Tujuan akhir saya adalah menempatkan String ini dalam Komponen PrimeReact (Tabel) secara dinamis.
Sunting: Pesan kesalahan lengkap diminta oleh sideshowbarker:
Peringatan:
Permintaan lintas asal diblokir: Aturan sumber yang sama melarang membaca sumber daya eksternal di http://localhost:8080/api. (alasan: saluran preflight CORS tidak berhasil).
Peringatan:
Permintaan lintas asal diblokir: Aturan sumber yang sama melarang membaca sumber daya eksternal di http://localhost:8080/api. (Alasan: saluran preflight CORS gagal).
KESALAHAN:
TypeError: "NetworkError saat mencoba mengambil sumber daya.
//Ini dalam bahasa Jerman jadi saya tidak bisa mengunggah tangkapan layar, menerjemahkannya. Saya lupa menyebutkan bahwa saya juga memasang @CrossOrigin di Restcontroller saya
