How to protect my angular application? - angularjs

I have created an angular application which uses web services to fetch data from my backend and also implementing other logical data based on user.
Since it is a client side application, the code will be visible for anyone and my logical functionalities. I am afraid that it is possible that anyone can find a loophole in my application.
Even if I minified my js files, there are many tools available to unminify it.
So is there any possible way to hide my js files from browser or some other way to avoid reading my code?

The only solution is you cant hide the javascript code from inspect. The maximum possible method is to minifiy the and uglify the code to make the code un readable. but still there are some other methods to hack it. Please look here for more details.

Related

Develop Salesforce Commerce Cloud Cartridge Loading Order

I would like to develop a Salesforce Commerce Cloud Cartridge.
My JS code needs to load before all other JS Code.
What are my possibilities to achieve that? is it even possible to determine when your plugin loads?
I read about the cartridge stack load order,
Base -> Plugin -> LINK -> Custom (default).
I cannot seem to understand, is it possible to develop a Plugin or LINK cartridge? what does it require of me?
In SFCC the cartridge path and the cartridge itself has no influence on the JS code that is delivered to the client. It only defines what files take precedence during code generation on the server-side.
If you want to make sure you plugin code runs first on the client side you would have to either write a wrapper that makes all other scripts wait or add your JS code as dependency to other scripts. I doubt however that you can provide this functionality simply through your cartridge. I think whoever uses the cartridge has to take care of that manually.

Angular 1.5 :How to load controller specific js controllers when required

I am new to angular js, I have started refactoring code in my project which was developed by some developers previously working in my organization. There are some problems in the code that is making my web page slow.
There is a dashboard page with all the feature links over there. On click of each and every link the html is getting replaced with the specific feature. Now to make this happen the developers have included all the controller/service js file in the dashboard page itself, which is obviously making the page to load slow.
Please help me out or at-least give me a direction in which i should start thinking.
Sounds like you are trying to optimize something that you are no investigated.
You can use oc-lazyLoad package in order to achieve your requirements, but bare in mind that, it only improve the first bootstrap nothing else.
From your description, it looks like you have a different performance problem, you should investigate it using devtools performance tab.

What is the best way to update an angular application?

Our team is constantly working on an angular application, and every week or 2 we update it with new features or correct some bugs that came out.
We are using a C# backend with webservices.
QUESTION: When we update the application on the server, we sometimes (this doesn't happen all the time) get the problem that user is still seeing the old HTML and functionalities. What is the way to solve this?
I didn't find this on google, maybe I'm not looking for the right terms,
any help is appreciated.
Users have to clear their cache to get the new version of the application.
What you are seeing are cached copies of the JS files (possibly HTML partials too).
When the browser parses the HTML page, it makes the request for getting the JS resource and looks at various information before deciding to retrieve either the cached copy (if any) or whether to query the server again.
You can find some extra details on the Google fundamentals on HTTP caching
A solution I have been adopting myself is to set the cache headers to cache the file for a very long period, and then use tools in the build to version the file either on the filename or with a request parameter.
I have used grunt-cache-breaker and found it to serve well for this purpose. I know there is a gulp equivalent too
The most common way to make sure cached versions of your javascript aren't used is adding the version as a parameter in the reference to the script like so:
<script src="/app.js?v=v1.0"></script>

Should I use Angular for a local only NW.js project?

I want to build a mid-size application using NodeJS and NW.js (formerly known as node-webkit). The application will grab some data from the internet but isn't talking with one special service which is under my control.
Is it a good idea to use AngularJS nevertheless or is the MVC approach of Angular oversized if there isn't neither a database nor a webservice on the controller layer?
I think Angular would be really fine for databinding and GUI handling, but I'm not sure if it's the right approach for this kind of application.
I see no reason not to use Angular in an nwjs project. I do it myself in the app I just finished building. It's a local-only deck tracking app for hearthstone that never communicates over the internet at runtime. It only ever monitors a log file that is generated by the Hearthstone game. Since the way I'm display information to the user is still technically a web page with a full DOM, Angular makes perfect sense since I'm already comfortable using it.

I need to implement Asp.net Web API 2 and consume it by Sencha Ext JS

I want to implement a web-based API (using ASP.NET Web API 2) and consume it by the client Side library (Sencha Ext JS).
My application should include
A simple user registration form.
A login page for admin.
CRUD operations for users' submissions.
Notes:
I do not want to include any backend code (i.e C#) in the we application, I want to implement it using the HTML/Javascript only, that is Ext JS.
I want the Web API to be RESTful.
I want to protect admin pages.
I want to use the SQL Server to store users' submissions.
All of that requirements should be implemented using the ASP.net Web API 2 and Ext JS only.
So far, I did initial search and I got a lot of learning for either the ASP.net API 2 or the Ext JS. But I couldn't have a guide that help me to fulfill the above requirements or help me to have both technologies work together.
Pleas help me on either way.
Or generally, can you help me get started work in combining both: Asp.net Web API 2 and any client side that consumes it, such as Sencha Ext JS or any other client side. It is not necessarily to be Ext JS.
Thank you so much.
Thanks to StackOverflow.com
If it were me, I'd use the DirectAPI for asp.net https://github.com/elishnevsky/ext-direct-mvc
You create webapi controllers, just like you normally would. The only difference is the the controllers that need to be used by EXT should inherit from DirectController.
If you follow the directions on that page, you'll end up with a globally available proxy object that matches the name of the controller and the public methods hanging off of the controller become methods of that object.
That is, server side controller MyAwesomeController with method DoSomething() becomes MyAwesome.DoSomething.
If you attribute the method as [NamedArguements] you can create methods such as
DoSomething(int id, int foo)
and pass from javascript as DoSomething({id: 20, foo: 30});
Since it is still just a controller, you can attribute permissions and return json as you would in any other situation.
If you get stuck, use the debugger and spend the time to figure out what's really going on. This all works in 4.x and I've tried it in 5.x and it still works there as well. But I wouldn't jump into 5.x just yet as there are still several bugs that need to be worked out by the sencha team before it is ready for prime time.
ExtJs has a REST proxy for the data. So what you try to do should be possible. The proxy can be configured and be finetuned.
I used the JSON proxy. ExtJs has very powerful filter and sort capabilities, both server and client side. In my experience difficulties arose when filtering and sorting server side. There is only sparse documentation on how the parameters are passed and which configurations have what effects.
Since you also develop the REST api, you can adapt to those details. You just have to do some research.
Here is not the place to ask about guides. For Asp I cannot help you, I never touched it. If you use ExtJs, you are free to choose you backend. For ExtJs, the start is pretty straight forward :
get Sencha cmd and generate a skeleton app.
follow the tutorial
create one file per class definition.
the API docs are great. If you still lack something SO is great too.
what you have to find out by yourself is the exact way parameters are passed to the backend and how to format the response.

Resources