Origine <origin> n'est pas autorisé par Access-Control-Allow-Origin

Question

XMLHttpRequest cannot load http://localhost:8080/api/test. Origin http://localhost:3000 is not allowed by Access-Control-Allow-Origin. 

J'ai lu des articles sur les requêtes ajax inter-domaines, et je comprends le problème de sécurité sous-jacent. Dans mon cas, deux serveurs fonctionnent localement, et j'aimerais activer les requêtes interdomaines pendant les tests.

localhost:8080 - Google Appengine dev server
localhost:3000 - Node.js server

J'envoie une requête ajax à localhost:8080 - GAE server pendant que ma page est chargée depuis le serveur du noeud. Quelle est la solution la plus simple et la plus sûre (je ne veux pas démarrer chrome avec un système de gestion de l'information) ? disable-web-security option). Si je dois changer 'Content-Type' dois-je le faire au niveau du serveur de nœuds ? Comment ?

Answer 1

Utiliser dataType : 'jsonp', cela fonctionne pour moi.

   async function get_ajax_data(){

       var _reprojected_lat_lng = await $.ajax({

                                type: 'GET',

                                dataType: 'jsonp',

                                data: {},

                                url: _reprojection_url,

                                error: function (jqXHR, textStatus, errorThrown) {

                                    console.log(jqXHR)

                                },

                                success: function (data) {

                                    console.log(data);

                                    // note: data is already json type, you just specify dataType: jsonp

                                    return data;

                                }

                            });

 } // function

Answer 2

Si vous utilisez express,

var express = require('express')
var cors = require('cors')
var app = express()
app.use(cors())

Si vous utilisez app.use(express.json()); dans votre fichier serveur pour analyser les requêtes entrantes avec des charges utiles JSON et est basé sur body-parser, gardez à l'esprit de l'utiliser après avoir utilisé app.use(cors()) ligne de code. Sinon, des problèmes de sécurité peuvent survenir. CORS

Answer 3

Si vous êtes dans Google Chrome, essayez d'installer ce module complémentaire :

https://chrome.google.com/webstore/detail/allow-control-allow-origi/nlfbmbojpeacfghkpbjhddihlkkiljbi/related