Come abilitare la richiesta cors con angular.js-resource

Question

Ho un'applicazione angular.js e devo fare richiesta CORS.

Desidero definire i miei servizi di riposo "l'angolare" utilizzando le risorse angolari, descritti qui: http://docs.angularjs.org/tutorial/step_11.

Ma non ho trovato un modo per farlo funzionare. Su google ho trovato il seguente codice di esempio: http://jsfiddle.net/ricardohbin/E3YEt/, ma questo sembra non funzionare con le risorse angolari.

questo è il mio app.js

'use strict'; 

angular.module('corsClientAngularApp', ['helloServices']) 
    .config(function ($routeProvider) { 
    $routeProvider 
     .when('/', { 
     templateUrl: 'views/main.html', 
     controller: 'MainCtrl' 
     }) 
     .otherwise({ 
     redirectTo: '/' 
     }); 
    }); 

questo è il mio services.js con i servizi di riposo

angular.module('helloServices', ['ngResource']). 
    factory('Hello', function($resource){ 
    return $resource('http://localhost:8080/cors-server/hello/:name', {}, { 
    query: {method:'GET', params:{name:'name'}, isArray:false} 
    }); 
}); 

Questo è il mio main.js con il controller con il $ http, questo funziona !:

'use strict'; 

angular.module('corsClientAngularApp') 
    .controller('MainCtrl', function ($scope, $http, Hello) { 
    $http.defaults.useXDomain = true; 


    $http.get('http://localhost:8080/cors-server/hello/stijn') 
     .success(function(data) { 
      $scope.hello = data; 
     }); 
    }); 

Questa è un'altra versione del mio main.js che utilizza risorse angolari. Questo non funziona :(

'use strict'; 

angular.module('corsClientAngularApp') 
    .controller('MainCtrl', function ($scope, $http, Hello) { 
    $http.defaults.useXDomain = true; 
    $scope.hello = Hello.query({name:'stijn'}); 
    }); 

Questo è sono le intestazioni dalla richiesta di lavoro (da devtools cromo):

Request URL:http://localhost:8080/cors-server/hello/stijn 
Request Method:OPTIONS 
Status Code:200 OK 

Request Headers 
Accept:*/* 
Accept-Charset:ISO-8859-1,utf-8;q=0.7,*;q=0.3 
Accept-Encoding:gzip,deflate,sdch 
Accept-Language:nl-NL,nl;q=0.8,en-US;q=0.6,en;q=0.4 
Access-Control-Request-Headers:accept, origin, x-requested-with 
Access-Control-Request-Method:GET 
Cache-Control:max-age=0 
Connection:keep-alive 
Host:localhost:8080 
Origin:http://localhost:9000 
Referer:http://localhost:9000/ 
User-Agent:Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.31 (KHTML, like Gecko) Chrome/26.0.1410.64 Safari/537.31 

Response Headers 
Access-Control-Allow-Headers:accept, origin, x-requested-with 
Access-Control-Allow-Methods:GET 
Access-Control-Allow-Origin:* 
Content-Length:0 
Date:Thu, 25 Apr 2013 10:42:34 GMT 
Server:Apache-Coyote/1.1 

e queste sono le intestazioni dalla richiesta non funziona:

Request URL:http://localhost/cors-server/hello/stijn 
Request Method:OPTIONS 
Status Code:200 OK 

Request Headers 
Accept:*/* 
Accept-Charset:ISO-8859-1,utf-8;q=0.7,*;q=0.3 
Accept-Encoding:gzip,deflate,sdch 
Accept-Language:nl-NL,nl;q=0.8,en-US;q=0.6,en;q=0.4 
Access-Control-Request-Headers:accept, origin, x-requested-with 
Access-Control-Request-Method:GET 
Cache-Control:max-age=0 
Connection:keep-alive 
Host:localhost 
Origin:http://localhost:9000 
Referer:http://localhost:9000/ 
User-Agent:Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.31 (KHTML, like Gecko) Chrome/26.0.1410.64 Safari/537.31 


Response Headers 
Allow:GET,HEAD,POST,OPTIONS,TRACE 
Connection:Keep-Alive 
Content-Length:0 
Content-Type:text/plain 
Date:Thu, 25 Apr 2013 10:41:12 GMT 
Keep-Alive:timeout=5, max=100 
Server:Apache/2.2.22 (Win32) 

Sembra che l'url della richiesta sia errato quando si utilizzano le risorse angolari, ma perché?

Grazie S!

Answer 1

L'URL per $resource accetta l'utilizzo dei due punti per i parametri. Pertanto quando si utilizza la porta in url è necessario sfuggire ai due punti per la porta. Questo è spiegato in $resource docs