与Sinatra和AngularJS的跨域会话

I am using Sinatra as a webservice and angularjs to make the calls

我使用Sinatra作为web服务和angularjs来进行调用

post '/loginUser' do
    session[:cui]=user['cui']
end
get '/cui' do
  return session[:cui].to_s
end

But it doesn't seem to work (the '/cui' call returns an empty string) any help would be greatly apreciated.

但它似乎不起作用('/ cui'调用返回一个空字符串)任何帮助都会大大减少。

UPDATE: setting this in sinatra headers['Access-Control-Allow-Credentials'] = 'true' allows me to send the session, but it seems like $http directive is not using the browsers cookies

更新:在sinatra头文件中设置此项['Access-Control-Allow-Credentials'] ='true'允许我发送会话,但似乎$ http指令不使用浏览器cookie

2 个解决方案

#1

on the sinatra app

在sinatra应用程序上

before do
  headers['Access-Control-Allow-Methods'] = 'GET, POST, PUT, DELETE, OPTIONS'
  headers['Access-Control-Allow-Origin'] = 'http://localhost:4567'
  headers['Access-Control-Allow-Headers'] = 'accept, authorization, origin'
  headers['Access-Control-Allow-Credentials'] = 'true'
end

angularjs app

host='http://127.0.0.1:5445/'
@viewController = ($scope,$http)->
  $scope.getCui = ()->
    $http.get(host+'cui',{ withCredentials: true}).success (data)->
      $scope.cui=data
      console.log data

Explanation: AngularJS uses his own cookie system, so we need to specify that we can pass the cookies trough the $http.get call using the {withCredentials:true} configuration object. Sinatra needs to accept the cross domain cookies so we need the headers mentioned above. Note: 'Access-Control-Allow-Origin' header cannot be wildcard.

说明:AngularJS使用自己的cookie系统,因此我们需要指定我们可以使用{withCredentials:true}配置对象通过$ http.get调用传递cookie。 Sinatra需要接受跨域cookie,因此我们需要上面提到的标题。注意:'Access-Control-Allow-Origin'标头不能是通配符。

#2

One option around this would be to configure a http server with a proxy pass, so you could hit the same domain without incurring a cross origin error. That way you can continue to properly maintain your abstractions as 2 separate apps.

围绕此选项的一个选择是使用代理传递配置http服务器,因此您可以在不产生交叉原始错误的情况下命中同一个域。这样,您可以继续将您的抽象维护为2个独立的应用程序。

Here is a brief example with nginx:

以下是nginx的简短示例:

upstream angular_app {
  server localhost:3003;
}

upstream sinatra_app {
  server localhost:3004;
}

server {
  listen 80;
  server_name  local.angular_app.com;
  root /Users/username/source/angular_app/;

  location / {
    proxy_set_header Host $http_host;
    proxy_redirect off;
  }

  location ~ ^/api/(.*)$ {
    proxy_set_header Host $http_host;
    proxy_read_timeout 1200;
    proxy_pass http://sinatra_app/;
  }
}

By routing at the server level, you can successfully bypass domain restrictions AND you can keep the applications separate.

通过在服务器级别进行路由,您可以成功绕过域限制,并且可以将应用程序分开。

#1