L'origine n'est pas autorisée par le contrôle D'accès-Allow-Origin

je suis en train de faire un Ajax.request à distance à un serveur PHP dans un Sencha Touch 2 application (enveloppé dans PhoneGap ).

La réponse du serveur est la suivante:

XMLHttpRequest ne peut pas charger http://nqatalog.negroesquisso.pt/login.php . L'origine http://localhost:8888 n'est pas autorisée par le contrôle D'accès-Allow-Origin.

Comment puis-je résoudre ce problème?

308
demandé sur hippietrail 2012-04-13 18:50:19
la source

22 ответов

j'ai écrit un article sur cette question pendant un certain temps, Croix de Domaine AJAX .

la façon la plus simple de gérer cela si vous avez le contrôle du serveur répondant est d'ajouter un en-tête de réponse pour:

Access-Control-Allow-Origin: *

cela permettra le cross-domain Ajax . En PHP, vous voudrez modifier la réponse comme suit:

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

, Vous pouvez simplement mettre le Header set Access-Control-Allow-Origin * dans le Apache fichier de configuration ou htaccess. Juste travailler comme un charme.

les commentaires, c'est une remarque importante: le joker va permettre à n'importe quel domaine pour envoyer des requêtes à votre hôte. Je recommande de remplacer l'astérisque par un domaine spécifique que vous utiliserez dans les scripts .

358
répondu Matt Mombrea 2014-03-03 22:44:22
la source

si vous n'avez pas le contrôle du serveur, vous pouvez simplement ajouter cet argument à votre lanceur Chrome: --disable-web-security .

notez que je ne l'utiliserais pas pour "surfer sur le web". Pour référence, voir ce post: Désactiver la même origine dans Chrome .

vous pouvez utiliser Phonegap pour construire l'application et l'installer sur l'appareil, ce ne sera pas un problème.

60
répondu Travis Webb 2017-05-23 15:10:27
la source

si vous utilisez Apache, ajoutez simplement:

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

dans votre configuration. Cela permettra à toutes les réponses de votre serveur web d'être accessibles à partir de tout autre site sur internet. Si vous avez l'intention de n'autoriser l'utilisation de services sur votre hôte que par un serveur spécifique, vous pouvez remplacer le * par L'URL du serveur d'origine:

Header set Access-Control-Allow-Origin: http://my.origin.host
41
répondu Reza S 2012-08-21 11:15:58
la source

si vous avez un ASP.NET / ASP.NET MVC application, vous pouvez inclure cet en-tête via le Web.fichier de configuration:

<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>
16
répondu Caio Proiete 2014-03-03 22:55:28
la source

C'était la première question/réponse qui est apparue pour moi en essayant de résoudre le même problème en utilisant ASP.NET MVC comme la source de mes données. Je me rends compte que cela ne résout pas la question PHP , mais il est assez lié pour être précieux.

j'utilise ASP.NET MVC. Le billet de blog de Greg Brant a fonctionné pour moi. Finalement, vous créez un attribut, [HttpHeaderAttribute("Access-Control-Allow-Origin", "*")] , que vous pouvez ajouter à les actions du contrôleur.

par exemple:

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);
    }
}

et l'utiliser ensuite avec:

[HttpHeaderAttribute("Access-Control-Allow-Origin", "*")]
public ActionResult MyVeryAvailableAction(string id)
{
    return Json( "Some public result" );
}
15
répondu badMonkey 2014-03-03 22:53:22
la source

comme Matt Mombrea est correct pour le côté serveur, vous pourriez rencontrer un autre problème qui est le rejet de liste blanche.

Vous devez configurer votre phonegap.plist. (J'utilise une ancienne version de phonegap)

pour cordova, il pourrait y avoir des changements dans le nom et le répertoire. Mais la procédure doit être essentiellement les mêmes.

premier sélectionner les fichiers de soutien > PhoneGap.plist

enter image description here

puis sous "coûts externes

ajouter une entrée, avec une valeur de peut-être" http://nqatalog.negroesquisso.pt " J'utilise * uniquement à des fins de débogage.

enter image description here

10
répondu steve0hh 2012-04-23 08:46:10
la source

cela peut être pratique pour quiconque a besoin d'une exception pour les versions 'www' et 'non-www' d'un referrer:

 $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
répondu lewsid 2013-06-18 21:37:50
la source

je vais vous donner une solution simple pour cela. Dans mon cas, je n'ai pas accès à un serveur. Dans ce cas, vous pouvez modifier la Politique de sécurité de votre navigateur Google Chrome pour autoriser L'accès-Control-Allow-Origin. C'est très simple:

  1. Créer un raccourci du navigateur Chrome
  2. clic droit icône de raccourci - > propriétés - > raccourci - > cible

Simple coller dans "C:\Program Files\Google\Chrome\Application\chrome.exe" --allow-file-access-from-files --disable-web-security .

l'emplacement peut différer. Maintenant, ouvrez Chrome en cliquant sur ce raccourci.

7
répondu Dibish 2014-03-03 22:57:45
la source

j'ai rencontré ça plusieurs fois en travaillant avec différents API. Souvent une solution rapide est d'ajouter " &callback=?"à la fin d'une chaîne. Parfois, le commercial doit être un code de caractère, et parfois un "?":"?rappel=?"(voir prévisions.IO utilisation de L'API avec jQuery )

