web-dev-qa-db-ja.com

OriginはAccess-Control-Allow-Originによって許可されていません

Sencha Touch 2アプリケーション( PhoneGap にラップされている)のリモートPHPサーバーにAjax.requestを作っています。

サーバーからの応答は以下のとおりです。

XMLHttpRequestが読み込めません http://nqatalog.negroesquisso.pt/login.php 。 Origin http://localhost:8888はAccess-Control-Allow-Originでは許可されていません。

どうすればこの問題を解決できますか?

320
Ricardo

私はしばらく前にこの問題に関する記事を書きました、 Cross Domain AJAX

応答するサーバを管理している場合にこれを処理する最も簡単な方法は、以下の応答ヘッダを追加することです。

Access-Control-Allow-Origin: *

これはクロスドメイン Ajax を許可します。 PHPでは、レスポンスを次のように修正したいでしょう。

<?php header('Access-Control-Allow-Origin: *'); ?>

Header set Access-Control-Allow-Origin *設定を Apache 設定ファイルまたはhtaccessファイルに入れるだけです。

これはCORS保護を事実上無効にすることに注意してください。これは ユーザーを攻撃する可能性が非常に高い にさらす可能性があります。特にワイルドカードを使用する必要があることがわからない場合は、ワイルドカードを使用しないでください。代わりに、特定のドメインをホワイトリストに登録する必要があります。

<?php header('Access-Control-Allow-Origin: http://example.com') ?>
369
Matt Mombrea

あなたが don't サーバーの制御権を持っているなら、あなたは単にあなたのChromeランチャーにこの引数を追加することができます:--disable-web-security

通常の「Webサーフィン」にはこれを使用しないことに注意してください。参考として、この記事を参照してください。 Chromeで同じOriginポリシーを無効にする

Phonegapを使用して実際にアプリケーションを構築し、それをデバイスにロードする方法は問題になりません。

61
Travis Webb

Apacheを使用している場合は、以下を追加するだけです。

<ifModule mod_headers.c>
    Header set Access-Control-Allow-Origin: *
</ifModule>

あなたの設定で。これにより、Webサーバーからのすべての応答がインターネット上の他のサイトからアクセス可能になります。あなたのホスト上のサービスのみが特定のサーバーによって使用されることを許可するつもりならば、あなたは発信サーバーのURLで*を置き換えることができます:

Header set Access-Control-Allow-Origin: http://my.Origin.Host
41
Reza S

ASP.NETASP.NET MVC アプリケーションがある場合は、Web.configファイルでこのヘッダーを含めることができます。

<system.webServer>
  ...

    <httpProtocol>
        <customHeaders>
            <!-- Enable Cross Domain AJAX calls -->
            <remove name="Access-Control-Allow-Origin" />
            <add name="Access-Control-Allow-Origin" value="*" />
        </customHeaders>
    </httpProtocol>
</system.webServer>
18
Caio Proiete

これは私のデータのソースとして ASP.NET MVC を使って同じ問題を解決しようとしたときに最初に現れた質問/回答でした。これで _ php _ の問題が解決されるわけではありませんが、価値があるほど十分に関連しています。

私はASP.NET MVCを使用しています。 Greg Brantからの ブログ投稿 は私のために働いた。最終的には、コントローラアクションに追加できる属性[HttpHeaderAttribute("Access-Control-Allow-Origin", "*")]を作成します。

例えば:

public class HttpHeaderAttribute : ActionFilterAttribute
{
    public string Name { get; set; }
    public string Value { get; set; }
    public HttpHeaderAttribute(string name, string value)
    {
        Name = name;
        Value = value;
    }

    public override void OnResultExecuted(ResultExecutedContext filterContext)
    {
        filterContext.HttpContext.Response.AppendHeader(Name, Value);
        base.OnResultExecuted(filterContext);
    }
}

そしてそれを使って:

[HttpHeaderAttribute("Access-Control-Allow-Origin", "*")]
public ActionResult MyVeryAvailableAction(string id)
{
    return Json( "Some public result" );
}
15
badMonkey

Matt Mombreaはサーバー側に適しているため、ホワイトリスト拒否という別の問題に遭遇する可能性があります。

Phonegap.plistを設定する必要があります。 (私は古いバージョンのphonegapを使っています)

Cordovaでは、名前とディレクトリにいくつかの変更があるかもしれません。しかし、手順はほとんど同じです。

