javascript - the - instalar grunt en windows

Grunt connect task y middleware Access-Control-Allow-Origin

Question

Me gustaría permitir el acceso a las llamadas de origen cruzadas, que necesito para poder realizar las llamadas de API restantes al servidor.

Mi tarea de conectar grunt está configurada de la siguiente manera:

 connect: {
options: {
port: 9000,
// Change this to ''0.0.0.0'' to access the server from outside.
hostname: ''localhost'',
livereload: 35729,
middleware: function(connect, options, next) {
return [
function(req, res, next) {
res.setHeader(''Access-Control-Allow-Origin'', ''*'');
res.setHeader(''Access-Control-Allow-Methods'', ''GET,PUT,POST,DELETE'');
res.setHeader(''Access-Control-Allow-Headers'', ''Content-Type'');
next();
}
];
}
},
},

Cuando ejecuto el servidor de grunt Obtuve Cannot GET / . Sin la configuración de middleware, la aplicación está funcionando y el archivo de índice está cargado correctamente.

¿Podrías guiarme hacia lo que estoy haciendo mal o perdiendo?

Algunos detalles más sobre mi archivo gruñido es que estoy usando la aplicación de semilla angular yeoman como mi base para la aplicación.

Answer 1

Grunt connect viene con varios middlewares, almacenados como funciones en una matriz. Cuando configura el middleware devolviendo una matriz, anula el middleware existente responsable del servicio de sus páginas.

Saliendo del comentario de ansorensen de la documentación, https://github.com/gruntjs/grunt-contrib-connect#middleware siendo la sección relevante.

options: {
middleware: function(connect, options, middlewares) {
// inject a custom middleware into the array of default middlewares
middlewares.unshift(function(req, res, next) {
if (req.url !== ''/hello/world'') return next();
res.end(''Hello, world from port #'' + options.port + ''!'');
});
return middlewares;
},
},

El middleware anterior en la matriz tiene efecto antes de los posteriores en la matriz.

Entonces, lo que querrías es

connect: {
options: {
port: 9000,
// Change this to ''0.0.0.0'' to access the server from outside.
hostname: ''localhost'',
livereload: 35729,
// remove next from params
middleware: function(connect, options, middlewares) {
middlewares.unshift(function(req, res, next) {
res.setHeader(''Access-Control-Allow-Origin'', ''*'');
res.setHeader(''Access-Control-Allow-Methods'', ''GET,PUT,POST,DELETE'');
res.setHeader(''Access-Control-Allow-Headers'', ''Content-Type'');
return next();
});
return middlewares;
}
},
},

Answer 2

Nod to bpaul, quien me puso en el camino para corregir la respuesta. El formato de una respuesta a una pregunta similar funcionará aquí.

Reemplace ''next'' con middlewares, e inserte su función anónima en la matriz de middleware antes de devolverla:

middleware: function(connect, options, middlewares) {
middlewares.unshift(function(req, res, next) {
res.setHeader(''Access-Control-Allow-Credentials'', true);
res.setHeader("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
res.setHeader(''Access-Control-Allow-Methods'', ''GET,PUT,POST,DELETE,OPTIONS'');
next();
});
return middlewares;
}

Answer 3

Pruebe algo como esto:

connect: {
options: {
port: 9000,
// Change this to ''0.0.0.0'' to access the server from outside.
hostname: ''localhost'',
livereload: 35729,
// remove next from params
middleware: function(connect, options) {
return [
function(req, res, next) {
res.setHeader(''Access-Control-Allow-Origin'', ''*'');
res.setHeader(''Access-Control-Allow-Methods'', ''GET,PUT,POST,DELETE'');
res.setHeader(''Access-Control-Allow-Headers'', ''Content-Type'');
// don''t just call next() return it
return next();
},
// add other middlewares here
connect.static(require(''path'').resolve(''.''))
];
}
},
},

Answer 4

connect: {
options: {
port: 9000,
// Change this to ''0.0.0.0'' to access the server from outside.
hostname: ''localhost'',
livereload: 35729,
middleware: function(connect, options, next) {
return [
function(req, res, next) {
res.header(''Access-Control-Allow-Credentials'', true);
res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
res.header(''Access-Control-Allow-Methods'', ''GET,PUT,POST,DELETE,OPTIONS'');
next();
}];
}
};

esto lo ayudará a obtener la llamada get Control-Permitir-Credenciales