让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. */ 
 
    } 
 
);