Question

我的网页上有一个"Start Portal"按钮，下面有一个iframe（位于同一网页上），ID为MyFrame。

我使用jQuery AJAX获取基于angularjs的门户网站的URL并设置我的iframe的src。下面给出了基于angularjs的门户加载代码。＆＃39; portalURL＆＃39;参数包含URL。

$.ajax({
            method: 'post',
            crossDomain: true,
            contentType: "application/json; charset=utf-8",
            url: webmethodurl,
            data: {},
            dataType: "jsonp",
            jsonp: "JSONCallback",
            success: function(portalURL){
                $('#MyFrame').attr('src',portalURL);
            },
            error: function(e){
                console.log(e);
            }
        });

这很好用，我的AngularJS门户在iframe中正常打开。

但是，如果我再次单击"Start Portal"按钮，则会调用相同的AJAX代码，然后我再次获取AngularJS门户网站URL并再次加载。这很好，但有一个问题。

我有一些用AngilarJS run()方法编写的验证码：

//Some initializing code before Angular invokes controllers
MyApp.run(['$rootScope', function($rootScope) {
    ValidateSession();                   //1. First validate the session
}]);

function ValidateSession(){
    //this does some validation checks
}

现在，我的问题是，只有在我第一次点击run()时才调用此"Start Portal"方法。在后续点击中，它会从服务器端重新加载带有Portal URL的iframe，但是从不再调用angularjs run()方法。

我尝试手动引导角度应用，但无法正常工作。

不知何故，我想杀死或重新加载整个angularjs应用程序，如果之前已加载，并在iframe加载我的angularjs门户时开始新鲜。

我无法对iframe代码进行任何修改，就像在我的客户网站的制作中一样。我只需要为他们提供angularjs门户网址，他们将使用我使用的类似方法加载它。

Answer 1

为了防止从缓存中加载iframe内容，您可以将随机参数附加到portalURL：

success: function(portalURL) {
    // TODO: detect whether the portalURL already contains query string parameters
    // and use & instead of ?
    portalURL += '?v=' + (new Date()).getTime() + Math.floor(Math.random() * 1000000);
    $('#MyFrame').attr('src', portalURL);
},

Answer 2

这可以通过控制浏览器行为轻松实现

使用HTTP标头或标签控制来自Web服务器的iframe页面的浏览器缓存。

<meta HTTP-EQUIV="CACHE-CONTROL" CONTENT="NO-CACHE">
<meta HTTP-EQUIV="PRAGMA" CONTENT="NO-CACHE">

Anguarjs可以控制Angular App的加载方式，但无法控制iframe缓存。只有在加载整个页面时才重新加载iframe。

IFrame中的AngularJS run（）方法不会在iframe重新加载时重新运行

2 个答案: