2

非常に基本的な Web アプリに問題があります。ここに私のファイルがあります:

public/index.html

<!DOCTYPE html>

<html lang="en" data-ng-app>
  <body>

    <div data-ng-controller="PlayersCtrl">
      <div data-ng-repeat="player in players">
        {{player.id}}
      </div>
    </div>

    <script src="/angular.min.js"></script>
    <script src="/players.js"></script>
  </body>
</html>

public/players.js

function PlayersCtrl($scope, $http) {
  $scope.players = [];

  $http({
    method: 'GET',
    url: 'http://localhost:9292/hi'
  }).success(function(data) {
    $scope.players = data;
  });
}

client.rb

require 'sinatra'

get '/' do
  headers 'Access-Control-Allow-Origin' => '*'
  headers 'Access-Control-Allow-Headers' => 'Authorization,Accepts,Content-Type,X-CSRF-Token,X-Requested-With'
  headers 'Access-Control-Allow-Methods' => 'GET,POST,PUT,DELETE,OPTIONS'

  send_file File.join(settings.public_folder, 'index.html')
end

api.rb

require 'sinatra'
require 'json'

get '/hi' do
  headers 'Access-Control-Allow-Origin' => '*'
  headers 'Access-Control-Allow-Headers' => 'Authorization,Accepts,Content-Type,X-CSRF-Token,X-Requested-With'
  headers 'Access-Control-Allow-Methods' => 'GET,POST,PUT,DELETE,OPTIONS'

  [id: 1, name: "Bob"].to_json
end

私には、これは良さそうです。次に、サーバーを起動します。

api.rb の開始

$ ruby api.rb -p 9292
[2013-03-07 23:57:43] INFO  WEBrick 1.3.1
[2013-03-07 23:57:43] INFO  ruby 2.0.0 (2013-02-24) [x86_64-darwin12.2.0]
== Sinatra/1.3.5 has taken the stage on 9292 for development with backup from WEBrick
[2013-03-07 23:57:43] INFO  WEBrick::HTTPServer#start: pid=62634 port=9292

client.rb の起動

$ ruby client.rb
[2013-03-07 23:57:40] INFO  WEBrick 1.3.1
[2013-03-07 23:57:40] INFO  ruby 2.0.0 (2013-02-24) [x86_64-darwin12.2.0]
== Sinatra/1.3.5 has taken the stage on 4567 for development with backup from WEBrick
[2013-03-07 23:57:40] INFO  WEBrick::HTTPServer#start: pid=62610 port=4567

しかし、ローカルホスト (ポート 4567) でブラウザーを使用すると、次のログが表示されます。

api.rb ログ

127.0.0.1 - - [07/Mar/2013 23:57:46] "OPTIONS /hi HTTP/1.1" 404 442 0.0015
localhost - - [07/Mar/2013:23:57:46 CET] "OPTIONS /hi HTTP/1.1" 404 442
http://localhost:4567/ -> /hi

client.rb ログ

127.0.0.1 - - [07/Mar/2013 23:57:46] "GET / HTTP/1.1" 304 - 0.0093
localhost - - [07/Mar/2013:23:57:46 CET] "GET / HTTP/1.1" 304 0
- -> /

クロスオリジン リソース共有について多くの検索を行い、さまざまな方法をテストしました。現在、処理方法がわかりません。助けてくれてありがとう。

編集:

error 404私の問題は、AngularJS 呼び出しの後に api.rb サーバーが を返すことです。さらに、2 つのOPTIONS /hi要求があり、これは奇妙です。CORS の症状だと思いますが、クロスオリジン クエリを受け入れるためにヘッダーを追加しました。

200これの代わりに、サーバーはJSON でを返す必要があります。私は本当にそれを修正する方法がわかりません。

4

1 に答える 1