ASP.NET 5 vNext Forms Having Anti Forgery Tokens Added - angularjs

I'm experiencing an issue where a simple form tag is having an action and method attribute added to it. Also added are some hidden input fields for what I am guessing is anti-forgery.
Here is the html I'm adding in the Razor View:
<form>test</form>
And here's what's being rendered:
<form action="/company/adduser" method="post" class="ng-pristine ng-valid">
test
<input name="__RequestVerificationToken" type="hidden" value="CfDJ8KMbFT4ebnROrEREXkL-MYlPSgL0ISe6_sqTJXc982ocoWgKH1v_yCV2_5Qa9h8AmVFaNk0i0Wpa6gQlhWY-PHkZ929_Tkv1B-lCR7-aLyd53L2448CLQNtakb-UHQmLgPGCiQF0dj4jij9lc_sS7jRPjcGFnNjxdT_wobz-CsU3NvR-fm-a9r0MnqhflgwLLw">
</form>
It's causing major issues since I'm only using asp.net MVC to serve up HTML and using AngularJS on the client. The action methods is causing issues with angular when trying to use ng-submit.
Does anyone know:
Is MVC somehow automatically adding anti-forgery tokens?
How do I disable this?

As of the time of this writing, that's just a bug in the Form tag helper. It will be fixed.
You can exclude Form (or any element) from taghelper processing by adding a ! as in <!form></!form>

Problem here is that Microsoft added new TagHelpers and one of them is <form>. It seems to be adding all that extra "stuff".
Edit and better fix:
I ended up configuring TagHelpers to have a prefix. In my _GlobalImport.cshtml I added:
#addTagHelper "*, Microsoft.AspNet.Mvc.TagHelpers"
#tagHelperPrefix "asp:"
This allowed me to add "asp:" in front of any TagHelpers I did want to render. This also prevented the <form> tags from being rendered by the TagHelper.
I was notified by Damien Edwards on the ASP.NET team at Microsoft that the issue with the form tag is a bug and will be fixed. I still thought this information would be helpful in the meantime.
You can also prevent a TagHelper from rendering by adding a ! in front like so: <!form></!form>

Related

AngularJS XSS in <input> field

I have an AngularJS app (Angular version 1.6.4) that uses an input field to bind an URL (that can be changed by the user) to a model. Here is how it looks like:
<input ng-model="connectorService.url">
This URL is then saved to a backend and re-loaded from there as soon as the page is refreshed. I have tried to do some XSS by manipulating the POST requests that set the URL in the backend.
I entered <script>alert("XSS");</script> into the input and it is set correctly (verified by manually requesting it from the backend). When I reload the page, the input field contains the XSS but it is not executed. What am I doing wrong? Is there still a sandbox in AngularJS 1.6.4?
Is there still a sandbox in AngularJS 1.6.4?
No, the expression sandbox was removed with AngularJS 1.6
From the Docs:
Another major change [with V1.6] is the removal of the Expression Sandbox. This should not require changes to your application (and may give it a small performance boost), but we strongly recommend reading the Sandbox Removal Blog Post to understand the implications behind the removal and whether any action is required on your part.
— AngularJS Developer Guide - Migrating to V1.6
For additional information, see
AngularJS Developer Guide - Sandbox Removal

Why do we use form or ng-submit in angularjs?

I am planning to have an angularjs application. We will be doing the CRUD operation using Web Api service. And these controller functions I can call from ng-click directive (I mean with out a submit)
AngularJs <-> WebApi <-> Sql Serevr => This is our stack.
We need get call to web server (to fetch files. Ex: images).
But I am wondering, will we ever need a post operation into webserver in our case?
Also, do we ever need a form,ng-form,submit,ng-submit - in our case?
Any help would be apprecicated, Thanks!
There are number of reasons outside of just submitting to use a <form> tag in your code. For one, angular wires up validation results right into the form object. If you didn't have the form, you wouldn't get that functionality.
I'd suggest taking a look at the example at the bottom of the Angular Form documentation to see why you may want to use the Form. You can see how the form.$valid and form.$error change if you clear out the textbox in the example.
https://docs.angularjs.org/api/ng/directive/form
Regarding submitting, ngSubmit will prevent the default action of a form which is usually posting the server. Similar to the validation properties that exist, there is also a form.$submitted property that will be updated to true when the form is submitted with an ng-submit. This will not happen on an ng-click.
https://docs.angularjs.org/api/ng/directive/ngSubmit
Not much different,but ng-submit would be prevent by input[required] etc. ng-click is unlimited

Get Spring Form Action Attribute For Angular js

I'm trying to customize Jasig's CAS 4.0.0 to a new view using Angular 1.4. But i have a problem on this time, here i can't use the angular tags on the current <form:form> tag, and also i have no idea to extract the bean that,it uses to define the action=cas/login?... part. Here's what it uses:
The viewLogin.jsp that uses the form:
<form:form method="post" id="fm1" modelAttribute="${commandName}"htmlEscape="true" cssClass="form-validate mb-lg" novalidate="">
I again changed from commandName to modelAttribute, because i saw a question saying it was outdated... But i still haven't any idea how to extract the information which i need from that form. Apparently, that's just a name to instantiate a bean that is resolved by spring automatically. But how can i access that information outside of the JSP attribute? Also I want to make the validation from Angular to complete it, but since that i cannot extract the URL that CAS generates, I can't make it "totally works".
Thanks in advance!

parsley.js with AngularJS for form validation

I'm developing application using AngularJS (using requireJS). I want to validate input fields (basically all client side validation). I thought to use Parsley.js which looks great but it doesn't work with AngularJS. HTML5 validation overrides parsley validation.
So my questions are
1) Any idea why parsley is not working with my angular app?
2) Which is best validator for angular (except angular default validation)?
I am looking into this as well. Seems that someone on SO has created a directive to make Parsley work with Angular. Click.
The best validator, as of yet, to me seems to be the built-in Angular validation. Though multi-field validation is still a pickle.
Try this
<form role="form"
ng-submit="submit(this.form, reg)"
novalidate="novalidate" ...
to prevent native browser validation

Cakephp form validation using plugin

I am using jQuery in my cakephp forms. I want to add validation using the way I have added my plugin. Putting required on selected input element automatic validates it. No matter if I add my plugin or not. I have included js helper..
public $helpers = array('Html', 'Form', 'Js'=>'jQuery', 'Text');
Like this. I want to stop the traditional way it follows for auto validation. And put the validation according to my requirement. I know cakephp 1.x version it follows the same way I want. but changes have been made in cakephp 2.x version for it autovalidation ? how can I stop that ?
HTML5 form validation
Depending on the browser you're using, the validation-messages you see are probably part of the HTML5 validation performed by the browser. Recent versions of Chrome will automatically perform Form Validation for input elements that have a required attribute.
You can disable HTML5 validation by adding a novalidate attribute to the <form> tag.
See this question for more information:
Disable validation of HTML5 form elements
Note
Although validating with jQuery can be a nice addition (from a user-interface perspective), you should never rely on validation in the browser alone. Always be sure to perform proper server-side validation. In CakePHP this is done in the models, see Data Validation

Resources