Javascript 使用phantom.js中的jQuery发送跨域ajax请求

我试图通过模拟chrome插件在phantomjs上的部分功能来测试它

我想让幻影做的事情看起来非常简单，但我遇到了问题。我希望它访问某个网页，并在该网页的上下文中运行一个脚本，该脚本将向我的后端发送一个ajax请求并打印出响应。为了让我的生活更轻松，我希望phantom使用jQuery发送ajax请求

下面是我要传递给phantom的脚本

test1.js

：

var page = new WebPage(),
    url = 'http://www.example.com',

// Callback is executed each time a page is loaded...
page.open(url, function (status) {
  if (status === 'success') {
    console.log('opened url');
    start();
  }
});

function start(){
  page.includeJs('https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js', function() {
    console.log("got here");
    $.get("http://my-wonderful-site.com")
      .done(function( data ) {
        console.log("here!");
        console.log(data);
        phantom.exit(); 
      });
  });
}

命令phantomjs test1.js--web security=false的控制台输出是：

opened url
got here
ReferenceError: Can't find variable: $

  test1.js:20
  :/modules/webpage.js:337

所以，似乎连jQuery都没有加载，但我不知道我做错了什么。尝试page.injectJs从我的硬盘插入jQuery，但收到相同的错误。你能帮忙吗

编辑：

按照建议更新了功能：

function start(){
  page.includeJs('https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js', function() {
    console.log("got here");
    page.evaluate(function() {
      console.log("and here");
      $.get("http://my-wonderful-site.com")
        .done(function( data ) {
          console.log("here!");
          console.log(data);
          phantom.exit(); 
        });
    });
  });
}

现在幻影挂起，控制台输出为：

phantomjs test1.js --web-security=false
opened url
got here

---

也就是说，紧接着

$.get

之前的console.log甚至都不会执行。

我非常确定您需要在

页面中。评估
以实际使用注入的JS（参见此处的示例）。尝试：

PhantomJS有两个上下文。内部上下文或页面上下文由
page.evaluate（）
定义。它是沙盒，无法访问外部定义的变量。所以，它不知道幻影是什么。同样，外部上下文也不知道
$
是什么，因为jQuery是一个DOM库，被注入到页面中。您需要将jQuery请求包装在
page.evaluate（）
中

另一件事是，现在，
phantom.exit（）
没有任何意义。您需要告诉PhantomJS从页面上下文内部退出，因为请求是异步的。这就是这对搭档的用武之地

page.onCallback = function(data){
  if (data.type === "exit") {
    phantom.exit();
  }
};

function start(){
  page.includeJs('https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js', function() {
    console.log("got here");
    page.evaluate(function(){
      $.get("http://my-wonderful-site.com")
        .done(function( data ) {
          console.log("here!");
          console.log(data);
          window.callPhantom({type: "exit"});
        });
    });
  });
}

console.log（）。你必须注册参加活动

您还可以在
callPhantom（）
的帮助下将数据发送到外部上下文，而不是记录数据。请注意，并非所有内容都可以在以下两个服务器之间传递：

注意：参数和
evaluate
函数的返回值必须是一个简单的原语对象。经验法则：如果可以通过JSON对其进行序列化，那么就可以了

闭包、函数、DOM节点等将无法工作

如果仍然存在问题，其他有用的事件处理程序是。
Ah！这提醒了我。我以前试过这个，现在又试了一次（见我问题的更新）。错误消失了，但现在phantomjs只是在
页面之后立即挂起。evaluate
。我在
$之前放了一个记录器。get
，但它不会在控制台中打印任何内容。现在这很奇怪，至少你现在肯定在使用jQuery。为了进行调试，请在
.get
回调中添加
控制台.log
（
$.get（）http://my-wonderful-site.com，function（）{console.log（'derp'）；}）
）。至少达到了这个程度吗？没有：-（我在
页面之间添加了
console.log
。evaluate…
和
$.get
-而
控制台.log
也不会显示在控制台中。因此，从技术上讲，甚至不能说jQuery正在被使用，因为执行会在
$.get
之前停止。所以基本上，even如果我完全删除jQuery位，只写`page.evaluate（function（）{console.log（“and here”）；}）；var page=webPage.create（）；
而不是
var webPage=require（'webPage'）；var page=new webPage（）
。很长时间，但值得一试？很酷！使用page.onCallback和page.onConsoleMessage侦听器可以正常工作。顺便说一句，由于我现在正在侦听所有控制台消息，我看到很多类似这样的警告：
不安全的JavaScript尝试访问URL为：blank的框架，URL为：blank的框架。域、协议和端口必须匹配。
这正常吗？如果您使用的是1.9.8，那么就正常了。这只是1.9.8版中引入的PhantomJS中的一个错误。它没有任何作用，只有在需要干净的输出时才不好。我建议您更新到PhantomJS 2。
page.onCallback = function(data){
  if (data.type === "exit") {
    phantom.exit();
  }
};

function start(){
  page.includeJs('https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js', function() {
    console.log("got here");
    page.evaluate(function(){
      $.get("http://my-wonderful-site.com")
        .done(function( data ) {
          console.log("here!");
          console.log(data);
          window.callPhantom({type: "exit"});
        });
    });
  });
}