深度链接到WordPress中的嵌入式iframe内容

Question

是否有一个WordPress插件可以实现深层链接到嵌入式iframe？例如，我希望能够发布一条帖子的URL，该帖子包含额外的信息，并将其传递给iframe。

一个例子是播放视频的iframe。这种情况下的额外信息可能是开始播放视频的时间偏移量。

额外的信息可以作为查询参数，片段或其他方式传递。

Answer 1

可能不会通过WordPress插件，除非您正在寻找开发自定义插件。

最好避免iframes，只要你可以为these reasons。

也就是说，使用window.postMessage方法和works in most browsers（包括IE8及更高版本）的解决方案非常简单。

注：

• 所有消息应被作为字符串，以避免在IE8/9一个讨厌的错误。如果你想传递一个对象，以JSON格式传递它。
• 您不能在对象在IE8 window.location。如果您尝试传递该对象，则必须逐个复制属性。
• IE只支持el.contentWindow.postMessage()，而不是el.postMessage()。

外部页面

window.onload = function() 
{ 
    var child = document.getElementById('deep_link_frame'); 
    var msg = { 
     "location" : { 
      "hash"  : window.location.hash, 
      "host"  : window.location.host, 
      "hostname" : window.location.hostname, 
      "href"  : window.location.href, 
      "origin" : window.location.origin, 
      "pathname" : window.location.pathname, 
      "port"  : window.location.port, 
      "protocol" : window.location.protocol, 
      "search" : window.location.search 
     } 
    }; 
    child.contentWindow.postMessage(JSON.stringify(msg), '*'); 
}; 

内页

function bindEvent(el, eventName, eventHandler) 
{ 
    if (el.addEventListener) 
    { 
     el.addEventListener(eventName, eventHandler); 
    } 
    else 
    { 
     el.attachEvent('on' + eventName, eventHandler); 
    } 
} 

bindEvent(window, 'message', function(e) 
{ 
    if (e.origin === "http://your-domain.com") 
    { 
     var message = JSON.parse(e.data); 
     alert(message.location.href); 
    } 
});