javascript - habilitar - AngularJS: No hay un encabezado "Access-Control-Allow-Origin" en el recurso solicitado

falta la cabecera cors ''access-control-allow-origin'' angular 4

Question

Esta pregunta ya tiene una respuesta aquí:

• ¿Por qué mi JavaScript obtiene un error "No ''Access-Control-Allow-Origin'' en el recurso solicitado" cuando Postman no lo hace? 36 respuestas

Estoy escribiendo mi aplicación web y estoy usando AngularJS. En esta aplicación, he creado un archivo llamado script.js e informo este código:

var modulo = angular.module(''progetto'', [''ngRoute'']);

    // configure our routes
    modulo.config(function ($routeProvider, $httpProvider) {
        $routeProvider

            // route for the home page
            .when(''/'', {
                templateUrl: ''listaFilm.html'',
                controller: ''listaController''
            })

            // route for the description page
            .when(''/:phoneName'', {
                templateUrl: ''description.html'',
                controller: ''descriptionController''
            });


            $httpProvider.defaults.headers.common[''Access-Control-Allow-Origin''] = ''*'';

    });


    modulo.controller(''listaController'', function ($scope, $http) {
        $http.get(''https://api.getevents.co/event?&lat=41.904196&lng=12.465974'').success(function (data) {
            $scope.names = data;
            }).
            error(function (data, status) {
                $scope.names = "Request failed";
            });
    });

Con este código, llamo API siguiendo los principios RESTful. Cuando ejecuto el código, tengo este problema:

XMLHttpRequest no puede cargar https://api.getevents.co Ningún encabezado ''Access-Control-Allow-Origin'' está presente en el recurso solicitado. El origen '' http: // localhost: 8383 '' no está, por lo tanto, permitido.

Leyendo en la web entendí que tengo un problema llamado CORS ... He intentado varias soluciones propuestas pero no resolví el problema.
¿Cómo puedo solucionar el problema?
¿Cuál es el código que debo agregar para solucionarlo?

Answer 1

CORS es Cross Origin Resource Sharing, obtienes este error si estás tratando de acceder de un dominio a otro.

Intenta usar JSONP. En su caso, JSONP debería funcionar bien porque solo usa el método GET.

Pruebe algo como esto:

var url = "https://api.getevents.co/event?&lat=41.904196&lng=12.465974";
$http({
    method: ''JSONP'',
    url: url
}).
success(function(status) {
    //your code when success
}).
error(function(status) {
    //your code when fails
});

Answer 2

Este es un problema del lado del servidor. No necesita agregar ningún encabezado en angular para cors. Necesita agregar encabezado en el lado del servidor:

Access-Control-Allow-Headers: Content-Type
Access-Control-Allow-Methods: GET, POST, OPTIONS
Access-Control-Allow-Origin: *

Las primeras dos respuestas aquí: Cómo habilitar CORS en AngularJs