Stefan Horochovec
Possuo 20 anos de experiência no desenvolvimento de soluções web. Nos últimos 10 anos tenho atuado como Arquiteto de Soluções auxiliando empresas a desenvolver projetos para nuvem com um grande foco em Java EE como tecnologia voltada ao backend, Angular e React voltada ao frontend e Flutter voltado ao desenvolvimento móvel. Com relação a plataformas na nuvem, atuo com projetos consumindo serviços da AWS, Azure, e GCP.

Habilitar CORS via BrowserSync

Olá pessoal,

Uma dúvida bastante comum é como habilitar o CORS quando utilizamos o BrowserSync em ambiente de desenvolvimento de Web Apps ou em Hybrid Mobile Apps.

Bom, quando estamos trabalhando com uma API que não possui a implementação de CORS, ao tentarmos fazer um request na API, utilizando Ajax, recebemos o seguinte erro:

No ‘Access-Control-Allow-Origin’ header is present on the requested resource

Esse erro é bastante chato e atrapalha nosso trabalho. Para contornar essa situação, podemos habilitar no BrowserSync uma forma de alterar o Header das nossas request, conforme exemplo abaixo:

module.exports = function(gulp, $) {
gulp.task('browserSync', function () {
$.browserSync.init({
open: 'external',
host: '0.0.0.0',
server: {
baseDir: "/src",
middleware: function (req, res, next) {
res.setHeader('Access-Control-Allow-Origin', '*');
next();
}
}
});
});
};

Bom, a dica era essa, espero ter ajudado!

Um abraço

Share

You may also like...

Deixe uma resposta

O seu endereço de e-mail não será publicado. Campos obrigatórios são marcados com *