I am facing some difficulty with AngularJS and opening a new window(window.open('URL'))
Consider the scenario, I want clients on my web-app to authenticate via third-party services like Facebook, Stripe, etc.
I have my web-app built in AngularJS and bootstrap.
On click of 'Add Account' button, I would like to open a new window with the respective URL. Everything upto here works.
But when I try to access the window object from the parent web-app, it gives an error: Blocked a frame with origin "http://localhost" from accessing a cross-origin frame
I need to access the child window URL from the parent to detect URL change, and I also need to access the content of the child window.
So the whole workflow is
When I click on 'Add Account' from my web-app
A new window opens, which hits a URL on my Server
Which then calls the Stripe Authentication URL
The User signs-in with his Stripe credentials
After successful signing in, Stripe auth redirects the callback to my Server
Which then sends a ACK = Success
I then read the ACK from my web-app(parent)
After receiving the ACK, and checking it, close the new window which was opened
Please help !!
One way to do this,
You can have an intermediary page which opens the URL on your server. The server url returns with a hashtag #success or #error after the authentication with the third party page. The intermediary page loads again and looks for the hashtag and calls opener window.
Related
I have created a multitenant application in the Azure Portal. I have set its redirect URIs and Front-channel logout URL.
I opened a normal(not incognito) Chrome window and I give consent to my application with a Microsoft account. Then I opened another incognito Chrome window and went to https://myaccount.microsoft.com/(it redirect me to sign in page firstly) after that I clicked to Sign out everywhere button. However any request come to API that listen to GET requests of Front-channel logout URL so I could not clear any datas from the database.
However if I open the another Chrome window withhout incognito mode, a request is always comes to API that listen to GET requests of Front-channel logout URL if Sign out everywhere button is clicked.
So, why a request is not sent when I am using incognito window? I expect that Microsoft should know the logged in session and send a request for it even if the Sign out everywhere action is done in another incognito session.
The general guide I am following for this is: https://learn.microsoft.com/en-us/azure/active-directory/develop/
The specific guide is this: https://learn.microsoft.com/en-us/azure/active-directory/develop/scenario-web-app-sign-user-sign-in?tabs=java#sign-out
The example project that I am use it for making practicing: https://github.com/Azure-Samples/ms-identity-java-webapi/tree/master/msal-web-sample
The button that I am clicking and could not get a GET request to my front channel logout url which is set in my application page on Azure Portal when I try to click that button in a different incognito window or different browser window is shown below:
I have a running react web application with protected routes. We are using JSON web tokens. We also using Redux saga. I want to provide a link and This need to be open in a new tab. But when the user logged in and click on the link, the link opens in a new tab but it asks user name and password again. I want to share the current state with the app in the new tab.
How are you storing the JWT? The most common way to do it is to store the JWT in cookies which automatically get sent on every request in the same domain. As long as the JWT is in a cookie, the cookie gets passed to the server, and the server checks for and uses the JWT payload, you should be able to open a new tab just fine.
Say I have two applications open, one in each tab, and they both leverage the same SSO server. The user globally logs out (front-channel) in App A, but App B remains open in another tab. The front-channel takes care of wiping the cookies but ideally there would be a way to redirect App B to a "you've been logged out" page. However, since it's not possible to detect HTTPOnly cookies via javascript, how can the javascript running in App B's tab detect the removal of the cookie and direct the user? I suppose we could write a non-HTTPOnly cookie as well and monitor that but I thought there may be a better solution out there.
IdentityServer4 supports this via the "session status change" spec here:
https://openid.net/specs/openid-connect-session-1_0.html#ChangeNotification
This allows your app to ping (via postMessage calls to an iframe) for changes to the current session and receive a response indicating if it's changed or not. This all happens client-side and it uses a non-HTTP-only cookie which is populated with the current session ID.
The endpoint in question is advertised as check_session_iframe in the /.well-known/openid-configuration
oidc-client-js implements this out of the box but for a server-side app you may have to roll your own.
Is there a way to open external URL in new window and keep an watch over URL change in newly open window and take actions accordingly. And i want to get cookies values also from newly open window.Basically I'm developing website in angularjs. To signup or login i'm using social media. For example on clicking facebook button(using passportjs for social login ) it should redirect user to facebook login screen and once login is successful user will be redirected to a page where i'll be sending access and refresh token in cookies from my server once redirect is done. So i want to keep watch over URL and redirect user to profile page once redirecting is done and want to fetch value from cookies.
new window -> no rootScope or any other scope.
You don't have the same "runtine environment" cross windows
You can't control a new window with the one that open it.
You have to "boot" another angualr and passing parameters, if needed in another way.
UPDATE
normally with 3th party authentication you can choose the page that you want to land.
For angularjs I found the lib satellizer that is pretty good and give you support for all the principal identity provider(facebook, twitter, guthub ecc).
Take a look and tell me if is what are you searching
I have a mobile website written in angularjs, with my backend in Spring Boot. Right now, I have my own login page and can login a user without any trouble. However, if the user ever clicks "back", "refresh", etc., the client loses the user's id and login info (obtained from server on login). I need to make sure that this info is maintained and clicking "back" or "refresh" doesn't break everything.
Secondly, a user that knows the url's after login can type those url's in the browser and access them without logging in. I can stop them accessing anything on the server, but not sure what I can do on the client to redirect them to a login page in this case.
Any help would be greatly appreciated!
You should keep in mind that everything running in browser is stateless, there's no way to keep trace of the previous state.
Right now, if the user performs a refresh (or another similar action), Angular loses everything (AuthData included).
You have many way to work around that limit:
Perform an http request after the application bootstrap (have a look at the angular.module().run method
Save a cookie and use the server to print initial data layer directly on the dom via json
Save on local/session storage
Personally, I prefer cookies because that lets the server to work decoupled from the client.
In reference to your comment..."if the user ever clicks "back", "refresh", etc., the client loses the user's id and login info (obtained from server on login)."
Is there any reason you need to maintain the user id or login info after a successful authentication?
If Spring Security is setup for basic authentication, after a successful login, a Session Cookie will be sent back on the response to the client. On all subsequent requests to the server, the same Session Cookie will be sent on the request and the previously authenticated session will be re-established. You just need to ensure that your Angular client is passing cookies when issuing requests.
Take a look at this sample on how this is done.