Wie erkennt man die Änderung des Seitentitels in Google Chrome von einer Erweiterung?
Ich erstelle eine Google Chrome-Erweiterung und muss erkennen, wenn sich der Titel einer Seite ändert. Der Titel der Seite wird wie in Twitter geändert: (num) Twitter (siehe Screenshot unten) - wenn ein neuer Tweet gepostet wird, erhöht sich die Anzahl. Beispiel:
Ich versuche, die Titeländerungen einer URL zu erkennen, die auf einer meiner Registerkarten geladen ist, und gebe einen Signalton aus, wenn es einen Unterschied gibt. Diese Überprüfung muss in einem wiederholten Intervall durchgeführt werden und ich denke, dass dies mit setTimeOut() function erreicht werden kann.
Ich habe ein manifest.json wie folgt erstellt:
Allerdings habe ich keine Ahnung von dem Rest. Ich habe die Dokumente 1 2 und versuchten die Lösungen für ähnliche Stack Overflow-Threads wie
javascript
google-chrome
google-chrome-extension
4 Antworten
Anstatt in Kommentaren zu argumentieren, dass ein bestimmter Ansatz besser ist, lassen Sie mich konstruktiver sein und fügen Sie eine Antwort hinzu, indem Sie eine bestimmte Implementierung
Mein Ansatz basiert auf einer Antwort hier auf SO und anstatt polling-driven (Überprüfung in festen Intervallen) ist ereignisgesteuert (über mögliche Änderungen der Bedingung informiert werden).
Zu den Vorteilen gehört die sofortige Erkennung einer Änderung (die andernfalls erst bei der nächsten Abfrage erkannt werden würde) und das Verschwenden von Ressourcen bei Umfragen, während sich die Bedingung nicht ändert. Zugegebenermaßen gilt das zweite Argument hier kaum, aber das erste Argument steht noch.
Architektur auf einen Blick:
-
Injizieren Sie ein Inhaltsskript in die fragliche Seite.
-
Analysiere den Anfangszustand des Titels, berichte auf der Hintergrundseite über
sendMessage. -
Registrieren Sie einen Handler für ein Titeländerungsereignis.
-
Wenn das Ereignis ausgelöst wird und der Handler aufgerufen wird, analysieren Sie den neuen Status des Titels, und berichten Sie über
sendMessagean die Hintergrundseite.
Schon Schritt 1 hat einen Haken. Normaler Inhalt Skript-Injektionsmechanismus, wenn das Inhaltsskript im Manifest definiert ist, wird es in Seiten bei der Navigation zu einer Seite, die der URL entspricht injizieren.
%Vor%Das funktioniert ziemlich gut, bis Ihre Erweiterung neu geladen wird . Dies kann in der Entwicklung auftreten, wenn Sie Änderungen vornehmen, oder in implementierten Instanzen, während sie automatisch aktualisiert werden. Was dann passiert ist, dass Inhaltsskripte nicht in vorhandene offene Seiten eingefügt werden (bis die Navigation geschieht, wie ein Reload). Wenn Sie sich daher auf eine manifestbasierte Injektion verlassen, sollten Sie auch eine programmatische Injektion in bereits geöffnete Registerkarten berücksichtigen, wenn die Erweiterung initialisiert wird:
%Vor% Auf der anderen Seite werden Inhaltsskript-Instanzen, die zum Zeitpunkt des Erweiterungs-Reloads aktiv waren, nicht beendet, sind jedoch verwaist: : Jede sendMessage oder ähnliche Anfrage wird fehlschlagen. Es wird daher empfohlen, beim Versuch, mit der Elternerweiterung zu kommunizieren, immer auf Ausnahmen zu überprüfen und bei fehlgeschlagener Ausführung selbst zu beenden (durch Entfernen von Handlern):
Schritt 2 hat auch einen Haken, obwohl es von den Besonderheiten des Dienstes abhängt, den Sie gerade sehen. Auf einigen Seiten im Bereich des Inhaltsskripts wird nicht die Anzahl der ungelesenen Elemente angezeigt. Dies bedeutet jedoch nicht, dass keine neuen Nachrichten vorhanden sind.
Nachdem ich gesehen habe, wie der Webservice funktioniert, kam ich zu dem Schluss, dass wenn der Titel ohne Navigation in etwas geändert wird, der neue Wert korrekt angenommen wird, aber für den ursprünglichen Titel "keine neuen Elemente" als unzuverlässig ignoriert werden sollte / p>
Der Analysecode berücksichtigt also, ob es sich um das erste Lesen oder die Behandlung eines Updates handelt:
%Vor% Es wird mit dem ursprünglichen Titel und changed = false in Schritt 2 aufgerufen.
Schritte 3 & amp; 4 sind die wichtigste Antwort auf "wie man Titeländerungen beobachtet" (ereignisgesteuert).
%Vor% Genauere Informationen dazu, warum bestimmte Optionen von observer.observe festgelegt sind, finden Sie in der ursprünglichen Antwort .
Beachten Sie, dass notify mit changed = true aufgerufen wird. Wenn Sie also von "(1) The Old Reader" zu "The Old Reader" ohne Navigation gehen, wird dies als "echte" Änderung von null ungelesen angesehen Nachrichten.
Nachdem Sie die Tabs-API von Chrome untersucht haben, sieht es nicht so aus, als ob Ihnen irgendetwas direkt auffällt. Sie sollten jedoch einen Ereignis-Listener an den Titelknoten der Registerkarte (n), an denen Sie interessiert sind, anhängen. Das Mutationsereignis DOMSubtreeModified funktioniert in Chrome. Ein schneller Test in einem normalen HTML-Dokument funktioniert für mich - sollte nicht anders sein als innerhalb einer Erweiterung.
%Vor%-
Erstellen Sie eine Veranstaltungsseite .
-
Erstellen Sie ein Inhaltsskript , das beim Laden einer Webseite in eine Webseite eingefügt wird.
> -
Verwenden Sie innerhalb des Inhaltsskripts
setIntervalDie Seite abfragen, um zu sehen, obwindow.document.titlesich ändert. -
Wenn sich der Titel geändert hat, verwenden Sie
chrome.runtime.sendMessage, um eine Nachricht zu senden zu Ihrer Veranstaltungsseite. -
Hören Sie auf Ihrer Veranstaltungsseite mit
chrome.runtime.onMessageundeinen Ton abspielen .
Setzen Sie chrome.tabs.onUpdated.addListener in Ihr Hintergrundskript:
changeInfo ist ein Objekt, das Titeländerungen enthält, z. hier:
Screenshot des changeInfo-Objekts in der Konsole
Kann dann auf das Objekt filtern, so dass eine Aktion nur auftritt, wenn changeInfo eine Titeländerung enthält. Für zusätzliche Manipulation, z.B. Wenn Sie auf Seitentiteländerungen mit Seiteninhalt / Aktionen reagieren, können Sie eine Nachricht an Inhaltsskript aus dem Listener senden, wenn die Bedingungen erfüllt sind.
Tags und Links javascript google-chrome google-chrome-extension