0

我正在开发一个启动弹出对话框的应用程序，该对话框需要一个会话，但是它正在丢失。到目前为止，这仅在 Chrome 上发生。我在 Opera 和 Edge 中进行了测试，两者都在工作。我只是失去了 Chrome 中的会话。我也在 SuperUsers 网站上提交了这个问题。为额外的代码道歉，可能没有必要。

下面是一个产生对话框的jsfiddle。

https://jsfiddle.net/0kv4bqjy/2/

html

<div id="apollo-actions-wrapper" data-uri="www.sap.com">
    <div id="apollo-inner-wrapper">
        <a href="javascript:" id="launch-apollo"><img src="https://www.apolloproject.xyz/a/images/apollo-launcher.png"/></a>
        <span id="apollo-likes"><span id="likes-span"></span> likes</span>
        <span id="apollo-shares"><span id="shares-span"></span> shares</span>
        <span id="apollo">Apollo</span>
    </div>
</div>

Javascript

    var ResourceRequest = function(){

    var http = function(uri, method){

        var request = new XMLHttpRequest();
        request.onprogress = updateRequestProgress;

        return new Promise(function(resolve, reject){
            request.onreadystatechange = function () {

                if (request.readyState !== 4) return;
                if (request.status >= 200 && request.status < 300) {
                    resolve(request);
                } else {
                    reject({
                        status: request.status,
                        statusText: request.statusText
                    });
                }
            };
            request.open(method ? method : 'get', uri, true);
            request.send();
        });
    }

    var updateRequestProgress = function(arg){
    }

    return {
        http: http
    }
}


var popup = {}


var actionsWrapper = document.getElementById("apollo-actions-wrapper")
var innerActionsWrapper = document.getElementById("apollo-inner-wrapper");
var launchApollo = document.getElementById("launch-apollo")
var likesWrapper = document.getElementById("apollo-likes")
var sharesWrapper = document.getElementById("apollo-shares")
var likesSpan = document.getElementById("likes-span")
var sharesSpan = document.getElementById("shares-span")
var apolloSpan = document.getElementById("apollo")

addActionStyles()

var req = new ResourceRequest()
var uri = actionsWrapper.getAttribute("data-uri")

var likesUri = "https://www.apolloproject.xyz/a/resource/likes?uri=" + encodeURIComponent(uri);
var sharesUri = "https://www.apolloproject.xyz/a/resource/shares?uri=" + encodeURIComponent(uri);

var likesUriDev = "/a/resource/likes?uri=" + encodeURIComponent(uri);
var sharesUriDev = "/a/resource/shares?uri=" + encodeURIComponent(uri);

req.http(likesUri).then(updateLikes).catch(error)
req.http(sharesUri).then(updateShares).catch(error)

var launcher = document.getElementById("launch-apollo")

launcher.addEventListener("click", function(){

    var uri = actionsWrapper.getAttribute("data-uri")

    var src = "https://www.apolloproject.xyz/a/resource?uri=" + encodeURIComponent(uri)
    var srcDev = "http://localhost:8080/a/resource?uri=" + encodeURIComponent(uri)

    var height = 575;
    var width = 437
    var top = (screen.height - height) / 4;
    var left = (screen.width - width) / 2;

    popup = window.open("", "ApolloResourceAction", 'top=100 left=' + left + ' width=437 height=575')
    popup.document.write('<iframe width="' + width + '" height="' + height + '"  allowTransparency="true" frameborder="0" scrolling="yes" style="width:100%;" src="'+ src +'" type="text/javascript"></iframe>');
})

function updateLikes(request){
    var data = JSON.parse(request.responseText)
    console.log(data)
    likesSpan.innerHTML = data.likes
}

function updateShares(request){
    var data = JSON.parse(request.responseText)
    sharesSpan.innerHTML = data.shares
}

function addActionStyles(){
    innerActionsWrapper.style.cssText = "position:relative;width:140px; height:57px;"
    launchApollo.style.cssText = "color:#2cafed;font-size:39px;font-weight:bold;text-decoration:none;"
    likesWrapper.style.cssText = "position:absolute; left:49px; top:0px; font-size:12px;"
    sharesWrapper.style.cssText = "position:absolute; left:49px; bottom:27px; font-size:12px;"
    likesSpan.style.cssText = "font-size:12px;"
    sharesSpan.style.cssText = "font-size:12px;"
    apolloSpan.style.cssText = "font-size:11px;display:block;clear:both;"

    var css = '#launch-apollo:hover{ color: #617078 !important }' +
                '#apollo-actions-wrapper{ text-align:left; display:inline-block; width:140px; height:57px; }';

    var style = document.createElement('style');

    if (style.styleSheet) {
        style.styleSheet.cssText = css;
    } else {
        style.appendChild(document.createTextNode(css));
    }

    document.getElementsByTagName('head')[0].appendChild(style);
}

var timer = setInterval(function () {
    if (popup.closed) {
        clearInterval(timer);
        window.location.reload(); // Refresh the parent page
    }
}, 1000);

function error(){
    console.log(error)
}

谢谢你。

4

1 回答 1

1

事实证明，Chrome 不久前已经针对外部站点内的弹出窗口更新了它的 cookie 要求。就我而言，我必须将SameSite设置为None并将Secure设置为true。

于 2020-12-10T04:12:42.463 回答