0

Ich habe eine Chrome-Erweiterung erstellt, die den Benutzer in seinem Konto protokolliert. Auf der popup.html können Sie die Login-URL wählen (Wir haben 2 Portale EU und US) und geben Sie Ihre Login-Daten ein. Danach klicken Sie auf den Button "Login". Dann öffnet sich ein neuer Tab mit der URL und die Erweiterung füllt das Login-Formular mit Benutzername und Passwort. Dann sollte es auf den Button auf dem neuen Login-Formular klicken, das wird nicht funktionieren.Chrome-Erweiterung: Öffnen Sie die neue Registerkarte und klicken Sie auf die Schaltfläche

manifest.json

{ 
    "manifest_version": 2, 

    "name": "mbCONNECT24 Login", 
    "short_name": "MBCL_Login", 
    "description": "This extension log you into your mbCONNECT24 account", 
    "version": "1.7", 
    "options_page": "options.html", 
    "icons": { "16": "icon16.png", 
      "48": "icon48.png", 
      "128": "icon128.png" }, 
    "browser_action": { 
    "default_icon": "icon.png", 
    "default_popup": "popup.html" 
    }, 

    "author": "Johannes Regner <[email protected]>", 
    "permissions": [ 
    "activeTab", 
    "<all_urls>","*://*/*", 
    "storage" 

    ] 
} 

Popup.html

<!doctype html> 
<html> 
    <head> 
    <title>mbCONNECT24 Login</title> 
    <script src="popup.js"></script> 
    <script src="options.js"></script> 
    <link href="bootstrap.min.css" rel="stylesheet"> 
    </head> 
    <body> 
    <div style="padding:20px;"> 
     <img src="mbconnect24.png" /> 
    <form> 

     <div class="form-group"> 
     <label for="portals">Server</label> 
     <select id="portals" class="form-control"> 
      <option value="https://rsp.mbconnect24.net/portal/">mbCONNECT24 RSP EU</option> 
      <option value="https://rsp.mbconnect24.us/portal/">mbCONNECT24 RSP US</option> 
     </select> 
     </div> 
     <div class="form-group"> 
     <label for="username">Username</label> 
     <input type="text" class="form-control" id="username" placeholder="Username"> 
     </div> 
     <div class="form-group"> 
     <label for="password">Password</label> 
     <input type="password" class="form-control" id="password" placeholder="Password"> 
     </div> 
     <button id="gotoLogin" class="btn btn-success">Login</button> 
    </form> 

</div> 
    </body> 
</html> 

Mein Code in popup.js ist folgende:

window.addEventListener("load", function() 
{ 
    document.getElementById("gotoLogin") 
      .addEventListener("click", gotoLogin, false); 
}, false); 


function gotoLogin() { 
    var selectlist = document.getElementById("portals"); 
    var url = selectlist.value; 

    var username = document.getElementById("username").value; 
    var password = document.getElementById("password").value; 


    var logincode = 'var loginField = document.getElementById("modlgn_username");'+ 
      'var passwordField = document.getElementById("modlgn_passwd");'+ 
      'loginField.value = "'+username+'";passwordField.value ="'+password+'";'+ 
      'document.getElementById("loginBtn").click();'; 

    var tabId = null; 

    //var tabs = chrome.extension.getViews(); 
    //console.log(tabs); 
    chrome.tabs.create({"url": url}, function(tab){ 
    tabId = tab.id; 

    //chrome.tabs.executeScript(tab.id, {file: 'content.js', runAt: 'document_end',code: 'var myUsername = "'+username+'";'}); 
    }); 

    chrome.tabs.update(tabId, {url: url}); 
    chrome.tabs.executeScript(tabId, {code: logincode, runAt:"document_end",allFrames:true}, function(result){ 
    }); 

} 

Vielleicht ist es der falsche Weg? Jetzt öffnet es die neue Registerkarte und füllt das Formular, aber nicht auf die Schaltfläche klicken. Wenn ich den Befehl 'document.getElementById ("loginBtn") eintippe, klicke();' In der Konsole wird die Schaltfläche angeklickt.

Vielen Dank!

+1

Bitte bearbeiten Sie die Frage zum Thema: Fügen Sie ein ** complete ** [mcve] ein, das das Problem dupliziert. Einschließlich * manifest.json *, einige der Hintergrund- und * Inhaltsskripte. Fragen, die Debugging-Hilfe suchen ("** warum funktioniert dieser Code nicht? **") müssen Folgendes enthalten: ► das gewünschte Verhalten, ► ein bestimmtes Problem oder einen Fehler * und * ►den kürzesten Code, der für die Wiedergabe in der Frage erforderlich ist selbst**. Fragen ohne eine klare Problemstellung sind für andere Leser nicht nützlich. Siehe: "** Wie erstelle ich ein [mcve] **", [Was kann ich hier fragen?] (Http://stackoverflow.com/help/on-topic) und [ask]. – Makyen

+1

Insbesondere benötigen wir die * manifest.json * und genug des HTML der Seite und Popup, um das Problem zu duplizieren. – Makyen

+1

Hinweis: Wie in [diese Antwort] (http://stackoverflow.com/a/40815514/3773011) erläutert, führt die Nichtcodierung der übergebenen Werte zu einer Sicherheitslücke (potenzielle Code-Injektion). Darüber hinaus besteht auch bei normalem Gebrauch die Möglichkeit, dass Ihr 'Code' beschädigt wird, wenn entweder der Benutzername oder das Passwort ein' '' enthalten, was ein perfekt gültiges Zeichen in einem Passwort (und vielleicht in einem Benutzernamen) sein kann. B. mit: 'passwordField.value = JSON.parse ('+ JSON.stringify (password) +'); '' sowohl für 'password' als auch für' username' sollte ausreichen. – Makyen

Antwort

0

Context scripts im Kontext von Webseiten laufen.

Also zuerst müssen Sie das Inhaltsskript registrieren, wie die document sagte.

Dann, nachdem Benutzer das Formular in popup senden, können Sie die Kontoinformationen in chrome extension storage speichern.

Wenn auf die Seite zugegriffen wird, können Sie die Kontoinformationen aus dem Chrome-Erweiterungsspeicher abrufen und auf der aktuellen Seite ausfüllen.

+1

Aber wenn ich Context-Skript hinzufügen, wird es jedes Mal ausgeführt, wenn ich die Seite besuche. Ich habe ein Inhaltsskript für diese URL erstellt, aber es löst immer die Login-Schaltfläche aus ... Es ist nicht optimal! –

+0

Ich denke, wir öffnen Sie eine Registerkarte im Popup, können Sie einige zusätzliche Dinge hinzufügen. – Yang

+0

Wie "www.google.com" fromPopup = true ". – Yang

Verwandte Themen