讓Ajax調用從兩個JavaScript文件獲取響應到一個PHP文件

Question

我正在使用JQuery Ajax。我需要響應的PHP文件位於服務器上。第一個JavaScript文件位於服務器上的同一個目錄中，第二個文件與我保存在本地，我在我的Chrome擴展中使用。我在PHP中創建了一段代碼，我通過Ajax從本地JavaScript文件運行並獲得響應，我想要的是調用服務器上的JavaScript，並且可以通過兩種方法解決。

1）將Ajax調用到保存在服務器上相同目錄中的同一PHP代碼塊。

2）從本地JavaScript文件調用服務器上的JavaScript。當本地JavaScript獲得響應時，使用一種方法從本地調用服務器上的JavaScript。

基本上我嘗試了他們兩個，我已經做了第二個Ajax調用到相同的代碼塊，但作爲服務器html文件首先運行並首先加載JavaScript，然後它不會從該Ajax請求返回任何東西。 在第二種方法中，我使用了chrome的postMessage API。但它會阻止從本地到服務器傳遞的跨源信息。並且域名衝突停止傳遞我的消息來調用服務器JavaScript。

本地文件的JavaScript請求數據，並得到響應

function sendUrl(url){ 
 
    console.log("Passed to sendURL : " + url); \t 
 
    $.ajax({ 
 
    method:"GET", 
 
\t url:"http://www.bitbaysolutions.com/connections.php?updateRow=true", 
 
\t data:{ 
 
\t \t ajaxified : url 
 
\t }, 
 
\t success:function(res){ 
 
      console.log("PHP RESPONSE " + res); 
 
\t } 
 
    }); 
 
}

我想調用服務器的JavaScript時，我從中得到Ajax調用的響應。簡單的成功。

當我使用POST消息API在同一個Ajax調用響應

function sendUrl(url){ 
 
    console.log("Passed to sendURL : " + url); \t 
 
    $.ajax({ 
 
    method:"GET", 
 
\t url:"http://www.bitbaysolutions.com/connections.php?updateRow=true", 
 
\t data:{ 
 
\t \t ajaxified : url 
 
\t }, 
 
\t success:function(res){ 
 
     console.log("PHP RESPONSE " + res); 
 
     window.postMessage(res,"*"); 
 
\t } 
 
    }); 
 
}

並在服務器上編寫代碼JavaScript文件接收消息

var eventMethod = window.addEventListener ? "addEventListener" : "attachEvent"; 
 
var eventer = window[eventMethod]; 
 
var messageEvent = eventMethod == "attachEvent" ? "onmessage" : "message"; 
 

 
eventer(messageEvent,function(e) { 
 
    console.log(e.data); 
 
});

運行它後，我收到以下錯誤：GET chrome-extension://jifdgpnmlcmlcbpmemiecblbddpdejhe/Row%20Updated net::ERR_FILE_NOT_FOUND

只要我想調用服務器的JavaScript文件，當我得到這個本地文件的響應。如果還有其他可能的解決方案，我將不勝感激。

Answer 1

看起來你應該使用Chrome's Message而不是window.postMessage。

所以你在擴展的Javascript會是這個樣子：

你的JavaScript接收該消息將不得不被插入的Content Script通過擴展的頁面上，並且該腳本可以直接操作頁面，也可以調用從服務器加載的JS。

內容腳本將收到這樣的消息：

chrome.runtime.onMessage.addListener(
 
    function(request, sender, sendResponse) { 
 
     
 
     if (request.thisCameFromTheServer) { 
 
      console.log(request.thisCameFromTheServer); 
 
     } 
 
     /* I *think* that you have access to the whole page DOM, and any JS 
 
     on the page, from here, so if there's a JS function you want to call 
 
     that's on the page you probably can. */ 
 
    } 
 
);