Vorrei accedere all’API di Discourse con React.
Ricevo il seguente errore:
localhost/:1 L'accesso a XMLHttpRequest a 'https://community.oppkey.host/posts.json' dall'origine 'http://localhost:3000' è stato bloccato dalla policy CORS: nell'risorsa richiesta non è presente l'intestazione 'Access-Control-Allow-Origin'.
Queste sono le mie impostazioni delle origini CORS utilizzando il pannello di amministrazione di Discourse.
Sul server Discourse, ho quanto segue in /var/discourse/containers/app.yml
Questo è il modo in cui sto cercando di ottenere l’API di Discourse.
export const DiscoursePanel = () => {
const [ allData, updateData ] = useState([]);
useEffect(() => {
const apiEndPoint = 'https://community.oppkey.host/posts.json';
/* const apiEndPoint = 'https://jsonplaceholder.typicode.com/posts'; */
console.log("trying to get API on " + apiEndPoint);
axios
.get(apiEndPoint)
.then((res) => {
const currentData = res.data;
updateData(currentData);
console.log("got api");
console.log(currentData);
})
.catch((err) => console.log(err));
}, []);
Se uso un server esterno con dati fittizi, il codice React funziona.
Non capisco come funzionino generalmente CORS e React, quindi qualsiasi aiuto sarebbe apprezzato.
Ho fatto funzionare le cose con un server proxy API che ho scritto per inoltrare le chiamate API dal mio server Discourse a un altro server REST API che sto usando per connettermi a React. Sebbene questo funzioni, è lento. Vorrei inviare chiamate API direttamente da React agli endpoint dell’API di Discourse.
