Pas De Problème De Port' Access-Control-Allow-Origin ' - Node / Apache

Accepté la réponse est bien, dans le cas où vous préférez quelque chose de plus court, vous pouvez utiliser un plugin appelé cors disponible pour les Exprimer.js

C'est simple à utiliser, pour ce cas particulier:

var cors = require('cors');

// use it before all route definitions
app.use(cors({origin: 'http://localhost:8888'}));

une autre façon, c'est simplement ajouter les en-têtes à votre itinéraire:

router.get('/', function(req, res) {
    res.setHeader('Access-Control-Allow-Origin', '*');
    res.setHeader('Access-Control-Allow-Methods', 'GET, POST, OPTIONS, PUT, PATCH, DELETE'); // If needed
    res.setHeader('Access-Control-Allow-Headers', 'X-Requested-With,content-type'); // If needed
    res.setHeader('Access-Control-Allow-Credentials', true); // If needed

    res.send('cors problem fixed:)');
});

Le réponse sommet a bien fonctionné pour moi, sauf que j'ai besoin de la liste blanche plus d'un domaine.

aussi, top answer souffre du fait que la demande OPTIONS n'est pas traitée par middleware et que vous ne l'obtenez pas automatiquement.

je stocke des domaines sur liste blanche comme allowed_origins en configuration Express et je mets le bon domaine selon origin en-tête car Access-Control-Allow-Origin ne permet pas de spécifier plus d'un seul domaine.

voilà ce que j'ai fini par dire:

var _ = require('underscore');

function allowCrossDomain(req, res, next) {
  res.setHeader('Access-Control-Allow-Methods', 'GET, POST, OPTIONS');

  var origin = req.headers.origin;
  if (_.contains(app.get('allowed_origins'), origin)) {
    res.setHeader('Access-Control-Allow-Origin', origin);
  }

  if (req.method === 'OPTIONS') {
    res.send(200);
  } else {
    next();
  }
}

app.configure(function () {
  app.use(express.logger());
  app.use(express.bodyParser());
  app.use(allowCrossDomain);
});

le code de réponse permet seulement de localhost:8888. Ce code ne peut pas être déployé dans la production, ou un autre nom de serveur et de port.

pour obtenir le fonctionnement pour toutes les sources, utilisez ceci à la place:

// Add headers
app.use(function (req, res, next) {

    // Website you wish to allow to connect
    res.setHeader('Access-Control-Allow-Origin', '*');

    // Request methods you wish to allow
    res.setHeader('Access-Control-Allow-Methods', 'GET, POST, OPTIONS, PUT, PATCH, DELETE');

    // Request headers you wish to allow
    res.setHeader('Access-Control-Allow-Headers', 'X-Requested-With,content-type');

    // Set to true if you need the website to include cookies in the requests sent
    // to the API (e.g. in case you use sessions)
    res.setHeader('Access-Control-Allow-Credentials', true);

    // Pass to next layer of middleware
    next();
});

installer la dépendance cors dans votre projet:

npm i --save cors

ajoutez à votre fichier de configuration de serveur ce qui suit:

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

il fonctionne pour moi avec 2.8.4 version cors.

app.all('*', function(req, res,next) {
    /**
     * Response settings
     * @type {Object}
     */
    var responseSettings = {
        "AccessControlAllowOrigin": req.headers.origin,
        "AccessControlAllowHeaders": "Content-Type,X-CSRF-Token, X-Requested-With, Accept, Accept-Version, Content-Length, Content-MD5,  Date, X-Api-Version, X-File-Name",
        "AccessControlAllowMethods": "POST, GET, PUT, DELETE, OPTIONS",
        "AccessControlAllowCredentials": true
    };

    /**
     * Headers
     */
    res.header("Access-Control-Allow-Credentials", responseSettings.AccessControlAllowCredentials);
    res.header("Access-Control-Allow-Origin",  responseSettings.AccessControlAllowOrigin);
    res.header("Access-Control-Allow-Headers", (req.headers['access-control-request-headers']) ? req.headers['access-control-request-headers'] : "x-requested-with");
    res.header("Access-Control-Allow-Methods", (req.headers['access-control-request-method']) ? req.headers['access-control-request-method'] : responseSettings.AccessControlAllowMethods);

    if ('OPTIONS' == req.method) {
        res.send(200);
    }
    else {
        next();
    }


});

vous pouvez utiliser" $http.jsonp"

ou

ci-dessous est le travail autour de chrome pour les tests locaux

vous devez ouvrir votre chrome avec la commande suivante. (Appuyez sur la fenêtre+R)

Chrome.exe --allow-file-access-from-files

Note: Votre chrome ne doit pas être ouvert. Lorsque vous exécutez cette commande chrome s'ouvre automatiquement.

Si vous entrez cette commande dans l'invite de commande, puis sélectionnez votre chrome répertoire d'installation alors utilisez cette commande.

ci-dessous code de script pour ouvrir chrome dans MAC avec "--allow-file-access - from-files "

set chromePath to POSIX path of "/Applications/Google Chrome.app/Contents/MacOS/Google Chrome" 
set switch to " --allow-file-access-from-files"
do shell script (quoted form of chromePath) & switch & " > /dev/null 2>&1 &"

options de seconde

vous pouvez juste utiliser ouvrir (1) pour ajouter les drapeaux: ouvrir -a 'Google Chrome' --args --allow-file-access-from-files

//Add following code in app.js of NODEJ Restful api to avoid "Access-Control-Allow-Origin" error in angular 6 or any other framework

var express = require('express');
var app = express();

var cors = require('cors');
var bodyParser = require('body-parser');

//enables cors
app.use(cors({
  'allowedHeaders': ['sessionId', 'Content-Type'],
  'exposedHeaders': ['sessionId'],
  'origin': '*',
  'methods': 'GET,HEAD,PUT,PATCH,POST,DELETE',
  'preflightContinue': false
}));

/**
 * Allow cross origin to access our /public directory from any site.
 * Make sure this header option is defined before defining of static path to /public directory
 */
expressApp.use('/public',function(req, res, next) {
    res.setHeader("Access-Control-Allow-Origin", "*");
    // Request headers you wish to allow
    res.setHeader("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
    // Set to true if you need the website to include cookies in the requests sent
    res.setHeader('Access-Control-Allow-Credentials', true);
    // Pass to next layer of middleware
    next();
});


/**
 * Server is about set up. Now track for css/js/images request from the 
 * browser directly. Send static resources from "./public" directory. 
 */
expressApp.use('/public', express.static(path.join(__dirname, 'public')));

If you want to set Access-Control-Allow-Origin to a specific static directory you can set the following.