Showing custom view based on user role in angularjs - angularjs

I want to show different views based on the user of my application for example if the user is admin he can see all the controls or when it is acting as user he can only see a subset of controls and UI and he can perform the limited action.
One solution that comes to my mind is sending the role information with the page as a JSON but that would require me to have knowledge of the logged in user so, basically I can first check if the user is logged in or not through the cookie? if no I can just load the lightweight version of the login page and after user logs in then I can send a new page altogether with user's profile information embedded in it.
The other approach that I see is that I can bootstrap my angular application and then check the login status and if the login is done, then bring the profile information through a JSON and update the view, but I think it would be slow and error-prone.
I don't know what is best / recommended approach.

First approach seems to be a better approach out of these 2.
Problem with the second approach is you are sending 2 requests to the server - one for login and then 2nd one to get the user role/profile. If you are choosing this approach then you may have few issues depending how are you going to implement it:
If you are updating your UI after login then you will have to decide what should be shown to the user since you don't know the user profile yet. Even if you come up with some minimal privilege UI, there will be another request to get the profile which will kind of refresh the UI again - 2 UI refreshes could be annoying for the user. Not to mention that there 2 requests going which could make your site slow.
If you decide not to update the UI after login but only after you get user profile, still the delay would be more as you will have to wait for response of 2 separate requests. Could be a major issue with slow networks(consider mobile)
If you are using the first approach, you'll get away with above mentioned problems.

Related

Suggested ways to take a screenshot of a react page

I have a react app that serves a live dashboard to clients (SPA).
Within that dashboard, I have what you might call a 'summary' page that gives the user a periodic summary (in a timeframe of their choosing).
Some of those users, want to receive a periodic report (a screesnhot of that summary) as PDF to their emails.
My struggle is with the report generation part - one thing that I'm trying is do is have an automated process login to my webpage and take a screenshot.
However, it feels not best-practice, and causes issues (the page has an MFA that I somehow need to bypass, etc.) .
Bottom line, I was wondering if there is a known process to do what I'm looking for.
Thanks.

Best options to display a popup for angularjs app based on conditions

I have an angularjs app with ASP.NET WebAPI2 REST APIs. There is a scenario where I have a display a popup for initiating a survey for end users (both authenticated and anonymous types). On clicking the popup options, the user will be redirected to another applicaiton which captures all the responses provided by the user.
There is no relation between the angularjs app and the survey application.
Now next time if the user revisits the application then in that case based on the previous action taken to fill the survey , I have to take a decision to display or hide the popup for the user.
I thought of cookies and localStorage as the options but I think are not ideal choices for this scenario.
Can anyone help me to know are there any other possible options to handle this scenario?
You can solve this using the redirection link.
For example if he finished correctly the Survey you will redirect him to:
www.myapp.com/survey/success
Than in the App you can do something like: get the URL parameters, if the parameters is success store it on localStorage so next time he revisits the web-page the Popup wont show.
Otherwise direct him to:
www.myapp.com/survey/
I think the best option here is to save this information in the database using your ASP.NET WebAPI2 REST APIs. In the moment that the end user clicks the survey you can also make an Api call which will save in the database info about user's action(this will probably be sth you can do for authenticated users). For not authenticated users you can just save that information in localStorage in the moment they are clicking the survey.

How to integrate payment gateway in applications created using javascript frameworks like ExtJs?

Our application is a one-page application created using ExtJs. For any user action, the browser tab is never reloaded and all the actions are performed using ajax. A user can open/close multiple ExtJs windows/panels within the same browser tab, and this way everything remains confined to the same browser tab.
Now, we need to integrate payment gateway in the application, which involves redirecting the user to the bank website and having her brought back to our application.
The issue is that when browser redirects the user, then all the application javascript code along with panels and windows get destroyed, and when the user comes back to the application then she finds it to be different from one she left.
As a solution to this, we were thinking of using following two appraoches:
Option 1. Maintaining the state of application - When user leaves for the bank's website then somehow we maintain the state of application - like which windows are opened carrying what data, which variables have which values etc.. and when user returns back, we generate the same application state for her.
Option 2. Have a browser pop-up window for payment gateway - We intend to provide a button which will open a small pop-up window carrying the transaction details, and in this pop-up window the entire payment gateway process will take place taking care of redirection and everything.
Option 1 is proving to be very cumbersome and complicated as maintaining the exact state is not getting feasible.
For Option 2, we are not sure if this is safe and possible?
Has anyone implemented such an approach earlier. Otherwise, what are the other options which we can go for?
Thanks for any help in advance.
I faced the problem and I implemented it using websocket/polling in the main application while a new window pops up for the payment.
After the payment is successful the main application will be notified.
That way each payment runs in it own sandbox totally unbound from the main application which makes maintenance quite easy. Note that our backend create a new session for each payment using the existing one.
I think it is not uncommon to open new windows for payment that's why I decided to go this.

