ruby-on-rails - Angular $http.get 无法从 Rails 获取 json respond_to (无需调整 header )？

Question

我在 Rails 应用程序上使用 AngularJS。我想制作一个对服务器端数据进行分页的搜索表单。

这是我的表格:

<input type="text" class="search-query" placeholder="Search Products" ng-model="search_terms" />

我的 Rails Controller 接受 json 或 html 请求:

def index
  # ....
  respond_to do |format|
    format.json {
      # ...
    }
    format.html {
      # ...
    }
  end
end

这是我的 Angular Controller 。由于某种原因，$http 服务只能获取 Rails 默认 html 响应，而不能获取 json 响应。

$scope.$watch('search_terms',function(newValue,oldValue){
  var query = newValue;

  $http.get('/products',{params:{search_terms:query}, responseType:'json'}).success(function(data) {
  // do something
  });

});

如果我使用这个 jQuery.get，我确实会得到所需的 json 响应，那么为什么 Angular 会给我 html？

  jQuery.get('/products',{search_terms:query},function(data){
     console.log(data);
  }, 'json')

我检查了网络 header ，Angular 调用和 jQuery 调用之间的主要区别是 Angular 没有将 X-Requested-With header 设置为“XMLHttpRequest”？

如果我添加它，那么我就可以让它工作。

 $http.get('/products',{params:{search_terms:query}, responseType:'json', 'headers':{'X-Requested-With':'XMLHttpRequest'}}).success(function(data) {
  // do something
  });

但是作为 Angular 新手，我不知道这是否是解决此问题的正确方法。每次都必须这样做，感觉有点笨拙。有没有更好的方法，或者如果使用 Angular 和 Rails，这就是你的做法？

Answer 1

我遇到了同样的事情并对此感到沮丧。我的第一个解决方案有点逃避，我最终选择了这个 gem :

https://github.com/FineLinePrototyping/angularjs-rails-resource

但是在有了更多经验之后，我发现这与 Angular 没有设置正确的标题有关。

angular.module('yourmodule').run(['$http', function($http) {
  $http.defaults.headers.common['Accept'] = 'application/json';
  $http.defaults.headers.common['Content-Type'] = 'application/json';
}]);

引用:http://angulartutorial.blogspot.com/2014/05/set-headers-for-all-http-calls-in.html

请记住 request.xhr 也存在这种情况

https://github.com/rails/rails/issues/16444