Ich habe eine einzelne Seite App, die mit anderen Diensten wie Dropbox und LinkedIn integriert ist. Zum Beispiel hat Dropbox eine großartige API und ich habe die Authentifizierung durch Öffnen des Dropbox-Authentifizierungslinks in einem anderen Fenster durchgeführt. Sobald der Benutzer sich authentifiziert hat, bitte ich ihn, das neue Fenster zu schließen, um zu meiner App zurückzukehren.
Dies ist eindeutig suboptimal, da es den Benutzer von meiner App wegnimmt und auf Tablets noch umständlicher.
Wie würde ich die Authentifizierung in der App durchführen, z. B. in einem Leuchtkasten oder in einem modalen Formular?
Beachten Sie, dass die Integration selbst serverseitig und nicht clientseitig erfolgt. Zurzeit verfügt die Dropbox-Authentifizierungsseite über eine Rückrufseite, die meinem Server signalisiert, dass die Authentifizierung erfolgreich war, und die ich zur späteren Verwendung in der Tabelle des Benutzers in der Datenbank ablege.
Hinweis: Der Kopfgeldkommentar sollte lauten: Ein Codebeispiel ist sehr erwünscht, aber nicht erforderlich.
Was Sie vorschlagen, ist das Sicherheitsmodell zu besiegen, also sollte es nicht möglich sein. Der Benutzer sollte in der Lage sein, die URL der realen Seite zur Überprüfung zu sehen. Stellen Sie sich vor, wenn Sie mit Paypal bezahlen, überprüfen Sie wahrscheinlich, dass Sie auf paypal.com sind, bevor Sie Ihre wichtigen Daten eingeben, oder? Das Gleiche gilt für alle anderen Apps. Es ist ein sehr hässlicher Fluss, aber das Beste, was die Industrie heute erreicht hat.
Der ideale Ablauf ist, wenn Sie den Benutzer auf die Website oder App eines Drittanbieters umleiten. Der Benutzer meldet sich an und autorisiert sich und leitet Sie dann an Sie zurück. Eine native App hat den Vorteil, dass sie zu einer anderen nativen App wechselt, sodass der Fluss weniger hässlich ist.
Die Work around, die tun würde, was Sie wollen, ist eine App, die nach dem Namen und Passwort des Benutzers für den Dienst des Drittanbieters fragt, und dann den Auth hinter den Kulissen tanzen lässt. Dies wird wahrscheinlich Benutzer von Ihrer App abschrecken und ist sehr gefährlich. Ich empfehle es nicht.
Sie können den Autorisierungsendpunkt in einem iframe auf Ihrer Webseite laden. Beachten Sie jedoch, dass einige Browser Beschränkungen für Cookies haben, die an den Login-Anbieter innerhalb eines iFrames gesendet werden. In der Regel (Safari, iOS) haben Sie nur Lesezugriff auf die Cookies, was ausreichend ist, wenn der Sitzungscookie bereits beim Anbieter festgelegt ist.
Auf Ihrer Rückrufseite - wo Sie nach der Authentifizierung von Dropbox zurückgeschickt werden; Sie müssen eine JavaScript-Funktion aufrufen, um ein Ereignis auf der übergeordneten Seite auszulösen. Diese Authentifizierung ist abgeschlossen.
%Vor%Das übergeordnete Element kann dann den iframe entfernen und als authentifiziert fortfahren.
%Vor%Wegen des möglichen Cookie-Problems würde ich Ihnen empfehlen, alle Authentifizierungsschritte durchzuführen, die vom Server-Ende initiiert wurden, bevor überhaupt die Haupt-HTML-Seite geliefert wird. Dann stellen Sie sicher, dass Ihre App nicht zweimal geladen wird. Dies ist ein typisches Verhalten vieler Authentifizierungs- / Identitäts-Middleware-Softwarelösungen.
Wenn Sie app erwähnen, ist es unklar, ob Sie eine reine WebApp meinen oder ob Sie das Steuerelement in einer hybriden App mithilfe von Frameworks wie Phonegap verfügbar haben. Mit Phonegap oder ähnlichem können Sie einen Browser innerhalb des Browsers innerhalb der App laden - in diesem Fall ist der ChildBrowser nicht mit denselben Cookie-Beschränkungen eingeschränkt.
Ich habe vor kurzem ein Tutorial geschrieben, wie dies mit Phonegap und Childbrowser für iOS funktioniert.
Beachten Sie, dass in diesem Lernprogramm OAuth 2.0 verwendet wird, das sich etwas von OAuth 1.0 unterscheidet.
Wenn es sich bei Ihrer App um eine Webanwendung handelt, können Sie den Fluss am besten optimieren, indem Sie die aktuelle Seite umleiten (z. B. Umleiten zu einer anderen Webseite in JavaScript / jQuery? ) auf die / authorize-Seite auf Dropbox, mit einem oauth_callback auf eine Seite in Ihrer App, die zeigt an, dass der Prozess abgeschlossen wurde.
So ist der Fluss nur:
Und das alles geschieht innerhalb einer einzigen Seite, ohne zusätzliche Fenster zu schließen / zu öffnen.
Tags und Links javascript singlepage dropbox-api linkedin