Getting a Csrf token inside a react render function - spring

I'm creating a webpage with a login/logout option, since I'm using spring, and I want it to be secure, I use Csrf as described here.
What works in regular html:
<form method="post">
<input type="submit" value="Log out" />
<input type="hidden" th:name="${_csrf.parameterName}" th:value="${_csrf.token}"/>
</form>
The only difference is I am trying to put it inside a react component, in the render function, it would look like this:
<form method="post">
<input type="submit" value="Log out" />
<input type="hidden" thName={_csrf.parameterName} thValue={_csrf.token}/>
</form>
But for some reason that doesn't work.
Another thing might work but I'm not sure if it's good practice or not is:
<form method="post">
<input type="submit" value="Log out" />
<input type="hidden" thName={this.getCsrfName} thValue={this.getCsrfToken}/>
</form>
I'm using thyme-leaf by the way.
Is there any way to access the token and the name inside react without it being bad practice? Also if my second try is the correct one, how would I write the getCsrfName() or getCsrfToken() functions?

Related

Sagepay 3D Secure redirecting to acs url returns a blank page

Redirecting to the below url (with CRM webform step )is returning a blank page. Any solutions?
Thanks in Advance
https://test.sagepay.com/mpitools/accesscontroler?action=eJxVUttuwjAMfd9XVHxA04ReKDJBBbStmtiqMW17jVKPVusF0naUv18CZYw8+Rw7J/ZxYN6XhfWDqsnrajaitjOa8zt4yxTiaoOyU8hhjU0jtmjl6WzEHOr5rkvHzJ14XkiZx8YjDkn0insOgxDXOjYFcoFaQclMVC0HIfeL+Jm7IQsdB8gAoUQVr3jgMjcMqDMcIGcaKlEiXwqFy7qrZF581epDFNgAOWVAarpVRz5hPpALgE4VPGvb3ZSQw+FgS3kwd+xabe3uG4hJA7l2lnQmarRcn6c88WV9T/1sUX0+Rfu+E+OXh/6dreNFNANiKiAVLXLtR+gELLSoP6Xu1JkAOfEgStMH95zgNOcZwc48Et2k/lOgDVdYycsoFwTY7+oKdQUD8hdDio3kG7OaRBytdRLrxw0F5DrM8tGYLlvtIzV+nyKjl2uPdPdnQQOAmFoyrJIMW9fRzW/4BYe1tvY=
Expected: 3D Secure page of the respective bank should be loaded
You need to be automatically POSTing a form - not have URL variables.
`<form name="form" id="3dsecureform" action="https://test.sagepay.com/mpitools/accesscontroler?action=pareq" method="post">
<input type="hidden" name="MD" value="[MD]" />
<input type="hidden" name="PaReq" value="[PaReq]" />
<input type="hidden" name="TermUrl" value="[TermUrl]" />
<button type="submit btn btn-primary">Submit</button>
</form>`

Passing input to url with get method in form in laravel 5.1

I want to pass my search input to laravel 5.1 like this
localhost:8000/search/{searchtext}
but right now it send data with this method
localhost:8000/search?search='searchtext'
<form action="search" method="get" class="form-wrapper">
<input type="text" NAME="query" id="search" placeholder="جستجو ..." required>
{{--<input type="hidden" name="_token" value="{!! csrf_token() !!}">--}}
<input type="submit" value="بررسی" id="submit">
</form>
Can you give me a solution for it?
Change the action attribute of the form in the onSubmit event, you have to use javascript. The exact code depends if you are using a library like jQuery or plain Javascript.
Here a useful link:
Change form action based on submit button

Honeypot protection with Ajax

