Bonjour à tous je voudrait faire un moteur de recherche avec React mais j'ai l'erreur suivante dan la console :
Blocage d’une requête multiorigines (Cross-Origin Request) : la politique « Same Origin » ne permet pas de consulter la ressource distante située sur http://essai/mr/fetch.php?q=p. Raison : l’en-tête CORS « Access-Control-Allow-Origin » est manquant. Code d’état : 200.
Sur une
J'adresse http://essai/mr/fetch.php est bien présente mais je ne sait pas comment configuré le Access-Control-Allow-Origin .
Voici mon App.js
import React from 'react'
import Turnstone from 'turnstone'
const styles = {
input: 'border p-2 bg-white w-full',
listbox: 'border p-2 bg-white w-full'
}
// Set up listbox contents.
const listbox = {
data: (query) =>
fetch(http://essai/mr/fetch.php?q=${encodeURIComponent(query)}
)
.then(res => res.json())
}
export default function BasicExample() {
return <Turnstone id="autocomplete" listbox={listbox} styles={styles} typeahead={false} />
}
Cela fonctionne avec l'adresse https://run.mocky.io/v3/aed33019-118c-406d-9562-55cbb69d85b2?q=
Cordialement
Hello :)
Alors le problème ne vient pas de ton coté, mais du coté de http://essai/mr/fetch.php qui doit autoriser le fettch en ajoutant
Access-Control-Allow-Origin: TON_SITE_QUI_FAIT_LE_FETCH
Merci de ton aide,
Je suis en local ppur le moment, donc je met
Access-Control-Allow-Origin: http://localhost:3000/
au php de l'adresse http://essai/mr/fetch.php ?
yep c'est ça et après ça devrait passer et l'autorisation faut pas le mettre dans localhost mais dans le site essai
Grafikart a fait un tutoriel pour comprendre CORS : https://grafikart.fr/tutoriels/cors-http-navigateur-1180
Merci, ca à l'ai d'estre réglé mais mon moteur de recherche fonctionne toujours pas. Il y a donc une autre erreur !