So erhalten Sie den Eingabefeldwert von Chrome Extension

8

Ich arbeite daran, zu lernen, wie man eine Google Chrome Extension erstellt. Ich habe ein Kontaktformular auf einer Webseite, die ich zum Testen verwende. Ich versuche, eine Erweiterung zu erstellen, die die Eingabefeldwerte aus diesem Formular liest. Zu dieser Zeit habe ich:

manifest.json

%Vor%

popup.html

%Vor%

popup.js

%Vor%

Wenn ich dies tue, verhält es sich so, als könnte es nicht auf die Eingabefelder von der Webseite zugreifen, auf der sich der Benutzer befindet (nicht die Webseite der Erweiterung). Was mache ich falsch? Vermisse ich eine Erlaubnis? Das glaube ich nicht. Es funktioniert jedoch nicht und ich bin mir nicht sicher warum.

Danke für Ihre Hilfe.

    
Zach Templeton 30.01.2018, 16:08
quelle

4 Antworten

3

Wie von Gabriel Bleu berichtet, benötigen Sie ein Inhaltsskript, um mit den Webseiten in den Chrome-Tabs zu interagieren.

Hier unten sehen Sie ein Beispiel für eine Chrome-Erweiterung, bei der ein Inhaltsskript zwei "Befehle" für popup.js enthält.

Siehe Code-Kommentare für eine Erläuterung.

manifest.json (ähnlich wie Ihres)

%Vor%

popup.html (ähnlich wie deins außer jQuery für einfache DOM-Manipulation)

%Vor%

popup.js

%Vor%

content_script.js

%Vor%

S. S.: offensichtlich ist jQuery nicht zwingend erforderlich

    
beaver 07.02.2018 16:15
quelle
1
  

Wenn Ihre Erweiterung mit Webseiten interagieren muss, benötigt sie ein Inhaltsskript. Ein Inhaltsskript ist ein JavaScript, das im Kontext einer Seite ausgeführt wird, die in den Browser geladen wurde. Stellen Sie sich ein Inhaltsskript als Teil dieser geladenen Seite vor, nicht als Teil der Erweiterung, mit der es gepackt wurde (seine übergeordnete Erweiterung).

Ссылка

    
Gabriel Bleu 07.02.2018 13:05
quelle
1

Hier ist der Fehler, den Sie erhalten:

%Vor%

Anstatt zu versuchen, das DOM des aktuellen Tabs in popup.js abzurufen, würde ich vorschlagen, ein Inhaltsskript zu verwenden, um die Aufgabe auszuführen und das Ergebnis als eine Nachricht an das Popup zu senden.

manifest.json

%Vor%

In der Datei manifest.json müssen Sie das Inhaltsskript hinzufügen und die URLs der Websites festlegen, in die Sie das Skript einfügen möchten.

popup.js

%Vor%

Senden Sie in popup.js eine Anforderung an das Inhaltsskript, um die Anzahl der Eingabefelder zu ermitteln, und fügen Sie die Antwort in div ein.

content.js

%Vor%

Erstellen Sie eine neue Datei namens content.js . Diese Datei wird in die Webseite eingefügt und hört Nachrichten von der popup.js ab. Wenn eine Nachricht ankommt, berechnet sie die Antwort und sendet sie zurück an popup.js.

Weitere Informationen zu Inhaltsskripten finden Sie in der Dokumentation .

    
sc3w 14.02.2018 12:31
quelle
-1

Das Hauptproblem Ihres Ansatzes besteht darin, dass Sie versuchen, einen DOM-Baum über die Nachricht / sendResponse vom Inhaltsskript zum Popup / Hintergrund zu senden, um sie dort zu verarbeiten. Sie können keine DOM-Bäume über message / sendResponse senden.

Ein besserer Ansatz wäre, das DOM im Inhaltsskript zu behandeln und die gewünschten Informationen (in Ihrem Fall die input -Werte) an die Popup- / Hintergrundseite zurückzusenden.

Eine Möglichkeit, dies zu tun, wäre:

popup.js

%Vor%     
Iván Nokonoko 07.02.2018 19:45
quelle