Ajax、子域、200 响应和图像——可以吗？

Question

这是一个与 AJAX、子域和 200 OK 响应非常相似的问题 （和 JavaScript 同源策略 - 如何它适用于不同的子域？），但有一点不同。我遇到这样的情况：

• 域 (www.example.com)
• 子域 (sd.example.com/cat/id) 的页面
• 需要向另一个子域 (cdn.example.com) 发出 ajax 式请求

与上述问题相反，我要求的是图像。

• 图像的 GET 请求（使用 jQuery $.load()）

这似乎工作得很好。因为它工作得很好，所以当有人指出它在 Firebug 中生成错误时，我并没有立即想到同源策略。

• 图像 ARE 在 localhost 加载（test.sd.example.com/cat/id 的 apache VirtualHost url）

但是，由于我链接的那个问题，现在我想到了这个，我担心这个在生产中无法可靠工作。

• 这会继续在生产环境中工作吗？它会跨浏览器可靠地工作吗？

答案：不——它只是看起来好像在工作；事实并非如此

• 如果不是，我该如何解决？ （我不认为我可以 JSONP 图像...可以吗？）

答：继续设置图片的src&等待显示，直到加载事件触发。

• 如果是这样，我该如何阻止 Firebug 错误？如果我可以的话。 （他们吓坏了其他开发人员。）

答案：同上——去掉实际对图像文件进行 GET 请求的步骤。

初始代码

function(imageUrl, placeTarget){
 var i = new Image();
 var img = $(i);
 img.hide()
 .load(imageUrl, function(e){
  // console.log("loadImage: loaded");
  placeTarget.attr("src", imageUrl);
  return true;
 })
 .error(function(){
  // error handling - do this part
  // console.log("loadImage: error");
  return false;
 });
 return;
} // loadImage

Answer 1

为什么不通过创建图像元素并设置 src 将图像插入页面中？还有什么可以更简单呢？

编辑：...通过 javascript

我不确定这是否完全正确，但在 jquery 中：

img = $('<img>');
img.attr('src', 'http://somewhere.com/some_image.jpg');
$('#place_to_add').append(img);
img.ready(fade_into_next);

Answer 2

查看这篇文章： JavaScript 同源策略 - 如何它适用于不同的子域吗？