如何Ajax調用遠程服務器上託管的PHP文件並接收響應？

我們正嘗試從本地的index.html調用，這是一個在webhost000上託管的簡單PHP文件，用於接收響應。 PHP文件是：如何Ajax調用遠程服務器上託管的PHP文件並接收響應？

<?php 
if (isset($_POST['name'])) { 
    $name = $_POST['name']; 
    echo ($name); 
} 
?>

我們想簡單地輸入在html.index一個文本字符和接收相同的字符從PHP的響應。我們使用Ajax調用做到這一點的HTML文件：

<script> 
    $(document).ready(function() { 
     $('#name').keyup(function() { 
     var name = $('#name').val();   
     var request = $.ajax({ 
       url: "https://nedo93.000webhostapp.com/phpdemo.php",     
       method: "POST", 
       data: { name : name }, 
       dataType: "html" 
      }); 

      request.done(function(msg) { 
       alert("Request done: " + msg); 
      }); 

      request.fail(function(jqXHR, textStatus) { 
       alert("Request failed: " + textStatus); 
      });   
     }); 
    });   
    </script>

（剩下的HTML不應該是很重要的，它完美的作品，測試，再測試）

如果我們嘗試調試這一點，我們可以看到該文件被發現，請求被髮送，但我們不能收到迴應：screenshot

如果我們使用this瀏覽器功能相反，我們可以發送數據和接收沒有問題的迴應，不知道這可以幫助。

如果您可以回答此問題，請提前致謝。

來源

2017-06-07 Edoardo Bianchi

你意識到你正在爲每一個擊鍵提出請求嗎？這是大量的Ajax調用。 – Styphon

是的，我知道，這只是我們試圖做的一個演示，它對於我們最後的purpouse來說並不重要，它完全不同，問題在於它不工作，即使只有一個按鍵。 –

您的屏幕截圖顯示您從服務器獲得200響應。沒有數據是一個問題，但它確實看起來像服務器正在響應請求。我假設你已經嘗試過'echo「TEST」;死了;'在文件頂部？這是否產生任何東西？如果你嘗試'var_dump（$ _ POST），你會得到什麼;'？ – Styphon

這是因爲您的PHP腳本託管在不同的服務器上，並且您的AJAX調用代碼位於本地。

對於AJAX運行，有同源策略。根據此政策，網頁瀏覽器允許第一個網頁中包含的腳本訪問第二個網頁中的數據，但前提是兩個網頁具有相同的來源（意味着兩者都在同一個域中）。 Read more about same origin policy here.

雖然W3C有一個XMLHttpRequest對象的草稿，可以啓用此功能，但同源策略會阻止跨域使用某些Ajax技術。通過在頁面內使用嵌入爲iframe的特殊跨域通信通道或使用JSONP，websocket，跨域消息或cross-domain resource sharing來避開此安全功能。

簡而言之，您將無法訪問駐留在000webhost服務器上的PHP請求，以便在本地使用AJAX代碼進行訪問。

您可以在同一個000webhost域上託管AJAX代碼，也可以在運行PHP代碼的000webhost域上啓用跨域資源共享。

據我所知，000webhost是一個免費服務器，不支持這些更改。所以你必須得到一個更好的服務器或者在本地測試。如您在查詢中提到的那樣，所有HTTP請求（如GET，POST，PUT）都可以跨域使用。但對於AJAX來說，沒有那麼簡單。

希望這會有所幫助！

來源

2017-06-07 11:26:23 devutkarsh

謝謝，你。這似乎是我們的問題。事實上，如果我上傳webhost000上的index.html，它將起作用。問題是我們在本地使用React應用程序，並且我們無法將此應用程序上載到虛擬主機上，因此我們不得不打電話給另一臺服務器。有沒有辦法實現這樣的事情？ –

好的，非常感謝，我們會看看。 –

是的@EdoardoBianchi這仍然可以實現。最好的辦法是給你JSONP - 我會建議閱讀並瀏覽en.wikipedia.org/wiki/JSONP#JSONP。使用腳本標記，您可以從服務器檢索此數據（因爲JavaScript腳本標記可以從不同服務器獲取數據），然後使用JavaScript解析腳本標記下獲取的數據，解析並使用它。 – devutkarsh

-1

使用json_encode

你的代碼應該是....

<?php 
if (isset($_POST['name'])) { 
    $name = $_POST['name']; 
    header('Content-Type: application/json'); //just used as info for your application 
    echo json_encode($name); //encode to JSON object 
} 
?>

那些jQuery驗證檢查Json的回覆（特別爲誤差）之後。

來源

2017-06-07 11:15:20 Mausumi

他在請求中使用'dataType：「html」'專門檢查HTML。你應該只回應JSON，如果這是你所期待的。 – Styphon

我們也嘗試過使用json，但沒有任何改變。 –

所以你正在尋找一個http狀態碼來決定下一步。不是嗎？ @EdoardoBianchi – Mausumi

如何Ajax調用遠程服務器上託管的PHP文件並接收響應？

回答

相關問題