javascript - 如何从父窗口中的 iframe(Sharepoint 托管应用程序，(应用程序部分)))打开模式对话框弹出窗口

Question

所以我开发了这个共享点托管应用程序，其中包含一个呈现日历的应用程序部分，当他们点击某一天时，它必须打开一个模式弹出窗口，其中包含我已有的 url。

我会把错误贴在最后。

<script type="text/javascript" src="../Scripts/jquery-1.9.1.min.js"></script>
<script type="text/javascript" src="/_layouts/15/MicrosoftAjax.js"></script>
<script type="text/javascript" src="/_layouts/15/sp.runtime.js"></script>
<script type="text/javascript" src="/_layouts/15/sp.js"></script>

<!-- Core CSS File. The CSS code needed to make eventCalendar works -->
<link rel="stylesheet" href="../Content/eventCalendar.css">

<!-- Theme CSS file: it makes eventCalendar nicer -->
<link rel="stylesheet" href="../Content/eventCalendar_theme_responsive.css">

这是JS

var SPHostUrl;
var SPAppWebUrl;
var ListaEventos;
var Categoria;
var ready = false;
var $events = [];

// this function is executed when the page has finished loading. It performs two tasks:
//    1. It extracts the parameters from the url
//    2. It loads the request executor script from the host web
$(document).ready(function () {
    var params = document.URL.split("?")[1].split("&");
    for (var i = 0; i < params.length; i = i + 1) {
        var param = params[i].split("=");
        switch (param[0]) {
            case "SPAppWebUrl":
                SPAppWebUrl = decodeURIComponent(param[1]);
                break;
            case "SPHostUrl":
                SPHostUrl = decodeURIComponent(param[1]);
                break;
            case "TituloListaEventos":
                TituloListaEventos = decodeURIComponent(param[1]);
                break;
            case "Categoria":
                Categoria = decodeURIComponent(param[1]);
                break;
            case "NombreListaEventos":
                NombreListaEventos = decodeURIComponent(param[1]);
                break;
        }
    }

    // load the executor script, once completed set the ready variable to true so that
    // we can easily identify if the script has been loaded
    $.getScript(SPHostUrl + "/_Layouts/15/SP.RequestExecutor.js", function (data) {
        ready = true;
        getItems();
        ShowServerInformation();
    });


    var sub = SPHostUrl.substring(0, SPHostUrl.lastIndexOf('/'))
    $('head').append('<link rel="stylesheet" href="' + sub + '/Style%20Library/SPCCapatech/SPCCapatech.css">');
    $('head').append('<link rel="stylesheet" href="' + sub + '/Style%20Library/SPCCapatech/colors.css">');
});

function ShowServerInformation() {

    var options = {
        url: "/_layouts/Viewlsts.aspx&IsDlg=1",
        tite: 'Server Information',
        allowMaximize: false,
        showClose: true,
        width: 430,
        height: 230
    };
    parent.SP.SOD.execute('sp.ui.dialog.js', 'SP.UI.ModalDialog.showModalDialog', options);
    return false;

}

执行 showserverinformation 函数时出现此错误:

 Permission denied to access property "SP"

Answer 1

这是标准的安全限制。否则，任何 IFRAME JavaScript 都可以在父窗口中执行任何它想执行的操作。

为了操作父窗口你必须使用HTML 5 Messaging API :

1. 从您的 IFRAME 执行 window.postMessage() 以向父窗口发送“订单”。
2. 在父窗口中处理此消息并创建模态窗口作为对此消息的 react 。