AngularJS& Cordova $ http问题 - 浏览器工作正常,应用程序没有

时间:2017-08-24 20:50:32

标签: ruby-on-rails angularjs cordova http cors

我正在使用AngularJS编写一个使用Rails API的Phonegap / Cordova应用程序。我正在尝试使用$http在登录事件期间点击API。在Chrome上模拟我的应用程序时(使用cordova run启动)$ http可以正常运行。

但是,无论何时我在实际的PhoneGap开发者应用程序上使用$http,它都会出错并且永远不会触及API。 Rails API使用gem rack-cors来允许CORS - 它可以与其他几个AngularJS应用程序一起使用,并且只是出于调试目的而相对不安全。

# config/application.rb

CORS_ALLOW_ORIGIN  = "*"
CORS_ALLOW_METHODS = %w{GET POST PUT OPTIONS DELETE}.join(',')
CORS_ALLOW_HEADERS = %w{Content-Type Accept X-Auth-Token AllowedHeader}.join(',')

... other config stuff ...

config.middleware.insert_before 0, Rack::Cors do
  allow do
    origins '*'
    resource '*', :headers => :any, :methods => :any
  end
end

config.action_dispatch.default_headers = {
  "Access-Control-Allow-Origin"  => CORS_ALLOW_ORIGIN,
  "Access-Control-Allow-Methods" => CORS_ALLOW_METHODS,
  "Access-Control-Allow-Headers" => CORS_ALLOW_HEADERS
}

我尝试过的:  1)更新phonegap config.xml以不安全地允许任何访问

<access origin='*' 
        allows-arbitrary-loads-in-media='true' 
        allows-arbitrary-loads-in-web-content='true' 
        allows-local-networking='true' />
<allow-intent href="*" />
<allow-navigation href="*" />

2)使用angular .run为每个请求添加标头

angular.module("services")

.run(function($http) {
  $http.defaults.headers.common['AllowedHeader'] = "origin";
})

3)用其他标题手动建立每个请求

login: function(credentials) {
  var request = {
    url: baseURI + "/user_sessions/",
    method: "POST",
    params: {
      user_session: credentials,
    },
    headers: {
      "Cache-Control": "no-cache",
      "Content-Type": "application/json"
    }
  }

  return $http(request);
}

4)使用cordova-whitelist-plugin

有什么想法吗?我已经看到很多问题,引用了$http在浏览器中的工作方式,但在手机上失败了。

1 个答案:

答案 0 :(得分:0)

原来问题不在于$ http,而在POST期间给出了路径$ http。我们的baseURI变量设置为//api.site.com,它适用于浏览器但不适用于移动应用。将其更改为更明确https://api.site.com效果很好。