En javascript, Comment puis-je identifier de manière unique une fenêtre de navigateur à partir d'une autre qui sont sous le même sessionId à base de cookie
les utilisateurs de mon application web peuvent avoir plus d'une fenêtre de navigateur ouverte et pointé vers la même page. Je voudrais que l'état de certaines choses dans la page (chargée via ajax) soit maintenu à travers les postbacks. Je peux stocker dans un cookie ou sur mon serveur. De toute façon, je ne vois pas comment distinguer chaque fenêtre.
par exemple, disons que L'utilisateur Bob a deux fenêtres de navigateur ouvertes à la page ListOfSomething. Chaque liste a un LoadedPageNumber attribut que je dois persister. Sinon, les utilisateurs finissent toujours à la page 1 quand ils se rafraîchissent. Bob aurait pu charger la fenêtre 1 du navigateur et la pointer vers la page 5, puis Charger la fenêtre 2 du navigateur et la pointer vers la page 14. Si je stocke l'attribut basé sur l'id de session, Bob aura la page 14 dans la fenêtre 1 s'il le rafraîchit.
noter que mes variables d'état sont en fait beaucoup plus complexe que ce simple exemple et mon incapacité à les persister pourrait conduire à de gros problèmes (faiblesses dans mon application).
j'ai besoin d'une sorte d'identification de fenêtre de navigateur ou quelque chose. Il a bien sûr besoin d'être une solution de navigateur (IE6+, Wekbit?+, FF2+)
des idées?
Note sur la pertinence: gardez à l'esprit que cela est utile aussi pour le cas où vous mélangez des pages basées sur des formulaires plus anciens avec des éléments plus récents activés AJAX. Parfois, vous devez postback les formulaires et vous ne voulez pas perdre certains client côté état valeur.
5 réponses
vous pouvez définir votre propre nom de fenêtre, la syntaxe exacte m'échappe en ce moment, mais vous pouvez utiliser l'heure actuelle et l'id de session pour créer un id unique sur la charge de fenêtre, puis utiliser cet id
cela se ferait de la même façon que vous définissez un nom dans la fenêtre javascript.fonction open (), (mais vous pouvez le faire à soi-même, au lieu d'une nouvelle fenêtre)
googler montre:
self.la fenêtre.nom = myclass.getUniqueWindowId( thisSession );
UPDATE
en ce qui concerne votre besoin de sauvegarder ceci de refresh à refresh, j'ai fait quelques tests et il semble de le sauvegarder de refresh à refresh. En utilisant Firefox 3, lors de la charge initiale, le nom de la fenêtre est vide, et en appuyant sur CTRL+R encore et encore, et le nom de la fenêtre a été rempli. j'ai alors commenté le réglage du code de nom et l'ai rechargé et il a encore conservé le nom.
<script type="text/javascript">
alert( self.window.name );
self.window.name = "blah";
</script>
UPDATE
je dois faites remarquer le commentaire ci-dessous sur le plugin "jQuery-session" de jQuery, qui fonctionne vraiment et offre bien plus que ce qui est discuté ici.
bien que , il faut également préciser qu'il s'appuie sur le stockage Web de HTML5, non pris en charge par des versions plus anciennes D'IE .
Corporate dépend toujours fortement sur IE 7 ('et ci-dessous' ici au Brésil).
basé sur self.window.name
, la solution pour tout ce qui n'est pas conforme à HTML5, j'offre l'extrait de code suivant comme solution de cross-browser:
<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
<script language="javascript" type="text/jscript">
//----------------------------------------------------------------------
//-- guarantees that window.name is a GUID, and that it would
//-- be preserved whilst this window's life cicle
//----------------------------------------------------------------------
//-- window.name will be set to "GUID-<SOME_RANDOM_GUID>"
//----------------------------------------------------------------------
$(window).load(
function () {
//----------------------
var GUID = function () {
//------------------
var S4 = function () {
return(
Math.floor(
Math.random() * 0x10000 /* 65536 */
).toString(16)
);
};
//------------------
return (
S4() + S4() + "-" +
S4() + "-" +
S4() + "-" +
S4() + "-" +
S4() + S4() + S4()
);
};
//----------------------
if (!window.name.match(/^GUID-/)) {
window.name = "GUID-" + GUID();
}
}
) //--------------------------------------------------------------------
</script>
j'ai trouvé la fonction GUID ici (pour laquelle j'ai proposé un peu de nettoyage de code).
Qu'en est-il si votre serveur génère au hasard un ID et que celui-ci est stocké dans la page (une certaine variable javascript) lorsqu'il est servi? Ensuite, il suffit d'inclure cet ID dans la requête ajax. Il n'aidera pas sur un rafraîchissement de navigateur, mais aussi longtemps que l'utilisateur laisse cette page en place (et laisse juste le truc ajax faire son truc) il devrait fonctionner très bien.
Il est il y a longtemps, mais la réponse de Roy Rico m'a aidé aujourd'hui, je veux partager mon expérience. Pour gérer le rafraîchissement de page et les utilisations de backbutton de page, je le fais comme ça:
- votre serveur vérifie si le navigateur envoie le GUID avec sa demande (ne fonctionne qu'avec ajax ou form submit)
- si elle n'est pas là (rafraîchissement du navigateur, backbutton), elle renvoie simplement une page avec un petit script JavaScript. Ce script crée la ligne directrice et mets-le dans la fenêtre.nommer l'entreposage tel que décrit ci-dessus. Après cela le script crée une forme avec le GUID comme champ caché et la soumet au serveur. L'attribut d'action utilise la même URL qu'avant (fenêtre.emplacement.href)
-- > maintenant le serveur reconnaît le GUID et peut fournir le contenu selon les besoins.
Voici mon code (le GUID que je crée sur le serveur pour des raisons de sécurité, la syntaxe " ${gUid} est de freemarker et insère juste le Guid du serveur):
<script>
$(window).load(
function () {
if (!window.name.match(/^GUID-/)) {
window.name = "GUID-" + "${gUid}";
}
$('<form action='+window.location.href+' method="POST"><input type="hidden" name="X-GUID" id="X-GUID" value='+window.name+'></form>').appendTo('body').submit();
}
);
</script>
L'espoir qui aide quelqu'un
soit dit en passant, cette technique ne doit être utilisée que sur les" PAGES NON référencées", en raison du besoin de JavaScript pour obtenir le contenu. Mais en général les pages de référencement n'ont pas besoin d'identifier la session de tabulation.
bien sûr de nos jours, vous pouvez utiliser le stockage de session HTML5, mais je ne veux pas compter sur cela, parce que j'ai aussi besoin d'un navigateur plus ancien pour bien fonctionner.
.le nom peut être écrasé par les bibliothèques javascript personnalisées, etc datetimepickers.
au lieu de fenêtre.nom je vous suggère D'utiliser la balise DOM head meta pour stocker votre id
<html><head><meta id="windowID" content="{YOUR ID}">
après que la page est chargée, vous devez tout charger via ajax dans cette fenêtre, alors vous pouvez attacher cet ID à chaque demande comme une valeur d'en-tête (ou de données). Par exemple en JQuery avec ce code:
$(document)
.ajaxSend(function(event, jqXHR, ajaxOptions) {
jqXHR.setRequestHeader('windowID',
document.getElementById('windowID').content);
})
pour utiliser ce solution, vous devez avoir accès à des valeurs d'en-tête personnalisées côté serveur. Par exemple en Java servlet:
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
String windowName = request.getHeader("windowID");
si vous stockez le paging, le tri, le filtrage, etc. informations sur le côté serveur en tant qu'attribut de session, vous devriez les stocker séparément attachés à la fenêtre séparée ID-s.
vous pouvez utiliser le stockage de session HTML5 ,juste générer un id unique et le mettre sur le stockage de session ! ce qui est cool à propos de chaque fenêtre ou un onglet a sa propre session de stockage. par exemple:
si nous exécutons ce qui suit sur 3 fenêtres:
fenêtre 1:
sessionStorage.setItem('key' , 'window1');
fenêtre 2:
sessionStorage.setItem('key' , 'window2');
fenêtre 3:
sessionStorage.setItem('key' , 'window3');
sessionStorage.getItem('key' );
< < < cela retournera la valeur correspondante de la fenêtre!
fenêtre 1:
sessionStorage.getItem('key' );
retourne la fenêtre 1
fenêtre 2:
sessionStorage.getItem('key' );
retourne la fenêtre 2
fenêtre 3:
sessionStorage.getItem('key');
retourne la fenêtre 3
je crois que vous essayez d'enregistrer une variable (séparément sur chaque onglet/fenêtre).
sessionStorage fonctionne comme un charme.
le seul problème que vous pourriez rencontrer que le navigateur devrait supporter HTML 5.