Как правильно разрешить CORS при использовании приложения Angular использовать бэкэнд Rails?

Вот мой контроллер приложений приложений Rails:

class ApplicationController < ActionController::API
  before_filter :add_allow_credentials_headers

  def add_allow_credentials_headers
    response.headers['Access-Control-Allow-Origin'] = request.headers['Origin'] || '*'
    response.headers['Access-Control-Allow-Credentials'] = 'true'
  end
end

Это мой контроллер углового приложения, использующий службу $ http и настраиваемую фабрику:

'use strict';
angular.module('usausa', []).controller('obtainPovertyData',
  ['$scope', '$http', 'getPovertyData', function($scope, $http, getPovertyData) {
  getPovertyData.getPoverty().success(function(data){
    console.log("hi")
    console.log(data)
  }).error(function(error){
    console.log("hi1")
    console.log(error)
  })
}]);

Это моя фабрика getPovertyData:

'use strict';
var usausa = angular.module('usausa');
usausa.factory('getPovertyData', ['$http', function($http){
  return {
    getPoverty: function() {
      return $http.get('localhost:3000/api/v1/poverty/data')
    }
  }
}])

Прямо сейчас моя конечная точка рельсов находится только на localhost: 3000. Мое угловое приложение работает на localhost: 5555. Я использую Chrome. По какой-то причине, когда я запускаю свое угловое приложение и посещаю свой index.html, я вижу это в своей консоли:

XMLHttpRequest не может загрузить localhost: 3000/api/v1/нищета/данные. Запросы на кросс-начало поддерживаются только для схем протокола: http, data, chrome, chrome-extension, https, chrome-extension-resource.

Почему это происходит? Я думал, что я решил эту проблему, когда я разрешил запрос приехать из любого источника?