Rajkiran Rajkiran - 1 year ago 256
jQuery Question

How to inject CSRFGuard security tokens using jQuery using $.ajax

I am using CSRFGuard 3.1.0
I have configured the servlet in web.xml



Now I have a JSP file userProfile.jsp
1) I have configured the script for injecting the tokens like

<script src="/JavaScriptServlet"></script>

2) Now I include the jQuery script file dedicated for this JSP file

<script src="../js/userProfile.js" type="text/javascript">

3) I have text box 1 - for original password
4) I have text box 2 - for new password
5) I have text box 3 - for confirm password
6) I have a change password button which makes AJAX call to the server

<button type="button" name="changePswd" id="changePswd">Change password</button>

7) On click of this button a $.ajax (jQuery) function is called which is in a js file. The function is as below:

function() {

url: location.protocol + "//" +location.host + '/my-project/secure/changePassword.html',

data: {
username : $('#userName').val(),
oldPassword : $('#oldPassword').val(),
newPassword : $('#newPassword').val(),
retypeNewPassword : $('#retypeNewPassword').val()

success: function(data) {

error: function(xhr,status,error) {

8) And this call is being blocked by CSRFGuard by saying

WARNING: potential cross-site request forgery (CSRF) attack thwarted (user:, ip:, method:GET, uri:/my-project/secure/changePassword.html,
error:required token is missing from the request)

And the when the browser load the userProfile.jsp file where the /JavaScriptServlet is expected to inject tokens, the browser is showing me 404 not found for this particular html call

I am using:
JDK 1.6
CSRFGuard 3.1.0
Weblogic 10.3.6 & jQuery-1.7.1-min.js
Please guide me how to inejct these tokens in this AJAX call!!
Thanks in advance!!

Answer Source

To make ajax call work you need to do the following steps:

1) On jsp page a. include the tag lib

<%@ taglib uri="http://www.owasp.org/index.php/Category:OWASP_CSRFGuard_Project/Owasp.CsrfGuard.tld" prefix="csrf" %>

2) inject the security token name & value in the meta tags like

<meta name="_csrf_header" content="<csrf:tokenname/>"/> 
    <meta name="_csrf" content="<csrf:tokenvalue/>"/>

3) on the .js page inject this values in the headers like

var csrfHeader = $("meta[name='_csrf_header']").attr("content");
                    var csrfToken = $("meta[name='_csrf']").attr("content");
                    var headers = {};
                    headers[csrfHeader] = csrfToken;
  headers: headers

And your ajax call should pass the test of CSRFGuard :)

4) /JavascriptServlet is not working or sending 404 in its response but it is not relevent to make the ajax call work


Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download