Removal of homepage login users from analytics

The problem I am having is filtering out the users that come to our homepage just to login, since we have the client button on the homepage (and yes I've tried to get them to put it somewhere else).
I can't think of a way to do it because they don't look any different than potential clients, other than that they may visit more often and click on the button. Any ideas or software that might accomplish this?
one way, is to associate a cookie with those users and either a) don't load the tracking code when cookie is present, or b) in Analytics Settings -> Filter Manager, add an exclusion pattern matching the cookie name. a) would be more flexible.
now, there's no way to tell if the user is going to stay on the main site or hop to the client area... so it might undercount in some cases. but you might find that better than the overcount showing up now...
a slightly more intrusive option, would be a JavaScript overlay / splash screen that shows up when you detect a user returning that asks them, "Would you like to go directly to your client area? [YES] [NO, TAKE ME TO THE MAIN SITE]". in that case, the tracking code wouldn't be loaded unless, they say are going to the main site...
if using the filter manager method, you'll want to register the variable like so:
<body onLoad=”javascript:pageTracker._setVar('my_cookie_name_guid')”>

IE7 problem - session and cookie problem

I have one problem with IE7. Let me explain the scenario
I have opened my web based application in IE7 browser in TAB1 by using normal login feature. After successful login, i entered to the application home page and i do with my normal transaction say Trans1. Now i want to open my application again in another tab TAB2 in the same browser window.. what happens IE7 won't allow me to login on my application in the login page, it directly enters to the home page and when i do one transaction say "Trans2" it is going smoothly. Now when i again went to the TAB1 and doing one transaction it is opening the TAB2 page that i opened in TAB2.
It seems IE7 is sharing same session cookie in multiple tabs. Is there a workaround for the same scenario.
Anyone have any solution for this problem.
Appreaciate your help in this regard.
Thanks,
Manoja Swaro
It seems IE7 is sharing same session cookie in multiple tabs. Is there a workaround for the same scenario.
Well no. Cookies are by design shared between all instances of the same browser, whether in multiple tabs or multiple windows. You can only get two separate sessions by using different browsers, like an instance of IE and one of Firefox.
This changes a little in IE8, but in quite a complicated way you probably don't want to rely on. See http://blogs.msdn.com/ie/archive/2009/05/06/session-cookies-sessionstorage-and-ie8.aspx
This is why you should generally not be using cookies/sessions for keeping track of partially-completed transactions; one transaction will always interfere with the other. Better to either:
keep track of all incomplete transaction data in page/form data, like hidden fields
if that's too much data to keep passing back and forth, create an ID for the transaction that is remembered through page data, and store the actual data in the database.
You can also use a unique ID tied to the page to generate more unique cookie names, eg. 'preference.1234=foo' instead of just 'preference=foo', so that each instance will have its own cookies.
Yes. IE shares session/cookie between tabs.
Try to run a new browser (i.e. from Start menu) -- it helped with older versions of IE
and it works with my IE7.
AFAIK This happens with all tabbed browsers (FF for example).
Indeed, this is how all tabbed browsers work. Cookies are shared among all tabs. However they are not shared among multiple instances of the same application, but I doubt this will help you.
This is actually a serious problem for many applications. It is very difficult to keep track of the tabs - which are open, which are closed, when a new tab opens, and when an existing one makes a request.
There is one workaround I have found, but it's pretty messy. The idea is that you have to assign a unique ID to every tab yourself. Then, when a tab performs some actions, this ID has to be posted back to the server. Depending on the architecture of your application, the ID can be passed around in URLs or hidden form fields. If you're doing AJAX, this can make it easier to find a common place to add the ID. ASP.NET also has just one form at all times, so the hidden field is easy to do.
Naturally, on the server side you must check this ID and implement your own "tab sessions" based on it.

Resources