matt-ankerson / vue-adal Goto Github PK
View Code? Open in Web Editor NEWAn example showcasing the usage of the excellent ADAL JS library in a Vue JS application.
License: MIT License
An example showcasing the usage of the excellent ADAL JS library in a Vue JS application.
License: MIT License
Hi Matt,
Thank you for sharing your library. It helped me very much. However I still have the following issue:
I modified your example to redirect any user not logged in to a seperate loginpage. Clicking on the login button will trigger the Azure AD authentication process. After a successful login I want the user to be redirected to the root index ('/').
In order to achieve that I set my redirectUri to http://127.0.0.1:8081/ and also set the config variable navigateToLoginRequestUrl to false.
Now what happens after a login is that I do get redirected to the root index however the page ist completely blank. There is no error but the content of the site is simply not loaded. Hitting a refresh button afterwards will load the UI into the browser.
Do you have any idea what the reason could be? Right now , I assume that it could have something to do with the way your initialize method for ADAL works but I'm not sure.
I appreciate any help. Thank you!
Kind regards
Tobias
I have set requireAuthOnInitialize
to false, but on startup it still redirects to outlook login page.
Is this bug or I am doing something wrong?
Hey mate,
First of all, thank you so much for this example, this is gold.
I think I am really close to make it working, but I am struggling with finding the right configuration. Currently I am getting an Token renewal operation failed due to timeout issue if I call the acquireToken() function.
In your ./authentication/index.js file you have tenant, clientId, redirectUri and cacheLocation. I try to figure out what those settings are, but unfortunately the Microsoft documentation is not very consistent with their naming.
tenant: 'xxxxxxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx',
clientId: 'xxxxxxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx',
redirectUri: 'http://localhost:8080',
cacheLocation: 'localStorage'
Tenant: Is that right that the tenant is an Id? Found as Directory Id in Azure Portal under AAD > Properties
ClientId is clear for me
redirectUri: Is that just the base url of your app? or would it be something like http://localhost:8080/auth/redirect?
Also I noticed that in the same file you still have 2 placeholder for the functions acquireToken and acquireTokenRedirect "azure active directory resource id"
Active Directory Resource Id: So is that the instance? like 'http://login.microsoftonline.com'?
Thank you very much for sharing your work so far, you are a legend
Cheers
I have a single site that has multiple URL's that hit it. How can I set the RedirectURI to be the base of where the user hit the site from. For instance
if a user navigates to https://domain1.mydomain.org I want the redirectURI to be that domain, if they originally navigated via https://domain2.mydomain.org I want the RedirectURI to be domain2.mydomain.org.
I tried setting the this.$adal via the app.vue but it appears that it cannot be changed that way. Any ideas?
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.