發佈使用XMLHttpRequest的

對這個問題的工作頁面，我寫了下面的腳本：發佈使用XMLHttpRequest的

window.onload = function() { 
    var request = new XMLHttpRequest(); 
    var url = "http://localhost:3000/say_hello"; 
    var params = "username=FooMan"; 

    request.onreadystatechange = function() { 
     if (request.readyState == 4 && request.status == 200) { 
      console.log(request.responseText); 
     } 
    } 
    request.open("POST", url, true); 
    request.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); 
    request.withCredentials = true; 
    request.send(params); 
}

但是每次我試圖執行腳本我得到

XMLHttpRequest cannot load http://localhost:3000/say_hello. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access.

我已經嘗試使用

request.setRequestHeader("Access-Control-Allow-Origin", "*"); 
request.setRequestHeader("Access-Control-Allow-Origin", "hello.html");

瀏覽器是Chrome。我做錯了什麼或失蹤？

來源

2015-05-09 cybertextron

'Access-Control-Allow-Origin'標題需要在服務器端設置，而不是客戶端。您的後端使用什麼語言編寫？ – AlliterativeAlice

@AlliterativeAlice紅寶石在Rails的 – cybertextron

對於本地解決跨起源問題，您可以安裝[允許控制允許原產地插件（https://chrome.google.com/webstore/detail/allow-control-allow -origi/nlfbmbojpeacfghkpbjhddihlkkiljbi？hl = en） – sfletche

的Access-Control-Allow-Origin頭需要在服務器側設置並在響應中，在所述請求中的客戶機側沒有設置發送。在Rails這可以通過將下面的代碼在你的控制器來實現：

headers['Access-Control-Allow-Origin'] = '*' 
headers['Access-Control-Allow-Methods'] = 'POST, PUT, DELETE, GET, OPTIONS' 
headers['Access-Control-Request-Method'] = '*' 
headers['Access-Control-Allow-Headers'] = 'Origin, X-Requested-With, Content-Type, Accept, Authorization'

欲瞭解更多信息，請參閱Allow anything through CORS Policy

來源

2015-05-09 02:10:00 AlliterativeAlice

您正在運行到同一來源的安全限制。默認情況下，不允許使用Javascript將Ajax調用發送到具有與腳本運行網頁不同的來源（域，端口和協議）的服務器。

在您的特定情況下，您的錯誤的這一部分消息：

Origin 'null' is therefore not allowed access.

表示你可能（硬盤驅動器上的一個）運行的本地網頁和腳本正在從通過Ajax訪問外部服務器阻塞。

如果腳本中的實際的Web服務器上運行的網頁（而不是從本地硬盤驅動器），那麼，在默認情況下，Ajax調用可以只向同一個web服務器。如果您想對其他服務器進行Ajax調用，那麼您需要一個協作服務器才能與其他服務器進行通信。

要進行普通的Ajax調用，服務器必須指定Access-Control-Allow-Origin標頭，告訴主機瀏覽器可以接受來自除服務器本身以外的某些域的Ajax調用。這被稱爲CORS（跨源資源共享）。您可以閱讀更多關於如何使用CORS here on MDN的信息。您不能從客戶端設置這些標頭 - 它們必須從服務器進行設置。它是必須授予瀏覽器訪問權限的服務器，而不是其他方式。

除了CORS，JSONP也是一個變通跨站點的訪問。

CORS和JSONP都需要來自主機服務器的合作以允許跨源訪問。而且，即使使用CORS或JSONP，如果網頁從本地文件系統（而不是實際的Web服務器）上運行，某些瀏覽器（如Chrome）仍會阻止訪問。在運行瀏覽器進行開發之前，可以使用命令行選項臨時繞過此限制，但這顯然不是一種通用的解決方案。

來源

2015-05-09 02:22:45 jfriend00

@philippe - 這是否回答你的問題？ – jfriend00

發佈使用XMLHttpRequest的

回答

相關問題