Recently i got attacked by nasty auto-form fill bots which filled my shout form with all sorts of spam. My shout form consist from a html file with 2 textboxes,an ajax script(for refreshing without reloading) and my php file for handling all the inserting data into my DB.
I am thinking implementing a hidden textbox for a minimum protection against these bots but with no luck since i cant pass the honeypot data to my php file. My code:
HTML Form
<form class="form" method="post" action="postdata.php">
<fieldset id="inputs">
<input id="name" name="name" type="text" placeholder="name" maxlength="20">
<textarea id="message" name="message" type="text" placeholder="message" maxlength="255"></textarea>
</fieldset>
<fieldset id="actions">
<input type="submit" id="submit" value="Submit">
</fieldset>
</form>
Ajax script
$(function(){refresh_shoutbox();$("#submit").click(function(){var a=$("#name").val();var b=$("#message").val();var c="name="+a+"&message="+b;$.ajax({type:"POST",url:"postdata.php",data:c,success:function(d){$("#shout").html(d);$("#message").val("");$("#name").val("")}});return false})});
function refresh_shoutbox(){var a="refresh=1";$.ajax({type:"POST",headers:{"cache-control":"no-cache"},url:"postdata.php",data:a,success:function(b){$("#shout").html(b)}})};
postdata.php file
<?php
if($_POST['name'] or $_POST['message']) {
$name= $_POST['name'];
$message= $_POST['message'];
///do other stuff/////
?>
I will insert a hidden field in my html form
<input id="email" name="emails" style="display:none"></br>
but i cant manage to pass the extra value to my existing ajax script.Tried some code but with no luck.
Any help so i can get my shoutbox up and running again?

Is it possible to trigger different HTTP methods on a single page with only one form on it?

Until now, I have dealt with PUT and DELETE HTTP methods with jQuery AJAX (or XMLHttp) and HiddenHttpMethodFilter including GET and POST in Spring (currently I'm working with Spring 3.2.0). I have one general question about using these methods.
Basically, I want to perform basic database operations like INSERT, EDIT, UPDATE and UPDATE on the same page (JSP) using a single form. In this scenario, is it possible to trigger these methods at appropriate actions?
For example, when a user presses the delete button, the DELETE method should be raised, when he presses the update button, the PUT method should be triggered, on pressing the insert button, the POST method should be invoked and while retrieving data, the GET method should be used and accordingly an appropriate method which is mapped in the controller should be invoked (again on the same page with a single form <form:form>...</form:form>).
Of course, it is possible by means of AJAX but using AJAX everywhere is not appropriate.
Maybe I'm missing some important aspects of RESTFul APIs. Apparently, it is not possible (unknowingly). What is the actual answer?
EDIT:
Suppose, I wanted to deal with the PUT method then the Spring form would look like the following.
<form:form id="mainForm" name="mainForm" method="put" action="Temp.htm" commandName="tempBean" enctype="multipart/form-data">
<input type="submit" id="btnSubmit" name="btnSubmit" value="Submit"/>
</form:form>
and its generated HTML would look like the following.
<form id="mainForm" name="mainForm" action="Temp.htm" method="post" enctype="multipart/form-data">
<input type="hidden" name="_method" value="put"/>
<input type="submit" id="btnSubmit" name="btnSubmit" value="Submit"/>
</form>
The hidden <input type="hidden" name="_method" value="put"/> field is automatically added to be dealt with the PUT method by the HiddenHttpMethodFilter
If I now needed to raise the DELETE method then the form and its generated HTML should respectively be modified as follows.
<form:form id="mainForm" name="mainForm" method="delete" action="Temp.htm" commandName="tempBean" enctype="multipart/form-data">
<input type="submit" id="btnSubmit" name="btnSubmit" value="Submit"/>
</form:form>
Generated HTML
<form id="mainForm" name="mainForm" action="Temp.htm" method="post" enctype="multipart/form-data">
<input type="hidden" name="_method" value="delete"/>
<input type="submit" id="btnSubmit" name="btnSubmit" value="Submit"/>
</form>
How likely is it to do so dynamically at run time?
You could do something like:
<form id="mainForm" name="mainForm" action="Temp.htm" method="post" enctype="multipart/form-data">
<input type="hidden" name="_method" value="delete"/>
<input type="submit" name="btnUpdate" value="Update"/>
<input type="submit" name="btnDelete" value="Delete"/>
<input type="submit" name="btnCreate" value="Create"/>
</form>
Then on your processing page just check to see which button submitted the form.

Multiple password forms + password completion

On a website I'm working we have an onsite login and a private login, the problem I'm having is that Firefox doesn't seem to be able to differentiate between these login forms.
Does anybody know how I can make clear that these are different logins?
I already tried giving the form fields different names and ids, ex: onsite_login and login but without success.
edit: my form-tags are not being mixed up, they aren't even on the same page
The two forms on the different pages
<form method="post" action="/en/login/1">
<fieldset>
<p>
<input type="hidden" value="login" name="form"/>
<input type="hidden" value="en" name="redirect"/>
<label for="onsite_username">Username<abbr title="Required ">*</abbr></label>
<input type="text" class="input-text" maxlength="255" value="" name="onsite_username" id="onsite_username"/>
<label for="onsite_password">Password<abbr title="Required ">*</abbr></label>
<input type="password" class="input-password" maxlength="255" value="" name="onsite_password" id="onsite_password"/>
<input type="submit" value="Log in" name="submit" class="input-submit"/>
</p>
</fieldset>
</form>
and
<form method="post" action="">
<fieldset>
<input type="hidden" value="login" name="form"/>
<div>
<label for="username">Username</label>
<input type="text" class="input-text" value="" name="username" id="username"/>
</div><div>
<label for="password">Password</label>
<input type="password" class="input-password" value="" name="password" id="password"/>
</div>
<input type="submit" value="Aanmelden" class="input-submit"/>
</fieldset>
</form>
Apparently this is not possible due to the way Firefox stores its passwords.
A password-manager entry is stored with the following data
The username (encrypted and secured with Firefox Master Password).
The password (encrypted and secured with Firefox Master Password).
The hostname of the webpage containing the login form.
The hostname of the webpage to which the form data has been submitted.
Thus Firefox does not distinguish between the two loginfields on my page.
I've not yet heard about a multiple form problem in Firefox.
But it could be that Firefox mixed up your 2 login forms if there is another tag around that is not closed properly.
I've had that problem myself with <p> tags and a not properly closed <div> around it.
I'm not sure.. but try to give them a different ID like <form method="POST" action="#" id="login1">

Resources