まずSupporting files> PhoneGap.plistを選択します。

enter image description here

それから "ExternalHosts"の下に

おそらく " http://nqatalog.negroesquisso.pt "という値でエントリを追加します。私は*をデバッグ目的でのみ使用しています。

enter image description here

10
steve0hh

さまざまなAPIを使用しているときに、これに何度か遭遇しました。多くの場合、簡単な修正は "&callback =?"を追加することです。文字列の末尾まで。アンパサンドは文字コードでなければならないこともあれば、 "?": "?callback =?"の場合もあります。 ( jQueryでのForecast.io APIの使用 を参照)

7

これは 'www'と 'non-www'の両方のバージョンの参照元について例外を必要とする人にとっては便利かもしれません。

 $referrer = $_SERVER['HTTP_REFERER'];
 $parts = parse_url($referrer);
 $domain = $parts['Host'];

 if($domain == 'google.com')
 {
         header('Access-Control-Allow-Origin: http://google.com');
 }
 else if($domain == 'www.google.com')
 {
         header('Access-Control-Allow-Origin: http://www.google.com');
 }
7
lewsid

私はあなたにこれのための簡単な解決策を与えるでしょう。私の場合はサーバーにアクセスできません。その場合は、 Google Chrome ブラウザでセキュリティポリシーを変更して、Access-Control-Allow-Originを許可することができます。これはとても簡単です。

  1. Chromeブラウザのショートカットを作成する
  2. ショートカットアイコンを右クリック - > [プロパティ] - > [ショートカット] - > [ターゲット]

"C:\Program Files\Google\Chrome\Application\chrome.exe" --allow-file-access-from-files --disable-web-securityに貼り付けるだけです。

場所は異なる場合があります。そのショートカットをクリックしてChromeを開きます。

7
Dibish

Chrome拡張機能を作成しているときにこのエラーが発生する場合は、manifest.jsonpermissionsブロックにAPIのベースURLを追加したことを確認してください 、例えば:

"permissions": [
    "https://iTunes.Apple.com/"
]
6
itzg

もしあなたがApacheの下にいるのなら、あなたのディレクトリに.htaccessファイルを追加してください。

Header set Access-Control-Allow-Origin: *

Header set Access-Control-Allow-Headers: content-type

Header set Access-Control-Allow-Methods: *
6
Vero O

Angular.jsでこれを取得する場合は、次のようにポート番号をエスケープしてください。

var Project = $resource(
    'http://localhost\\:5648/api/...', {'a':'b'}, {
        update: { method: 'PUT' }
    }
);

詳しくは こちら をご覧ください。

5
Marius

HTTP OPTIONSの応答にヘッダーAccess-Control-Allow-Origin: *を含めることで、ブラウザを変更しなくてもサーバーを変更することなく動作させることができます。

Chromeでは、 この拡張子 を使用します。 Mozillaを使っているなら この答え をチェックしてください。

5
forzagreen

これは、 same-Originポリシー のためです。 Mozilla Developer Network または Wikipedia で詳細を参照してください。

基本的に、この例では、http://nqatalog.negroesquisso.pt/login.phpからのみnqatalog.negroesquisso.ptページをロードする必要があります。localhostではロードできません。

5
antyrat

Ruby on Rails では、コントローラで行うことができます。

headers['Access-Control-Allow-Origin'] = '*'
5
fuzzyalej

私達はまたクロムでテストされるphonegap適用との同じ問題を抱えている。 Chromeを開く前に、毎日1つのWindowsマシンをバッチファイルの下で使用しています。これを実行する前に、タスクマネージャからchromeのすべてのインスタンスを削除する必要があることを忘れないでください。あるいは、バックグラウンドで実行しないようにchromeを選択することができます。

バッチ:( cmdを使用)

cd D:\Program Files (x86)\Google\Chrome\Application\chrome.exe --disable-web-security
4
abksharma

Rubyでは シナトラ

response['Access-Control-Allow-Origin'] = '*' 

みんなのために

response['Access-Control-Allow-Origin'] = 'http://yourdomain.name' 
1

あなたが要求を受け取るとき、あなたはすることができます

var Origin = (req.headers.Origin || "*");

あなたが応答する必要があるときよりもそのようなもので行く:

res.writeHead(
    206,
    {
        'Access-Control-Allow-Credentials': true,
        'Access-Control-Allow-Origin': Origin,
    }
);
0
Sunrising