Origin ไม่ได้รับอนุญาตจาก Access-Control-Allow-Origin

ฉันกำลังAjax.requestเข้าสู่เซิร์ฟเวอร์ PHP ระยะไกลในแอปพลิเคชันSencha Touch 2 (รวมอยู่ในPhoneGap )

การตอบสนองจากเซิร์ฟเวอร์ต่อไปนี้:

XMLHttpRequest ไม่สามารถโหลดhttp://nqatalog.negroesquisso.pt/login.php Origin http://localhost:8888ไม่ได้รับอนุญาตจาก Access-Control-Allow-Origin

ฉันจะแก้ไขปัญหานี้ได้อย่างไร

ผมเขียนบทความเกี่ยวกับเรื่องนี้กลับมาในขณะที่ครอส AJAX

วิธีที่ง่ายที่สุดในการจัดการสิ่งนี้หากคุณมีการควบคุมเซิร์ฟเวอร์ที่ตอบสนองคือการเพิ่มส่วนหัวการตอบกลับสำหรับ:

Access-Control-Allow-Origin: *

นี้จะช่วยให้ข้ามโดเมนอาแจ็กซ์ ใน PHP คุณจะต้องแก้ไขการตอบสนองดังนี้:

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

คุณสามารถHeader set Access-Control-Allow-Origin *ตั้งค่าไว้ในการกำหนดค่าApacheหรือไฟล์ htaccess

มันควรจะตั้งข้อสังเกตว่าเรื่องนี้ได้อย่างมีประสิทธิภาพจะปิดใช้งานการป้องกัน ธ ซึ่งน่าจะหมายความว่าผู้ใช้ของคุณที่จะถูกโจมตี หากคุณไม่ทราบว่าคุณต้องใช้ไวด์การ์ดโดยเฉพาะคุณไม่ควรใช้มันและคุณควรทำรายการโดเมนที่อนุญาตพิเศษ:

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

หากคุณไม่ได้มีการควบคุมของเซิร์ฟเวอร์คุณก็สามารถเพิ่มเรื่องนี้จะปล่อย Chrome --disable-web-securityของคุณ:

โปรดทราบว่าฉันจะไม่ใช้สิ่งนี้ในการ "ท่องเว็บ" ตามปกติ สำหรับการอ้างอิงดูโพสต์นี้: เดียวกันต้นทางนโยบายปิดการใช้งานใน Chrome

เมื่อคุณใช้ Phonegap เพื่อสร้างแอปพลิเคชั่นจริงและโหลดลงในอุปกรณ์นี่จะไม่มีปัญหา

หากคุณใช้ Apache เพียงเพิ่ม:

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

ในการกำหนดค่าของคุณ นี่จะทำให้คำตอบทั้งหมดจากเว็บเซิร์ฟเวอร์ของคุณสามารถเข้าถึงได้จากเว็บไซต์อื่น ๆ บนอินเทอร์เน็ต หากคุณตั้งใจจะอนุญาตให้ใช้บริการบนโฮสต์ของคุณโดยเซิร์ฟเวอร์เฉพาะคุณสามารถแทนที่*ด้วย URL ของเซิร์ฟเวอร์ต้นทาง:

Header set Access-Control-Allow-Origin: http://my.origin.host

หากคุณมีแอปพลิเคชันASP.NET / ASP.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>

นี่เป็นคำถาม / คำตอบแรกที่โผล่ขึ้นมาสำหรับฉันเมื่อพยายามที่จะแก้ปัญหาเดียวกันโดยใช้ASP.NET MVCเป็นแหล่งข้อมูลของฉัน ฉันรู้ว่านี่ไม่ได้แก้คำถามPHPแต่มีความเกี่ยวข้องมากพอที่จะมีค่า

ฉันกำลังใช้ ASP.NET MVC บล็อกโพสต์จากเกร็กตัวผู้ทำงานให้ฉัน ในที่สุดคุณสร้างคุณลักษณะ[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" );
}

เนื่องจาก Matt Mombrea นั้นถูกต้องสำหรับฝั่งเซิร์ฟเวอร์คุณอาจพบปัญหาอื่นซึ่งเป็นการปฏิเสธรายการที่อนุญาตพิเศษ

คุณต้องกำหนดค่า phonegap.plist ของคุณ (ฉันใช้ phonegap รุ่นเก่า)

สำหรับ Cordova อาจมีการเปลี่ยนแปลงบางอย่างในการตั้งชื่อและไดเรกทอรี แต่ขั้นตอนส่วนใหญ่ควรเหมือนกัน

ก่อนอื่นให้เลือกไฟล์ที่รองรับ> PhoneGap.plist

