4

JSONデータを取得しようとする外部サーバーに静的Webサイトをアップロードしたいlocalhost:3000（サーバープログラムはユーザーのコンピューターで既に実行されている）。

私は次のようにjQueryでこれを行おうとしています：

$.getJSON("http://localhost:3000/page", function(data){
    // process data...
});

クロスオリジンポリシーエラーが発生するのはなぜですか？また、どうすればそれらを阻止できますか？JSONデータにアクセスすると、これらのクロスサイトエラーが無効になると思いましたか？

更新1

提案されたようにコールバックを使用してJSONPを試しましたが、奇妙な問題があります。URLを指すスクリプトタグを追加するlocalhost:3000/pageと、コールバックが読み込まれ、ページの読み込みが完了するとデータが正しく表示されますが、これは目指しています。

このメソッドを使用して同じことを試みて$.getJSONも、以前と同じエラーが発生します。

XMLHttpRequest cannot load http://localhost:3000/page. Origin http://localhost is not allowed by Access-Control-Allow-Origin.。

4

1 に答える 1

3

面白いアイデア！

ただし、localhostとはまったく異なるドメインですsomewebsite.com。したがって、同一生成元ポリシーが適用されます。次のいずれかが必要です。

  • JSONPこれは、サーバーがlocalhostカスタムコールバックでのJSONのラップをサポートする必要があることを意味します
  • CORSこれにより、真のクロスドメインajaxが可能になりますが、リクエストの両端で多くの追加のヘッダーファズが必要になります。

JSONPはおそらく最も簡単に実行できます。のドキュメントから$.getJSON()：

URLに文字列「callback=？」が含まれている場合 （または同様に、サーバー側APIで定義されているように）、リクエストは代わりにJSONPとして扱われます。詳細については、$。ajax（）のjsonpデータ型の説明を参照してください。

サーバーは、 jQuerylocalhostが渡すコールバックパラメーターを使用する必要があります。つまり、これを単純にレンダリングするのではなく、次のようになります。

<%= jsonString() %>

ローカルサーバーは、次のようにレンダリングする必要があります。

<% if (params.callback) { %>
  <%= params.callback %>(<%= jsonString %>);
<% } else { %>
  <%= jsonString %>
<% } %>
于 2011-12-11T21:37:45.960 に答える