16

KontekstJak uwierzytelnić żądanie POST z rozszerzenia chrome do mojej aplikacji za pomocą tokenów internetowych JSON?

Moi HapiJS aplikacja internetowa jest obecnie za pomocą OAuth 2.0 dostęp do API Google. Po uwierzytelnieniu użytkownika w aplikacji, serwer generuje JSON Web Token (JWT), który jest przechowywany na kliencie i odsyła w nagłówku kolejnych żądań Authorization.

Co chciałbym osiągnąć

I teraz chciałbym używać tych samych czynności (autoryzacja + Stworzenie JWT) z moim rozszerzenie Google Chrome, który synchronizuje dane z powrotem do aplikacji za pośrednictwem punktu końcowego REST.

Aktualne Myśli

Mój pomysł jest użycie tej samej autoryzacji OAuth jak mam w mojej aplikacji do generowania JWT, a następnie zapisać ten JWT do rozszerzenia Chrome. Ta JWT zostanie następnie przekazana z każdym żądaniem z mojego rozszerzenia chrome do mojej aplikacji, aby potwierdzić żądanie.

Niestety wygląda na to, że rozszerzenie Chrome używa własnej autoryzacji za pośrednictwem interfejsu Chrome Identity API i nie pozwoli mi użyć procesu uwierzytelniania, który miałem na myśli.

Poniższy schemat opisuje kroki mam envisioning uzyskać JWT stworzony na mojej aplikacji następnie zapisywane na moim chrom rozszerzenie (a także wskazuje, gdzie leży problem): diagram

Kwestii

Moje pytanie brzmi: czy istnieje inny lub lepszy sposób przechowywania JWT utworzonego w mojej aplikacji na moim rozszerzeniu Chrome?

Mam nadzieję, że moje wyjaśnienie jest wystarczająco jasne, dziękuję.

+0

Czy wypróbowałeś API 'storage'? https://developer.chrome.com/extensions/storage – Moin

+0

Wyświetl odpowiedni kod, który próbuje uzyskać JWT. – wOxxOm

+0

Powtarzające się kroki do kopiowania/przykładowe aplikacje Nie jest dla mnie jasne, czy problem polega na uzyskaniu JWT na rozszerzeniu lub uzyskaniu rozszerzenia na korzystanie z JWT –

Odpowiedz

0

Jeśli chcesz, aby twój plik popup.html zawierał łącze umożliwiające użytkownikom otwieranie (prowadząc do OAuth Google w twoim modelu), potrzebujesz więcej pracy niż prosty link zakotwiczenia.

Będziesz musiał dodać detektory zdarzeń do łącza i użyć chrome.tabs.create.

Oto kod demo:

popup.html

<html> 
    <body> 
     <span class="link" data-href="https://www.google.com">link</span> 
     <span class="link" data-href="https://www.bing.com">link</span> 
     <span class="link" data-href="https://www.yahoo.com">link</span> 

     <script> 

      //get all links 
      var links = document.getElementsByClassName('link'); 

      //loop through each link 
      for (var ii = 0, nn = links.length; ii < nn; ii++) 
      { 
       //add listener 
       links[ii].addEventListener('click', function(e) 
       { 
        //grab link 
        var url = this.getAttribute('data-href'); 

        //open link in new tab using chrome.tabs.create method 
        chrome.tabs.create({url:url}); 
       }); 
      } 
     </script> 
    </body> 
</html> 
0

można używać localStorage zapisać JWT z aplikacji internetowych, a następnie, jeśli rozszerzenie działa na tej samej domenie , możesz uzyskać dostęp do zapisanych informacji z localStorage za pośrednictwem skryptu treści, który zostanie wstrzyknięty na tę stronę. Możesz komunikować się ze swoim wyskakującym okienkiem za pomocą interfejsu API Message Passing dla rozszerzeń Chrome.

Problem z tym podejściem polega na tym, że zapisywanie sensownych informacji, takich jak informacje o użytkowniku (które są zakodowane w jwt), jest niezadowolone ze względu na obawy związane z bezpieczeństwem.

Idealnie powinieneś mieć serwer, który obsługuje uwierzytelnianie tam iz powrotem, zapisuje informacje i emituje token sesji dla swoich klientów, który następnie możesz zapisać w localStorage, jeśli chcesz.

Powiązane problemy