จากนั้นภายใต้ "ExternalHosts"

เพิ่มรายการโดยอาจมีค่าเป็น " http://nqatalog.negroesquisso.pt " ฉันใช้ * เพื่อการดีบักเท่านั้น

สิ่งนี้อาจมีประโยชน์สำหรับทุกคนที่ต้องการยกเว้นผู้อ้างอิงทั้งรุ่น 'www' และ 'ไม่ใช่ 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');
 }

ฉันจะให้คำตอบง่ายๆสำหรับคุณ ในกรณีของฉันฉันไม่สามารถเข้าถึงเซิร์ฟเวอร์ ในกรณีนี้คุณสามารถเปลี่ยนนโยบายความปลอดภัยในเบราว์เซอร์Google Chromeของคุณเพื่ออนุญาตการเข้าถึง - การควบคุม - อนุญาต - กำเนิด ง่ายมาก:

1. สร้างทางลัดเบราว์เซอร์ Chrome
2. คลิกขวาที่ไอคอนทางลัด -> คุณสมบัติ -> ทางลัด -> เป้าหมาย

"C:\Program Files\Google\Chrome\Application\chrome.exe" --allow-file-access-from-files --disable-web-securityวางที่เรียบง่ายใน

สถานที่อาจแตกต่างกัน ตอนนี้เปิด Chrome โดยคลิกที่ทางลัดนั้น

ฉันพบปัญหานี้สองสามครั้งเมื่อทำงานกับ API ที่หลากหลาย บ่อยครั้งที่การแก้ไขด่วนคือการเพิ่ม "& callback =?" ไปยังจุดสิ้นสุดของสตริง บางครั้งเครื่องหมายแอมเปอร์แซนด์ต้องเป็นรหัสตัวอักษรและบางครั้งจะเป็น "?": "? callback =?" (ดูการใช้งาน Forecast.io API กับ jQuery )

หากคุณกำลังเขียนขยาย Chrome และได้รับข้อผิดพลาดนี้แล้วให้แน่ใจว่าคุณได้เพิ่ม URL ฐาน API เพื่อคุณmanifest.json's สิทธิ์บล็อก , ตัวอย่างเช่น:

"permissions": [
    "https://itunes.apple.com/"
]

นี่เป็นเพราะนโยบายที่มาเดียวกัน ดูเพิ่มเติมได้ที่Mozilla พัฒนาเครือข่ายหรือวิกิพีเดีย

โดยทั่วไปในตัวอย่างของคุณคุณจะต้องโหลดhttp://nqatalog.negroesquisso.pt/login.phpหน้าเพียงไม่nqatalog.negroesquisso.ptlocalhost

หากคุณอยู่ภายใต้ apache เพียงเพิ่มไฟล์. htaccess ในไดเรกทอรีของคุณด้วยเนื้อหานี้:

Header set Access-Control-Allow-Origin: *

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

Header set Access-Control-Allow-Methods: *

ในRuby on Railsคุณสามารถทำได้ในคอนโทรลเลอร์:

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

คุณสามารถทำให้มันทำงานได้โดยไม่ต้องดัดแปลงเซิร์ฟเวอร์ด้วยการทำ broswer รวมถึงส่วนหัวAccess-Control-Allow-Origin: *ในการตอบสนองของ HTTP OPTIONS

ใน Chrome ใช้ส่วนขยายนี้ หากคุณใช้ Mozilla โปรดตรวจสอบคำตอบนี้

หากคุณได้รับสิ่งนี้ใน Angular.js ให้แน่ใจว่าคุณหลีกเลี่ยงหมายเลขพอร์ตของคุณเช่นนี้

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

ดูที่นี่สำหรับข้อมูลเพิ่มเติมเกี่ยวกับมัน

เรามีปัญหาเดียวกันกับแอปพลิเคชั่น phonegap ที่ทดสอบด้วยโครเมี่ยม เครื่อง windows หนึ่งเครื่องที่เราใช้ไฟล์ชุดด้านล่างทุกวันก่อนเปิด Chrome จำไว้ว่าก่อนใช้งานสิ่งนี้คุณต้องทำความสะอาดโครเมี่ยมทั้งหมดจากตัวจัดการงานหรือคุณสามารถเลือก chrome เพื่อไม่ให้ทำงานในพื้นหลัง

ชุด: (ใช้ cmd)

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

ในทับทิมซินาตร้า

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

สำหรับทุกคนหรือ

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

เมื่อคุณได้รับคำขอคุณสามารถ

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

กว่าเมื่อคุณต้องตอบกลับด้วยสิ่งที่ต้องการ:

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