I have an angular client that has a form that sends requests to an api service that has the following components:
Form
Controller
Service
I can trigger validations on each of them but should I be doing that or applying validation on the From is sufficient?
In my opinion you should be validating on every layer you have listed.
Anyone can easily modify the HTML of a form to bypass any client validation, just turn of JS. So you should also be ensuring that in the controller you have the correct data.
Your service, I am assuming this might be accessible from other places/applications, so it should be enforcing the same/similar validation in the service to make sure you application is consistent with it's data.
Doing it this way will make sure no 'bad' data gets through your whole stack.
Forms is not sufficient, someone can disable javascript or make changes in the objects. Do atleast Forms and Service
Related
We've created a custom FormEngineUserControl to capture date input using 3 text inputs for day/month/year.
On the server we override the bool IsValid() method which works fine and displays the error message if invalid.
However we want to use client side validation also, we can use a CustomValidator control and assign a ClientValidationFunction to call a JS method however this is not then combined with the server validation function and we end up with two validation messages, one that removes when client validation passes, and one that only disappears when the form is re-submit, basically rendering the client validation useless.
Is there no way to register a client validation method with a custom form control? that will then be combined with the server method and error label etc. ?
This should work pretty much like any other .net user control. How are you preventing further processing if the validator returns false? You might need to set StopProcessing property to true.
There a few similar topics which might address your porblem:
stop execution in Custom validator if it false
Custom validator fires but does not prevent postback
I don't think this is feasible as I'm not sure how you could combine client vs server side validation. You cannot ever disable server side validation. The client side validation is just there for better UX, its not secured by any means. The general idea this is used is that you disable form submission until all fields are verified on the client side. If the validation is the same on the server, you should not see the same error messages because otherwise it wouldn't go pass the client in the first place.
The way you could do this in Kentico is to use some custom js (or better yet some framework/library to help you with validation such as validate.js), give Kentico form some id/class and connect the form validation with your js and have each side (client/server) do its job.
Ok, so currently I handle all HTML form submissions in PHP. I submit the form to a PHP file which:
Checks against a cookie created at page load to prevent CSRF.
Contains a require_once() that handles validation.
Runs other logic.
If any of these steps fail, the user is redirected in PHP to the page they came from with an error message.
How I submit the form:
<form method="post" action="filename.php">
This system is fail-safe; as if anything goes wrong, the user is returned to the page they came from even with Javascript disabled.
So my question is; can I create a fail-safe system using just Ajax (an Ajax request to the server on form submission)? So that I don't need this PHP system at all? Is there a recommended procedure/tutorial for this?
I've avoided this so far as the overhead of having both a PHP form handling system as a fail-safe for potential hackers, as well as Ajax, can take several hours per form.
Just to clarify, I don't require support for users that have Javascript disabled. I just want to make sure my system if fail-safe in that situation. I've had a good look around, but it's proving difficult to find clarification on this.
The short answer for the most part is: no.
It is unwise to consider anything client-side as reliable or fail-safe, this is especially true when it comes to validating user input. A rule of thumb is: never trust the user.
Currently, per the description, your form is being submitted to a PHP script that validates form data. This way is going to be your best line of defense since you have a large amount of control on the data you are working with.
It sounds like you want to cut out the form submission and not force another page load. You can use AJAX to pass form information for validation to your script, but your PHP code is still going to be crucial to the validation process.
Basically you want to make your PHP validation solid. Next, start adding some AJAX calls that pass information from forms to your PHP code, but be prepared to fall back to standard form submission if AJAX is unavailable. If there are no problems with AJAX, you can still submit the data, have PHP do its processing, then return a payload indicating success or failure. Keep in mind though, in this context AJAX is just some sugar for the validation. You are only sweetening the deal by saving yourself having to reload a page and transfer the entire document again.
But remember: it is not reliable, and it is not fail-safe. Server side validation is the light at the end of the tunnel.
I just realized while testing an onClick function with firebug that it would be really easy for a user to change the value of the arguments being passed. This could mess thins up.
Is there any easy way to prevent this, especially when arguments need to be passed?
It is impossible. The code is executing on the user's computer. They are in control.
If they edit it and "mess it up", then that is on their head.
If they edit it and it submits an HTTP request to your server, and your server allows (for instance) that request to delete data belonging to another user then the problem is that your server didn't check that the user submitting the request had permission to delete that data before following through.
You cannot trust anything sent from the client. The user might hand-edit the URL arguments, or a script kiddie could send you a request not even using a browser at all. You must validate everything server-side.
No, this simply can't be done.
Once the script is loaded to the client's machine. He can use/modify it, as he wants.
I'd recommend validating the arguments against expected set of values, and/or business rules wherever the results are being processed (client/server). Ideally validation checks happen on the server where the user has no control. Validation on the client side could even be modified to allow invalid data entry.
There is no way to completely control it - only validate it based on criteria.
You can't prevent this action because JavaScript is a client side . Also you can never trust the client .
You should make a validation for any request at server side to protect your data against client misuse .
you can somehow make it hidden from client eyes
by using .delegate()
EX.
$("table").delegate( "td","click", function() {<br>
// write here your function<br>
});
The client can execute this script but it isn't direct in front of his eyes ..
The cookbook form examples on the AngularJS site only save the state on the client. How do I submit to the server?
Alternatively, how do I use jQuery's form.submit() on the form in the ng:click="save()" function?
Edit - Found 2 ways to do this ( I also removed the HTML markup I pasted before - just refer to the advanced form cookbook example for the source)
http://webpac2.rot13.org:3000/conference/Work (by Dobrica Pavlinusic) to go the AngularJS way using a resource to send the data to the server in JSON format. I had issues with that on the server side - AngularJS was sending it fine but grails were mangling it (according to firebug and request content-length). I need to look into this more. How do I change the content-type in angular for a resource method like $save()?
Put a form in and use a submit button. Since I am not doing a single page web app, I used this method. Most validations were on the client and a few more on the server which was sufficient for me.
Just putting this here so that someone else can use this for possible solutions and best approach.
Note, there is strict separation of view (your html template) and logic (your JS code) - mainly because of testability.
The right way is to just send your model to the server, using $resource (for REST) or low level $http. Instead of doing the job in the template.
Simple example - HTML template
First: <input type="text" ng-model="person.first" />
Last: <input type="text" ng-model="person.last" />
<button ng:click="save()">Save</button>
JavaScript - controller
function FormCntl($scope, $http) {
$scope.save = function() {
$http.put('/save.py', $scope.person);
};
}
As far as I know, there isn't really a good way to modify headers which angular sends to server expect for editing angular source. This is planned enhancement, but it's still not done.
I think that angular google group might be better place to ask specific questions like this since developers are really friendly and knowledgeable.
Maybe you can help me understand some pretty basic stuff here. I am new to jQuery and web in general (though I have a lot of winforms / win32 experience). I have a website that runs on Google App Engine and uses Django and jQuery. The website is used to order a service. It has three forms:
A form in which you describe yourself (e.g you input name, address and so forth) you click next and then the following form appears:
A form in which you input the info of the service you want, such as service name and date. this form needs to display the data you entered in the previous form (form 1) in case you forgot something. you click next, and then the system needs to save all the data you wrote so far, and process your request for a service (this is done at the server side). this form is now displayed:
A form which shows a summary of your service request (and allows you to do other things such as sending the info to other people and so forth).
How would you transfer the data from form 1 to form 2 and then to the server? POST? is this safe? how will you do this in code? is there a way to transfer JS objects?
Make one form in one page and using JavaScript display sections of the form as needed. As far as submitting form values is concerned, you can either submit directly to script via form attribute action="...script url..." , or if you choose to employ AJAX you can use JavaScript or use jQuery's $.post().
This is a pretty open ended question.
So I'll start with one of the unnumbered questions first: "Is this safe".
The quick answer is probably no.
Here's some examples of how to answer that question:
Example:
I want to make a javascript app that
can collect data. I will hold all
data in this javascript object.
1: Is this safe. 2: No it's not, it
can be manipulated by anyone with a
browser.
Example 2:
I will just transmit that stuff via GET or POST to my
server and then mess with it there.
1: Is this safe. 2: No it's not, I
don't really get how stuff is stored
and my ignorance will cause my data to
get stolen.
Example 3:
I totally understand my server and my
initial page.
1: Is this safe. 2: No it's not,
unless all of my data is transmitted
over SSL/TSL it is widely available to
nefarious uses.
Example 4:
I have an SSL service and I understand
everything about my data transmission. I need to
store my information to retrieve it later.
1: Is this safe. 2: No it's not. I am using Google App engine so I'm just a trusting individual OR I'm using S3 and I trust them. or I'm using a sql server with whatever os and I trust those vendors, etc.
Example 5:
I feel ignorant that I just blindly
trust my vendor.
1: Is this safe? 2: No it's not.
(Obviously)
All that said you're using a Google App Engine backend so there's a ton of help on this.
Sorry it's my birthday and your question caused me to wax philosophically while I waste the day at work.
But remember, the prudent answer to "Is it safe" is always "No"