How to open a different url with a new tab and automate login in an angular based app - angularjs

I have an angular based app and I want to open another URL on a new tab from my app and automate a login. For example my app is www.myapp.com, and it will open www.anotherurl.com/login. Let's say I have both the username and password for www.anotherurl.com/login.
How can I automate the login by populating the form and do the login?
Is this something we can achieve from the client side? or this needs a server side implementation?
Or is this is even possible?
Update:
I have no control over www.anotherurl.com/login by the way. This is just another way of saying I want to open gmail.com with credentials and automate a login instead of me typing the username and password, and pushing the login button myself.
Thanks in advance for your thoughts.

you can send them along as query parameters, but if you are not using https then they will be sent in the clear. for example:
https://www.anotherurl.com/login?user=bob&pass=secret
then in your controller, if these query params are present then call a login method
also worth mentioning that even if its over https the password will be in the user's browser history and thats probably not a good thing either.

Related

Custom React GUI for oidc-client-js

is there a way to user your custom React GUI with oidc-client-js? I know that if you trigger authentication endpoint using:
// PopUps might be blocked by the user, fallback to redirect
try {
await this.userManager.signinRedirect(this.createArguments(state)); //Shows midleware login form
return this.redirect();
} catch (redirectError) {
console.log("Redirect authentication error: ", redirectError);
return this.error(redirectError);
}
Middleware will try to render its predefined login form:
However I have my own React form and I only need to pass to OICDClient params (email,password) and get back User instance to display UserName etc. Something like:
var loggedUser = await this.userManager.signinCustom(state.loginEmail, state.LoginPassword); //Login using credentials
I don't want to write all the logic by myself I really want to use all functionality from OIDCClient - only with my GUI (loginForm, registerForm, updateUserForm etc).
I'm using scaffolded library from MSDN using command:
dotnet new react -o <output_directory_name> -au Individual
Is there any method/implementation to initialise oidc-client-js from React components and not user default GUI forms?
Thanks a lot!
I might be missing some thing but the whole idea of using a 3rd partly federated auth provider be it your own/your company's SSO (say developed using Identity Server 4) or say Google sign in(say using their Firebase JS kit) or Microsoft sign in, Facebook sign in etc. is that you will be redirected to their authentication endpoint where you then use say your google credentials (if you are using google sign in for example) to sign on to google auth servers. Once you do that then a payload (consisting of an identity token and access token) is returned back to your redirect URL which you must configure for your specific app.
By saying you'd like to provide your own sign-in form you are missing the entire point of using a 3rd party authentication provider. Besides, you/your app shouldn't know about user names and passwords and you don't want to have access to all that information. All that you should be interested in knowing whether the user, who are using one of the federated authentication providers, that you would have configured for your app, are who they claim to be and you then delegate all that heavy lifting to your 3rd party authentication provider.
Besides, say your company has a SSO system of their own then all your company's app will use that SSO system and from a UI perspective you want to show the same login screen so as to give a consistent user experience.
In addition, if you show me a google authentication button and then on clicking that button you show me some weird form that doesn't look like the typical google picklist sign-in form then I'll shut down your app before you can say hello, and, I suspect most user would (and should) do the same. The reason being that when you show me a google sign-in page then I know that you/your app will only get back what you need and I wouldn't ever entrust my google user name and password to any other application.
If you really want to have your own authentication form then you'll have to manage user names and passwords yourself, the way we used to do things probably over 10+ years back.
If you decide to go the route of setting up your own authentication system and then say use identity server 4 then yes you can certainly change the UI and customize it to your heart's content, but that will happen at the server level, not at the level of your react app. Point being that in any SSO system the user will be redirected to the that auth provider's endpoint where they then authenticate (and, optionally, provider permission for your app to use certain claims) and once they do that they they are redirected back to your redirect endpoint with a payload (JWT token).
Lastly, even if you could some how wire up a client side sign in form, I'm not sure you would want to use it. Passing passwords & user names over the wire isn't a good idea. You'll always want to use a server rendered sign in form.

Safaricom dashboard does not show all the test credentials

I am working on Safaricom Daraja API B2C but some of the required test credentials are not displayed in the Safaricom Dashboard.
As you can see above, the initiator name and security credentials are not provided yet they are needed in the B2C API call.
How do I get these credentials.
EDIT:
This question was asked before Safaricom upgraded to the new Daraja Dashboard. The problem has now been sorted
Apparently, for some unknown reason to us, Safaricom chose to hide the test credentials and if you need them, you have to write them an email at apisupport#safaricom.co.ke and request for the test credentials. You will get a response in less than an hour with shortcodes and initiators that you can use for test.
Source -> https://survtechnologies.co.ke/get-test-credentials-safaricom-m-pesa-daraja-api/
The test Credentials are on the simulator link, bottom right redirects to the link.
Please try this with the new mpesa portal2.0 - It is straight-forward

what is the Best Approach to restrict source URL for API hitting?

I am using laravel and AngularJS for development.
I have different portals and login page but login function is same to login all users at back end.
I want to check source URL before hitting to login function if URL is hitting from right portal to right user then it should proceed to application further other wise not.
If you wanna check the url then you can use $location provided by angular to see the url before sending the request.

Restricting API Calls to a Certain Domain

My app uses JS Facebook API to use Facebook as a login/pass. Here what happens when you try to login.
User click on the Facebook Login Button
Facebook Authenticates
If Success. I grab the Facebook ID and Name of the user
Calls on my REST API on my APP to check and see if the that FBID is registered in my system.
If Registered, I write the session to verify that the user is authenticated.
This is great since I don't have to store usernames and password. But I am worried that someone will just use a REST API debugger like POSTMAN in chrome and just send a Facebook ID and the name of the user and they will be authenticated.
My question is what is the best way to secure my end that will prevent apps like POSTMAN to just input the fields needed to authenticate? Am I missing something? Can anyone recommend a strategy for this?
Or is using CSRF token the only way to combat this? I am using FuelPHP as a backend and doing a single page app using AngularJS with NgRoutes. But every time I enabled the CSRF on fuel, the token passed does not match what it was in the back-end.
I am under the impression that this is due to that the javascript token function is in the main page, where the ng-view. I know this might have something to do with the ngRoutes.
http://fuelphp.com/docs/classes/security.html
Use Fuel's Auth package. It has Opauth integration which does all the above, and for an entire list of social media platforms, not only facebook.
Always try not to reinvent the wheel, assume someone else has had the same challenge, solved at, and shared the solution with the community.

FOSUserBundle + verify user related properties after valid login

I have implemented the FOSUserbundle on my application, I have manage to get chained userproviders to work as well as overriding some of the default controllers.
I have one issue though, I need to find a way to intercept the login process.
My userobject is linked to a client entity, Now I need to deny access to the Userobject even though it's valid because the client entity is disabled.
What I have attempted.
1)I tried extending the SecurityController to no avail, it seems to redirect before executing my code.
2) I tried to set _target_path on my login form to a controller that does the check of the client entity status, This seems to work but after I logout the user using,
$this->get('request')->getSession()->invalidate() ;
The user is redirected back to the login page but I cannot get a flash message to appear on twig template stating that the client is not active.
Any help or ideas will be much appreciated.
You might want to attach a handler to the login and logout process: http://www.reecefowell.com/2011/10/26/redirecting-on-loginlogout-in-symfony2-using-loginhandlers/

Resources