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

Question

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

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

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

Answer 1

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

对于these reasons，最好尽可能避免使用 iframe。

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

注意事项：

• 所有消息都应作为字符串发送以避免 IE8/9 中的严重错误。如果要传递对象，请以 JSON 格式传递。
• 您不能在 IE8 中 JSON.serialize() 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);
    }
});