Блог

Я работаю над приложением, которое инициирует всплывающее диалоговое окно, для этого диалогового окна требуется сеанс, однако оно теряется. Пока это происходит только в Chrome. Я протестировал в Opera и Ed&e, оба работают. Я теряю сеанс только в Chrome. Я также отправил этот вопрос на сайт суперпользователей. Приносим извинения за дополнительный код, вероятно, в нем нет необходимости.

Ниже приведен jsfiddle, который создает диалоговое окно.

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

HTML

 <div id="apollo-actions-wrapper" data-uri="www.sap.com"&&t;
    <div id="apollo-inner-wrapper"&&t;
        <a href="javascript:" id="launch-apollo"&&t;<im& src="https://www.apolloproject.xyz/a/ima&es/apollo-launcher.pn&"/&&t;</a&&t;
        <span id="apollo-likes"&&t;<span id="likes-span"&&t;</span&&t; likes</span&&t;
        <span id="apollo-shares"&&t;<span id="shares-span"&&t;</span&&t; shares</span&&t;
        <span id="apollo"&&t;Apollo</span&&t;
    </div&&t;
</div&&t;
  

Javascript

     var ResourceRequest = function(){

    var http = function(uri, method){

        var request = new XMLHttpRequest();
        request.onpro&ress = updateRequestPro&ress;

        return new Promise(function(resolve, reject){
            request.onreadystatechan&e = function () {

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

    var updateRequestPro&ress = function(ar&){
    }

    return {
        http: http
    }
}


var popup = {}


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

addActionStyles()

var req = new ResourceRequest()
var uri = actionsWrapper.&etAttribute("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.&etElementById("launch-apollo")

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

    var uri = actionsWrapper.&etAttribute("data-uri")

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

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

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

function updateLikes(request){
    var data = JSON.parse(request.responseText)
    console.lo&(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; hei&ht:57px;"
    launchApollo.style.cssText = "color:#2cafed;font-size:39px;font-wei&ht: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-ali&n:left; display:inline-block; width:140px; hei&ht:57px; }';

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

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

    document.&etElementsByTa&Name('head')[0].appendChild(style);
}

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

function error(){
    console.lo&(error)
}
  

Спасибо.

Оказалось, что Chrome некоторое время назад обновил требования к файлам cookie для всплывающих окон на внешних сайтах. В моем случае мне пришлось установить для SameSite значение None и Secure значение true.