it-swarm.com.de

Wie kann ich mithilfe von Javascript feststellen, ob die Registerkarte "Browser" bereits geöffnet ist?

Woher wissen oder prüfen, ob die beiden Browser-Registerkarten bereits geöffnet sind und ob diese Registerkarten geöffnet sind? Der Benutzer erhält eine Warnmeldung oder eine Meldung, die besagt, dass die URL in reinem/nativem JavaScript bereits geöffnet ist. Dieser Browser-Tab enthält eine externe Website, die ich nicht manipulieren oder ändern darf. Vielen Dank

Beispiel-URLs

yahoo.com and google.com

Ich möchte den Nutzer benachrichtigen, wenn für yahoo.com und google.com bereits ein Tab geöffnet ist

Und ich möchte tabCreate verwenden, um die URL wie folgt zu öffnen:

tabCreate("http://maps.google.com/", "tabMapsPermanentAddress");
mean to open a new tab, it is use in creating chrome extension
14
User014019

Sie können etwas wie folgt verwenden

<!-- HTML -->
<a id="opener">Open window</a>

// JavaScript
var a = document.getElementById('opener'), w;        
a.onclick = function() {
  if (!w || w.closed) {
    w = window.open("https://www.google.com","_blank","menubar = 0, scrollbars = 0");
  } else {
    console.log('window is already opened');
  }
  w.focus();
};

Arbeiten mit jsBin | Mehr über die window.open-Methode

Wenn Sie mehr als ein Fenster steuern möchten, verwenden Sie den folgenden Ausschnitt

<!-- HTML -->
<a href="https://www.google.com" class="opener">Open google.com</a> | 
<a href="http://www.yahoo.com" class="opener">Open yahoo.com</a> 

//JavaScript
window.onload = function(){
  var a = document.querySelectorAll('.opener'), w = [], url, random, i;
  for(i = 0; i < a.length; i++){
    (function(i){
      a[i].onclick = function(e) {
        if (!w[i] || w[i].closed) {
          url = this.href;
          random = Math.floor((Math.random() * 100) + 1); 
          w[i] = window.open(url, "_blank", random, "menubar = 0, scrollbars = 0");
        } else {
          console.log('window ' + url + ' is already opened');
        }
        e.preventDefault();
        w[i].focus();
      };
    })(i);
  }
};

Arbeiten mit jsBin

Wenn Sie nicht möchten, dass sie in einem separaten Fenster geladen werden, schließen Sie diese Zeile aus

random = Math.floor((Math.random()*100)+1);

und random reference aus der nächsten Zeile entfernen

w[i] = window.open(url, "_blank", random, "menubar=0,scrollbars=0");

Randbemerkung: Wie Sie oben sehen können, haben wir zwei Fenster mit Inhalten von Drittanbietern erstellt. Sie sollten wissen, dass es keine Möglichkeit gibt, einen Verweis (auf das übergeordnete/Öffner-Fenster) von ihnen zu erhalten.

8
hex494D49

Eine Grundidee besteht darin, die Tabulatoranzahl entweder in einem Cookie oder in localStorage zu speichern, beim Laden der Seite zu erhöhen und beim Entladen der Seite zu dekrementieren:

if (+localStorage.tabCount > 0)
    alert('Already open!');
else
    localStorage.tabCount = 0;

localStorage.tabCount = +localStorage.tabCount + 1;
window.onunload = function () {
    localStorage.tabCount = +localStorage.tabCount - 1;
};

Versuchen Sie öffnen Sie diese Geige in mehreren Registerkarten.

Beachten Sie, dass diese Technik jedoch ziemlich fragil ist. Wenn beispielsweise der Browser aus irgendeinem Grund abstürzt, wird der Entladehandler nicht ausgeführt, und der Synchronisierungsvorgang wird unterbrochen.

6
Casey Chu

Die Antwort von Casey Chu funktioniert einwandfrei, bis der Browser bei geöffneter Seite abstürzt. Bei jeder nächsten Ausführung hat das Objekt localStorage die Variable tabCount mit einem Wert ungleich Null initialisiert. Daher ist es eine bessere Lösung, den Wert in einem Session-Cookie zu speichern. Das Session-Cookie wird entfernt, wenn der Browser erfolgreich beendet wird. Wenn der Browser abstürzt, bleibt der Sitzungscookie tatsächlich erhalten, glücklicherweise jedoch nur für eine nächste Ausführung des Browsers.

Objekt sessionStorage ist für jede Registerkarte unterschiedlich, daher kann es nicht für die gemeinsame Anzahl von Registerkarten verwendet werden.

Dies ist die verbesserte Lösung mit js-cookie library.

if (+Cookies.get('tabs') > 0)
    alert('Already open!');
else
    Cookies.set('tabs', 0);

Cookies.set('tabs', +Cookies.get('tabs') + 1);

window.onunload = function () {
        Cookies.set('tabs', +Cookies.get('tabs') - 1);
};
2
Grzegorz Żur

Diese Antwort: https://stackoverflow.com/a/28230846 ist eine Alternative, die keine Cookies/js-Cookie-Bibliothek erfordert. Es passte besser zu meinen Bedürfnissen. In aller Kürze (vollständige Beschreibung finden Sie in der verlinkten Antwort):

$(window).on('storage', message_receive);

...

// use local storage for messaging. Set message in local storage and clear it right away
// This is a safe way how to communicate with other tabs while not leaving any traces
//
function message_broadcast(message)
{
    localStorage.setItem('message',JSON.stringify(message));
    localStorage.removeItem('message');
}


// receive message
//
function message_receive(ev)
{
    if (ev.originalEvent.key!='message') return; // ignore other keys
    var message=JSON.parse(ev.originalEvent.newValue);
    if (!message) return; // ignore empty msg or msg reset

    // here you act on messages.
    // you can send objects like { 'command': 'doit', 'data': 'abcd' }
    if (message.command == 'doit') alert(message.data);

    // etc.
}
0
Paul Higgins