Saya memiliki proyek reaksi yang membuat panggilan ke Deezer API untuk mendapatkan beberapa informasi musik. tidak ada header cors pada respons server. jadi gunakan proxy untuk membuat permintaan ke deezer api.i telah menyiapkan proxy saya di package.json -

 "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "predeploy":"npm run build",
    "deploy":"gh-pages -d build"
  },
  "proxy": "https://api.deezer.com",

Saya membuat panggilan API sebagai berikut -

 searchSongs= async ()=>{
         if(this.state.searchinput.length>2){
    const res = await fetch(`/search?q=${this.state.searchinput}`)
     const data = await res.json();
     console.log(data);
     this.setState({
       data:data.data
     },()=>{this.props.passSearchData(this.state.data)})
    }

Ini berfungsi dengan baik di localhost tetapi di github saya mendapatkan ini di konsol dan juga permintaan tidak dibuat -

DAPATKAN https://prabhjot2002.github.io/api/search?q=mankirat 404 VM39: 1 Tidak tertangkap (dalam janji) SyntaxError: Token tak terduga < di JSON pada posisi 0

https://prabhjot2002.github.io/musicplay/ - ini adalah tautan ke proyek yang saya terapkan di github.

URL tempat saya ingin membuat permintaan adalah - https://api.deezer.com/search?query={music nama }

Saya tidak punya banyak pengalaman dalam membangun proyek reaksi, saya baru belajar, tolong bantu saya, terima kasih sebelumnya.

1
Prabh Singh 12 Mei 2021, 19:04

1 menjawab

Jawaban Terbaik

Proxy hanya dimaksudkan untuk bekerja di dev (lokal), dalam kasus Anda, Anda dapat secara eksplisit menambahkan basis url ke titik akhir untuk menyelesaikan masalah.

                         //add this section directly here
const res = await fetch(`https://api.deezer.com/search?q=${this.state.searchinput}`)

Ini akan membuat panggilan akan menuju ke titik akhir API yang benar.

Proxy hanya berguna ketika url dasar berbeda di lingkungan lokal dan lingkungan yang diterapkan.

0
Shmili Breuer 12 Mei 2021, 16:27