Blocage d’une requête multiorigines Cross-Origin

Par Frédouze, il y a 3 ans


Javascript React

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

5 réponses

popotte, il y a 3 ans

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

popotte, il y a 3 ans

yep c'est ça et après ça devrait passer et l'autorisation faut pas le mettre dans localhost mais dans le site essai

Frédouze, il y a 3 ans

Merci, ca à l'ai d'estre réglé mais mon moteur de recherche fonctionne toujours pas. Il y a donc une autre erreur !