Ainda não tem acesso? Estude com a gente! Matricule-se
Ainda não tem acesso? Estude com a gente! Matricule-se

Solucionado (ver solução)

Request bloqueado pelo CORS

Estou na parte de centralizar o resource no FotoService.js e após fazer a implementação de lista com sucesso estou enfrentado problemas com CORS na requisição de delete. Qualquer ajuda agradeço!

Seguem os códigos:

main.js:

//código omitido

Vue.http.options.root = 'http://localhost:3000';

//código omitido

Home.vue:


<script>
//código omitido

import FotoService from '../../domain/foto/FotoService';

export default {

 //código omitido

  methods: {

    remove(foto) {

      this.service
        .apaga(foto._id)
        .then(
          () => {
            let indice = this.fotos.indexOf(foto);
            this.fotos.splice(indice, 1);
            this.mensagem = 'Foto removida com sucesso'
          }, 
          err => {
            this.mensagem = 'Não foi possível remover a foto';
            console.log(err);
          }
        )
    }



  },

  created() {

    this.service = new FotoService(this.$resource);   


    this.service
      .lista()
      .then(fotos => this.fotos = fotos, err => console.log(err));
  }
}
</script>

//Código omitido

FotoService.js:

export default class FotoService {

    constructor (resource) {

        this._resource = resource('v1/fotos/{/id}');

    } 

    lista () {

        return this._resource
            .query()
            .then(res => res.json());
    }

    cadastra (foto){



    }

    apaga(id){

        return this._resource.delete({ id });
    }

}

Abaixo as mensagens de erro:

"Failed to load resource: the server responded with a status of 404 (Not Found)"

"Access to XMLHttpRequest at 'http://localhost:3000/v1/fotos//5oqIp6QBxoDhEvin' from origin 'http://localhost:8080' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: It does not have HTTP ok status."

1 resposta
solução

Oi Lucas tudo bem?

Como as duas aplicações estão em portas diferentes o navegador interpreta que são dois domínios diferentes e por isso dá erro de CORS.

Para isso coloque no seu servidor de backend nodejs essa módulo https://www.npmjs.com/package/cors aí configura ele e vai estar liberado o CORS.