1

当页面加载时，它包含一个第 3 方 iframe（阅读：文件上传器）。我选择一个文件，单击“开始上传”按钮，上传完成后，我会收到“谢谢 - 上传完成”消息。

  • 没有 Ajax 响应（据我所知）。

  • 第 3 方确实允许我指定消息。我还可以在该消息中添加 ...。

上传完成后，我需要使用从一开始就知道的 upload_file_id 更新隐藏的输入。如果“上传完成”消息/时刻/事件，我想捕捉/使用什么。但是页面的动态性对我来说有点新，我可以使用一些支持。

提前致谢。

4

1 回答 1

3

不幸的是，您将无法访问 iframe 的任何有用属性，除非它与您的代码位于同一主机/域中。这是所有当前/有价值的浏览器都实现的安全功能 - 称为同源或跨域策略。

检测第三方 iframe 中更改的唯一选项是第三方代码是否支持向周围框架发送消息。有几种方法可以做到这一点，但他们需要支持它。如果他们不这样做，那么您无能为力。如果是我，我会检查以下内容：

  1. 阅读第三方文档，看看他们是否支持触发任何js消息或事件
  2. 看看第三方系统是否提供了除 iframe 之外的另一种方式来实现相同的功能。

脚本标签？

关于您可以添加的消息，您是否测试过是否可以向该消息添加任何 HTML 标记？这不太可能，但如果是这样，您可以添加自己的脚本标签以与您的框架进行通信，以触发您自己的功能（即`window.iframeSuccess`）并告诉您事件已经发生......


以下代码仅在双方属于同一域（外框和 iframe）的情况下才有效。否则会被同源策略屏蔽。

<script>
if( window && window.parent && window.parent.iframeSuccess ){
  window.parent.iframeSuccess();
}
</script>

相反，您可以实现以下专为帧之间的通信而设计的内容。这是一个更现代的解决方案，因此不适用于旧版浏览器 - 要查看支持它的内容，您可以在此处阅读：

现在有哪些浏览器支持 window.postMessage 调用？

一个如何使用的例子window.postMessage——首先是外框里的代码：

function messageListener(event){
  /// make sure we only get messages from where we expect
  if ( event.origin != "http://the-domain-we-expect-from.com" ){ return; }
  /// here you can do what you want depending on the message you get
  alert(event.data);
}

/// define for nearly every modern browser
if (window.addEventListener){
  addEventListener("message", messageListener, false);
} else {
  /// fallback for internet explorer
  attachEvent("onmessage", messageListener);
}

然后将代码放在iframe中：

if( window && window.parent && window.parent.postMessage ){
  window.parent.postMessage('success', 
     'http://the-domain-we-are-sending-to.com');
}

有关更多信息，您可以在此处阅读：

https://developer.mozilla.org/en-US/docs/DOM/window.postMessage

图片标签？

如果他们阻止脚本标签，他们可能会允许图像标签。如果是这种情况，您有一个稍微棘手的选项可用，即嵌入一个报告回服务器端脚本的图像，然后该脚本可以在数据库中标记事件......

<img src="http://mysite.com/image-that-is-actually-a-script.php?id=user-id" />

但是，要让您的 javascript 注意到此事件，您将需要某种轮询系统，该系统会不断地从您的 js （通过 ajax 或 websockets）检查您的服务器端数据库——并且您需要能够在两者上唯一地识别用户具有某种 id 的双方（您的和第三方） 。所以这种方法只有在第三方系统允许你在显示给用户的消息中插入用户 ID （或其他一些唯一的用户信息）时才真正可行。如果您别无选择，这几乎是最后的后备方案。

于 2012-09-29T11:57:39.233 回答