node.js - nodejs - res header('' access control allow origin*
No ''Access-Control-Allow-Origin''-Problema de puerto de nodo/Apache (10)
El código de respuesta solo permite localhost: 8888. Este código no se puede implementar en la producción, o un nombre de servidor y puerto diferente.
Para que funcione para todas las fuentes, usa esto en su lugar:
// 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();
});
He creado una pequeña API usando Node / Express y tratando de extraer datos usando Angularjs, pero como mi página html se ejecuta bajo apache en localhost: 8888 y la API del nodo se escucha en el puerto 3000, obtengo el No ''Access-Control- Permitir-Origen ''. Intenté usar node-http-proxy y Vhosts Apache pero no tuve mucho éxito, por favor vea el error completo y el código a continuación.
"XMLHttpRequest no puede cargar localhost: 3000. No hay un encabezado ''Access-Control-Allow-Origin'' presente en el recurso solicitado. Por lo tanto, el origen ''localhost: 8888'' no tiene acceso permitido."
// Api Using Node/Express
var express = require(''express'');
var app = express();
var contractors = [
{
"id": "1",
"name": "Joe Blogg",
"Weeks": 3,
"Photo": "1.png"
}
];
app.use(express.bodyParser());
app.get(''/'', function(req, res) {
res.json(contractors);
});
app.listen(process.env.PORT || 3000);
console.log(''Server is running on Port 3000'')
// Angular code
angular.module(''contractorsApp'', [])
.controller(''ContractorsCtrl'', function($scope, $http,$routeParams) {
$http.get(''localhost:3000'').success(function(data) {
$scope.contractors = data;
})
// HTML
<body ng-app="contractorsApp">
<div ng-controller="ContractorsCtrl">
<ul>
<li ng-repeat="person in contractors">{{person.name}}</li>
</ul>
</div>
</body>
Instala la dependencia de cors en tu proyecto:
npm i --save cors
Agregue a su archivo de configuración del servidor lo siguiente:
var cors = require(''cors'');
app.use(cors());
Funciona para mí con la versión 2.8.4 cors.
Intente agregar el siguiente middleware a su aplicación NodeJS / Express (he agregado algunos comentarios para su conveniencia):
// Add headers
app.use(function (req, res, next) {
// Website you wish to allow to connect
res.setHeader(''Access-Control-Allow-Origin'', ''http://localhost:8888'');
// 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();
});
¡Espero que ayude!
La mejor respuesta funcionó bien para mí, excepto que necesitaba agregar a la lista blanca más de un dominio.
Además, la respuesta principal se debe al hecho de que el middleware no maneja la solicitud de OPTIONS y no la recibe automáticamente.
allowed_origins dominios allowed_origins en la lista blanca como allowed_origins en los allowed_origins en la configuración Express y coloco el dominio correcto según el encabezado de origin ya que Access-Control-Allow-Origin no permite especificar más de un dominio.
Esto es lo que terminé con:
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);
});
La respuesta aceptada está bien, en caso de que prefiera algo más corto, puede usar un complemento llamado cors disponible para Express.js
Es fácil de usar, para este caso particular:
var cors = require(''cors'');
// use it before all route definitions
app.use(cors({origin: ''http://localhost:8888''}));
Otra forma, es simplemente agregar los encabezados a su ruta:
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:)'');
});
Puedes usar "$ http.jsonp"
O
A continuación se muestra el trabajo alrededor de Chrome para pruebas locales.
Necesitas abrir tu chrome con el siguiente comando. (Presione ventana + R)
Chrome.exe --allow-file-access-from-files
Nota: Tu cromo no debe estar abierto. Cuando ejecute este comando, Chrome se abrirá automáticamente.
Si ingresa este comando en el símbolo del sistema, seleccione su directorio de instalación de Chrome y luego use este comando.
Debajo del código de script para abrir chrome en MAC con "--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 &"
segundas opciones
Solo puede usar open(1) para agregar las banderas: open -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.
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();
}
});