Question

我试图在JSFiddle中模拟ping一个网站，即如果一个网站（比如www.google.com）可用，则显示状态为“Up”，否则为“Down”

AJAX无法正常运行，因为它将成为CORS请求。我尝试使用Image source技巧，但它失败了（更新的代码）。

~~JSFiddle将图片来源设置为“https://fiddle.jshell.net/_display/www.google.com”而不是“www.google.com”~~

var sites = {
  google: {
    url: "http://www.google.com",
    id: "googleStatus"
  },
  dummy: {
    url: "http://www.dummysitealphabeta2.com",
    id: "dummySiteStatus"
  }
}

pingSite(sites.google); // Should update status to "Up"
pingSite(sites.dummy); // Should update status to "Down"

// ping site using image trick wiz. Add source of site to image
// and add handler to image onload or onerror
function pingSite(site) {
  var image = new Image();
  image.src = site.url;
  image.onload = function() {
    console.log("loading loaded for " + site.url + "successfully");
  }

  image.onerror = function() {
    console.log("Image loading failed for " + site.url);
  }

}

// Using AJAX - Won't work because of CORS
function getStatus(site) {
  $.ajax(site.url).done(function() {
    // Http 200 OK
    $(site.id).html("Up");
  }).fail(function() {
    // HTTP 401,
    $(site.id).html("Down");
  });
}

<table>
  <tr>
    <td>Google</td>
    <td id="googleStatus"></td>
  </tr>
  <tr>
    <td>Dummy Site</td>
    <td id="dummySiteStatus"></td>
  </tr>
</table>

Answer 1

我尝试使用Image source技巧，但JSFiddle将图像源设置为＆＃34; https://fiddle.jshell.net/_display/www.google.com＆＃34;而不是＆＃34; www.google.com＆＃34;

这是因为www.google.com是当前路径的本地相对网址。

JS Fiddle没有任何设定。这是你的代码。

如果要访问其他主机名，则需要绝对URL（例如，以http://或https://开头）或方案相对URL（以//开头）。

在JSFiddle中发出CORS请求

1 个答案: