Я пытаюсь найти решение, позволяющее веб-сайту узнать, по какому URL-адресу пользователя проходит через iframe.
Веб-сайт 1: http://website.website.com (Удаленный веб-сайт, можно добавить только javascript & html на веб-страницу)
Веб-сайт 2: https://example.com (полностью редактируемый, php, html, js и т. Д.)
Текущий код: (веб-сайта 2 (Example.com)
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" lang="en-US" prefix="og: http://ogp.me/ns# fb: http://ogp.me/ns/fb#">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>Website.com</title>
<meta name="viewport" content="width=device-width, initial-scale=1"/>
<script src="https://code.jquery.com/jquery-1.11.3.min.js"></script>
</head>
<body class="body_blank">
<script type="text/javascript">
jq = jQuery.noConflict();
jq(document).ready(function() {
var currentFramePath = '';
var iframe = '<iframe src="{src}" id="#iFrameContainer" style="position:fixed; top:0px; bottom:0px; right:0px; width: 100%; border: none; margin:0; padding:0; overflow: hidden; z-index:999999; height: 100%;">';
var urlFrame = getUrlParameter('currentFrame');
if(urlFrame != null && urlFrame != ''){
console.log("Frame not found");
jq('#iFrameContainer').html(iframe.replace('{src}', urlFrame));
currentFramePath = urlFrame;
}
jq('#iFrameContainer').click(function(){
console.log("Clicked in frame");
currentFramePath = jq(this).attr('href');
console.log(currentFramePath);
});
setInterval(function(){
window.location = window.location.href.split('?')[0] + '?currentFrame=' + currentFramePath;
console.log("Update Query");
}, 5000);
});
function getUrlParameter(sParam) {
var sPageURL = decodeURIComponent(window.location.search.substring(1)),
sURLVariables = sPageURL.split('&'),
sParameterName,
i;
console.log("Get Query");
for (i = 0; i < sURLVariables.length; i++) {
sParameterName = sURLVariables[i].split('=');
if (sParameterName[0] === sParam) {
return sParameterName[1] === undefined ? true : sParameterName[1];
}
}
};
</script>
<div id="wrapper" class="wrapper_blank">
<iframe src="http://website.website.com" id="#iFrameContainer" style="position:fixed; top:0px; bottom:0px; right:0px; width: 100%; border: none; margin:0; padding:0; overflow: hidden; z-index:999999; height: 100%;">
</div>
</body>
</html>
Задача
Если я обновляю страницу (iframe) на example.com, она обновляет и забывает страницу, на которой был / был пользователь ...
Как вы можете видеть, я пытался заставить его работать, обнаруживая их страницу через iFrame, однако это невозможно из-за того, что он находится в другом домене.
Решение
Я ищу какое-то решение для чего-то подобного описанному ниже, имея в виду, что может быть лучшее решение.
Я хочу, чтобы веб-сайт website.website.com получил текущий путь / URL-адрес страницы, на которой находится пользователь (которая просматривается через iframe), и чтобы он отправил этот путь / URL-адрес на example.com, тогда пример. com будет обновлять сеанс / временный файл cookie / временное локальное хранилище / переменную ... и т. д., что будет означать, что он настроит строку запроса так, чтобы она указывала на правильный URL-адрес, когда пользователь обновляет свою страницу, в результате чего обновление корректно запоминает страницу они были включены.
Попытка
Я попытался использовать функцию postMessage, разместив следующий код на соответствующих сайтах:
Сайт 1 Дополнительный код
<script type="text/javascript">
setInterval(function() {
parent.postMessage(window.location.pathname, "https://website.com");
},1000);
</script>
Сайт 2 Дополнительный код:
var eventMethod = window.addEventListener ? "addEventListener" : "attachEvent";
var eventer = window[eventMethod];
var messageEvent = eventMethod == "attachEvent" ? "onmessage" : "message";
eventer(messageEvent, function(e) {
console.log('Parent Message: ', e.data);
}, false);
Однако ничего не происходит, никаких консольных сообщений или ошибок ... просто ничего.
Я даже пытался скопировать подобные https://blog.teamtreehouse.com/cross-domain-messaging-with-postmessage, но ничего в этом не помогло: (
Есть идеи, что я делаю неправильно, и как решить эту проблему, чтобы добиться этого?
Спасибо
Редактирование
Я попробовал следующие js внутри http://website.website.com, но это не сработало:
localStorage.setItem('CurrentURLChecker', window.location.href)
if (localStorage.getItem('CurrentURLChecker')) {
if (window.parent.location.href == "https://website.com/" ) {
console.log("URL FOUND");
}
}
Uncaught DOMException: заблокирован фрейм с источником "http://website.website.com" от доступа к фрейму перекрестного происхождения в http://website.website.com/:251:44
РЕДАКТИРОВАТЬ - Пример
Веб-сайт 1 = "http://stackoverflow.serviceprovider.com"
Веб-сайт 2 = "https://stackoverflow.com"
Веб-сайт 2 содержит iframe, который показывает, что именно показывает Веб-сайт 1.
Я никогда не собираюсь посещать Веб-сайт 1, все клики осуществляются на Веб-сайте 2
Если мне нужно было щелкнуть ссылку внутри iframe, и она должна была перейти к: http://stackoverflow.serviceprovider.com/this-new-page/, тогда Веб-сайт 1 сможет обнаружить это, сохранить местоположение iframe и запомнить его.
Теперь, если я обновлю свой браузер вместо загрузки iframe http://stackoverflow.serviceprovider.com, он вместо этого загрузит фактически обновленную страницу, которая составляет http://stackoverflow.serviceprovider.com/this-new-page/
URL-адрес вкладки / окна всегда будет оставаться на https://stackoverflow.com/, но было бы необходимо добавить строку запроса, чтобы ссылки могли быть разделены.
Это так просто.