Mam następujący kod aplikacji pojedynczej strony VUE JS łączącej się z Azure AD przez Vue-Msal, który działa, gdy I:

  • Otwórz aplikację internetową po raz pierwszy
    • zabiera mnie do strony logowania AAD
    • raz zalogowany, przekierowuje mnie z powrotem do mojej aplikacji
  • Wtedy mogę wykonać console.log() i wydrukować mój token dostępu itp., Aby zweryfikować, że login został udany, a token został pomyślnie

Załóżmy teraz, że zamknę kartę przeglądarki. Moja sesja logowania jest nadal tam (przecież nie usunięłem żadnych plików cookie!) Ale teraz mój token dostępu znikną (prawdopodobnie dlatego, że został zapisany jako zmienna, a nie w ciasteczku). Jak ponownie nabyć token dostępu, gdy otworzę nową kartę i przejść do mojej aplikacji?

# main.js
import Vue from 'vue'
import App from './App.vue'
import router from './router'
import msal from 'vue-msal';

Vue.config.productionTip = false

Vue.use(msal, {
  auth: {
    clientId: "CLIENT_ID_OF_MY_SINGLE_PAGE_APPLICATION"
    authority: "https://login.microsoftonline.com/TENANT_ID/",
    redirectUri: "http://localhost:8080/",
    requireAuthOnInitialize: true
  },
  request: {
    scopes: [ `user.read`, `https://backend-api-hosted-on-functionapp.azurewebsites.net/user_impersonation` ]
  },
  graph: {
    callAfterInit: true,
  },
  cache: {
    cacheLocation: "sessionStorage"
  }
});

new Vue({
  router,
  render: h => h(App),
  data: function() {
    return {
      dummyVariable: 'dummyValue',
    }
  },
  created() {
    console.log("User auth status is: " + this.$msal.isAuthenticated());
    console.log("User data object: " + JSON.stringify(this.$msal)) // shows the bearer token the first time, but when I then close the tab and re-open the tab, I see nothing here
  }

}}).$mount('#app')

Więc mam kilka pytań:

  1. Czy "miał być" ponownym nabyciem nowego tokena, jeśli aplikacja zostanie ponownie załadowana? Czy ta konwencjonalna praktyka?

  2. Jeśli tak, jak mam iść na to? Próbowałem użyć użycia:

    if ((this.$msal.data.isAuthenticated == false) || (this.$msal.data.accessToken == false)) {
      console.log("New token required");
      this.$msal.signIn();
      console.log("User data object: " + JSON.stringify(this.$msal))
    }

Ale to nie daje mi nic niestety.

0
chivano 2 sierpień 2020, 23:52

1 odpowiedź

Najlepsza odpowiedź

Zgodnie z przypadkiem każdy inny kończy się na tym pytaniu, nie jest to problem z moim kodem jako taki, ale ciągły problem między Vue-Msal a pakietami MSSL, jak wyjaśniono w tej kwestii GH: https://github.com/mvertopoulos/vue-msal/issues/33

1
chivano 3 sierpień 2020, 20:06