I have recently cloned a sample project on GitHub jwt-spring-boot-security-angularjs
I understood most of parts of it but there's something I don't really get that is when I refresh my browser I get logged out
I tried adding using session storage
$http.defaults.headers.common['Authorization'] = $sessionStorage.loginSession;
I put this line of code to the home.js which run at initialization but still ends up logged out when I refreshed the browser
any ideas? will be helpful if its explained thoroughly
Related
I'm trying to implement mixpanel script into my react app.. as per the docs I've pasted the mixpanel snippet inside index.html inside the head tag & the token key is also set.
But i still get this msg shown below inside my mixpanel dashboard.
In this tutorial we can trigger an event from console.log and can see the event in mixpanel dashboard but when i try to do the same mixpanel.track returns undefined.. instead it should have returned an object as shown in the video.
I then tried to follow this article from medium.. https://medium.com/#andrewoons/setting-up-mixpanel-in-react-3e4c5b8c2a36. but still no luck..
set:
const trackAutomaticEvents = true;
const mixpanel = new Mixpanel("Your Project Token", trackAutomaticEvents);
The main culprit is the browser settings..
Go to browser settings > Privacy and security > Cookies and other site data
Turn Off Send
‘Do Not Track’ request with your browsing traffic
Enable
Allow all cookies
This should fix the problem
Had the same problem. Mohammed's suggestion works. Rather than fight Chrome's permission UI, I tested console in Safari and then I saw my test event "Jono Force" in the Live Event view.
I have recently been migrating my app from Meteor JS to Ionic Framework. One that has been a struggle is finding a really good plug and play Facebook login oAuth.
Currently it just needs to control view access based on logged in or logged off. As well as returning the Facebook user id.
I have searched for many with Ionic and the best I have gotten to work so far is ng-cordova. But it is rather confusing because it references another git repo from Wizcorp, and seems to run several errors upon setup.
So I am curious is anyone has a better tutorial to follow, or an overall sure fire plugin.
I did facebook login using Openfb+ InAPP Browser .
First create App on developer.facebook.com and then use In App Browser plugin
And adding to the answer, you have to build the login flow, manually.
Facebook: Build the login flow manually
I am using AngularJS to build a web app. I use ngRoute for routing and templating. I use gulp-serve to start my website locally. Once for few days it suddenly stops working. After I change local port it works ok.
For example: First it worked on port localhost:3000, but stopped and doesn`t work anymore
then the same with ports 3001,3002,3003,3004
Stopped working means it doesnt load template any more. If I try to access template file directly it is ok, but angular isnt loading it. In debug console there are no messages.
Can somebody explain how is it possible.
I guess I am not in a position to give you a 100% perfect explanation of this issue, but I am assuming that somewhere in your gulp-serve config the default to serve your app is set to port:3000. By attempting to reach the other ports you listed your app is not loading...
The problem was somewhere in cookies. After I clear cookie it goes ok. I use Auth0 service for logging. Maybe the problem is somewhere in their angularjs sdk.
I'am doing my first AngularJS project with ASP.NET Web API backend. What I am trying to do is, whenever a user visits www.mydomain.com, a login page (index.html) will displayed. After successfull login, he will be redirected to the dashboard.html (this is the shell page, partial views go here). My project structure is shown below-
I am confused about some issues:
Is this the best/common practices what i am trying to do in above?
As because dashboard.html is the main page, should i place app.js on dashboard.html?
If i put app.js on dashboard.html, will index.html (login page) have another app.js (i.e. loginApp.js)?
How should I manage the login state i.e. IsUserLoggedId, UserId etc in angular part?
This question may be silly. I googled, but did not find any example/article addressing such issue.
Would you please help?
Thank you in advance.
I am not sure how ASP.NET deals with it, but to my knowledge ASP.NET is just a server side framework whereas AngularJS is client side framework.
These two framework solve different problem, but has some overlapping features.
If you start using angularjs, then most of the time you will deal with the term "Single Page Application (SPA)".
There are different approaches in how you can handle the url redirection after login. I will just show you two example. There are many more how you can handle the user authentication and session.
First Approach:
In SPA, most of the time browser will change the url route and state directly in the page itself without making the entire page request from the server.
With that said, your dashboard.html will most likely be come a static template file which will be loaded from the browser directly. (i.e. the server does not dynamically parse the dashboard.html but only serve as a static file). Upon the user login, the angularjs will fire a asynchronous HTTP request into the ASP.NET authentication end point. A successful login may return a token to the browser, and the client will use it to manage the user session. At the same time, the Angular will have to change the route to /dashboard/. Notice that that the entire flow happens transparent to the user, it does not fire a full page HTTP request.
Second Approach:
Alternatively, if you choose to redirect from the server, you will have to send a HTTP Redirect 302. and since HTTP redirect will eventually call make a full HTTP request to /dashboard/, and it will then have to reload and bootstrap the angular app.js from the browser again. In this case, the user will have to wait for the dashboard page to be processed by the server upon login
Issues:
Is this the best/common practices what i am trying to do in above? there are many approaches, I think it is best to find the one that works for you. If you have a RESTful API, then you might want to have a look at the SPA approach in more detail.
As because dashboard.html is the main page, should i place app.js on dashboard.html? in SPA, you don't need to load app.js twice. but if you use the second approach, you have to reload the app.js again.
If i put app.js on dashboard.html, will index.html (login page) have another app.js (i.e. loginApp.js)? depends on your approach as stated above
How should I manage the login state i.e. IsUserLoggedId, UserId etc in angular part? Authentication Strategy, UNIX style authorization
There are more official guide that can help AngularJS Developer Guide.
Hope this helps you to integrate with the ASP.NET authentication mechanism.
you should have multiple shell pages. this link can help you...
refer to Multiple Shell Pages part.
The simple thing of calling FB.init (right before </body>) and then FB.getLoginStatus(callback) doesn't fire the callback function.
After some debugging, I think the SDK is stuck in the "loading" (i.e. FB.Auth._loadState == 'loading') phase and never gets to "loaded", so all callbacks are queued until the SDK has loaded.
If I force-fire the "loaded" event during debugging - with FB.Event.fire('FB.loginStatus', 'loaded') in case you're intersted - then the callbacks are invoked correctly.
Extra details that might be relevant:
My app is a facebook iframe app (loaded via apps.facebook.com/myapp)
I'm using IE9. The same behavior happens in Chrome
The app is hosted in http://localhost
What's going on? Why is the SDK never gets to loaded?
Thanks
UPDATE: Just tried it on Chrome and it worked (not sure why it didn't work before). Still doesn't work in IE
I had this same problem in Firefox 3.5 on Windows, but only on the very first log in to the page (probably because it was a slower machine and there was some weird timing issues going on).
I fixed it by forcing FB to refresh the login status cookie every time it checks:
FB.getLoginStatus(callback, true); //second argument forces a refresh from Facebook's server.
Without "force=true", sometimes it wouldn't fire the callback.
I had the exact same problem, and I solved it disabling "Secure Browsing" in the Facebook Security settings. Keeping Secure Browsing on forces the pages as "https", but I had no "Secure Canvas URL" set up, and this gave me a lot of errors in the console as well.
Hope this may help someone :)
In my experience, getLoginStatus() never calls the callback in Firefox when third-party cookies are disabled.
The original poster mentioned his application is hosted on http://localhost. I've never had luck with that, and believe it will cause problems.
Just today, I've had problems where getLoginStatus is not calling the callback on any browser, unless the user is actually connected to the app! I'm hoping this is a bug on facebook's end that they will solve.
Yet another possibility for FB.getLoginStatus not firing its callback is when using a "test" user account that has not been authorized to view that application. Its pretty bad that facebook doesn't give you any error messages.
I have also seen failed callbacks on bad appIds and redirectUrls.
I also ran into this issue specifically in Chrome. I tried calling it on page load and after a user-initiated action with no success.
It turned out that it was not a cross-domain issue. The getLoginStatus() call was being blocked by the Un-Passwordise extension in Chrome. As soon as I disabled the extension, it worked perfectly, even on page load.
More info about this issue here: Chrome-only cross-domain scripting errs in Facebook iFrame App upon FB.Login(..)
I understand that this question is a little old now, but I ran across it searching for solutions.
Double-check what you have set in your Facebook app configuration under the section "Website with Facebook Login". The Site URL domain must match the domain your page with the FB.getLoginStatus (and other related auth Javascript) is served from.
After hours of struggling, I realized that I could not reuse an existing app configuration I had on a new server and had to create a new app to handle the website login for this new server.
The other answers are probably equally valid in your specific case, but since there may be others like me who have struggled for a while on this, hopefully this gives you one other place to check. Making a new app with the correct Site URL was the answer in my particular case.