7
répondu Francis Baptiste 2017-05-23 13:31:32
la source

si vous écrivez une Extension Chrome et que vous obtenez cette erreur, alors assurez-vous d'avoir ajouté L'URL de base de L'API à votre manifest.json 's permissions block , exemple:

"permissions": [
    "https://itunes.apple.com/"
]
6
répondu itzg 2014-02-11 04:39:49
la source

si vous êtes sous apache, ajoutez un .fichier htaccess dans votre répertoire avec ce contenu:

Header set Access-Control-Allow-Origin: *

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

Header set Access-Control-Allow-Methods: *
6
répondu Vero O 2018-06-26 07:00:14
la source

c'est à cause de Politique de même origine . Voir plus sur Mozilla Developer Network ou Wikipedia .

fondamentalement, dans votre exemple, vous devez charger la http://nqatalog.negroesquisso.pt/login.php page seulement de nqatalog.negroesquisso.pt , pas localhost .

5
répondu antyrat 2014-03-03 22:46:18
la source

dans Ruby on Rails , vous pouvez faire dans un contrôleur:

headers['Access-Control-Allow-Origin'] = '*'
5
répondu fuzzyalej 2014-03-03 22:55:49
la source

vous pouvez le faire fonctionner sans modifier le serveur en faisant le broswer incluant l'en-tête Access-Control-Allow-Origin: * dans les réponses des OPTIONS HTTP.

dans Chrome, utilisez cette extension . Si vous êtes sur Mozilla, cochez cette réponse .

5
répondu forzagreen 2017-05-23 15:03:07
la source

si vous obtenez ceci en angle.js, puis assurez-vous d'échapper à votre numéro de port comme ceci:

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

Voir ici pour plus d'info sur elle.

5
répondu Marius 2015-07-30 22:41:50
la source

nous avons aussi le même problème avec l'application phonegap testée dans chrome. Une machine windows que nous utilisons sous le fichier batch tous les jours avant D'ouvrir Chrome. Rappelez-vous qu'avant d'exécuter ceci, vous devez nettoyer toutes les instances de chrome à partir du Gestionnaire des tâches ou vous pouvez sélectionner chrome pour ne pas exécuter en arrière-plan.

lot: (utiliser cmd)

cd D:\Program Files (x86)\Google\Chrome\Application\chrome.exe --disable-web-security
4
répondu abksharma 2015-07-30 22:06:01
la source

In Ruby Sinatra

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

pour tout le monde ou

response['Access-Control-Allow-Origin'] = 'http://yourdomain.name' 
1
répondu Mikhail Chuprynski 2015-06-07 23:16:51
la source
 **Add this meta tag in your Webservice**


 header('Content-type: application/json');
 header('Access-Control-Allow-Origin: *');
1
répondu Siddharth Shukla 2017-01-12 21:40:37
la source

si vous travaillez sur chrome, vous pouvez tout simplement Installer chrome extension à partir de chrome store pour résoudre les problèmes liés à la SCRO.

Extension: Allow-Control-Allow-Origin Lien: [ https://chrome.google.com/webstore/detail/allow-control-allow-origi/nlfbmbojpeacfghkpbjhddihlkkiljbi?hl=en][1]

1
répondu Codiee 2017-12-27 10:10:19
la source

quand vous recevez la demande vous pouvez

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

que lorsque vous avez à répondre aller avec quelque chose comme ça:

res.writeHead(
    206,
    {
        'Access-Control-Allow-Credentials': true,
        'Access-Control-Allow-Origin': origin,
    }
);
0
répondu Sunrising 2015-07-30 22:05:14
la source

le Joker n'est pas une option très sûre. Vous voudriez que ce soit plus spécifique - vérifiez la réponse que j'ai écrite ici sur la même question; comment contourner Access-Control-Allow-Origin?

-1
répondu Rob Quist 2017-05-23 15:10:27
la source