cancel
Showing results for 
Search instead for 
Did you mean: 
Read only

CSRF token validation failed for my POST Method in SAPUI5 using Eclipse?

vamsilakshman_pendurti
Active Participant
0 Likes
14,756

Hi Experts,

Here i am facing one issue with Create an entry into Database Table using SAPUI5 & OData. Fetching the data from Database and displaying in our SAPUI5 application has been done perfectly using OData Service. Fetching purpose i used the below code...

Output:

when i was trying to create by clicking on Create button : below i am providing my code for Create (POST) Method...

when i click on Save button it will not triggering my jQuery.ajax line in my Controller code so that it displays else part message.

In DOM i got the error like CSRF token validation failed...

i searched in SCN with the above mentioned error wise, but no relevant solution is found. If any one face this kind of issue and resolved please guide me the steps...where exactly i did the mistake.

Thanks,

Vamsi.

View Entire Topic
former_member340030
Contributor
0 Likes

Hi vamsilakshman pendurti,

You need to first fetch the XCSRF token and than need to pass for the post request as without xcsrf validation the server doesnt trust the client ..so it will not allow you to POST the data.

To fetch the x-CSRF token :

function getCSRFToken() { var token = null; $.ajax({ url: <your Service or metadata> type: "GET", async: false, beforeSend: function(xhr) { xhr.setRequestHeader("X-CSRF-Token", "Fetch"); complete: function(xhr) { token = xhr.getResponseHeader("X-CSRF-Token"); return token;

And than use this toke and set it in the header of the POST request like this :

xhr.setRequestHeader('X-CSRF-Token', token);
vamsilakshman_pendurti
Active Participant
0 Likes

Hi Viplove ,

Thanks for the reply and now my cursor is triggering the POST Method in $.ajax Statement.

I added that code which you mentioned for POST method...as shown below

Now i got the error like below mentioned...

Uncaught ReferenceError: xhr is not defined

how to define it ...

Thanks,

Vamc

former_member340030
Contributor
0 Likes

Hey ,

You are doing it incorrectly , i provided the code to be placed in beforeSend property of the ajax :

beforeSend: function(xhr) { xhr.setRequestHeader('X-CSRF-Token', token);}

and if you are using header property of ajax, you need to mention as key value pair .. reference http://api.jquery.com/jquery.ajax/

And also token is variable containing XCSRF token which you need to fetch from the GET request ..(mentioned in my previous answer)

thanks

VIplove

vamsilakshman_pendurti
Active Participant
0 Likes

Hi Viplove,

Basically i am from ABAP, i am new to this JAVASCRIPT that's y this confusion.

Here i am placing my code check it once..

If you don't mind please correct it...( if you have time please look into this code and make some modifications )

In the below code, Bold lettered lines of code is copied from your code...

CODE:

//''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''

function getCSRFToken() { var token = null;
$.ajax({ url: '<<My URL>>' ,
type: "GET",
async: false ,
crossDomain : true ,
headers: {
//'api-key' : 'XXXXX',
userId : 'vcuser',
password : '123456',
},
beforeSend: function(xhr){ xhr.setRequestHeader("X-CSRF-Token", "Fetch") ; },
complete: function(xhr){ token = xhr.getResponseHeader("X-CSRF-Token");
return token;
}
})
}

//''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''
$.ajax({
type: 'POST' ,
url : '<<My URL>>' ,
//jsonpCallback: 'processJSON',
dataType: "json",
data: JSON.stringify(oNew),
contentType:"application/json" ,
headers: xhr.setRequestHeader('X-CSRF-Token', token) ,
success: function(){
new sap.m.MessageToast.show("Customer Added Successfully");
oDialogue.close();
sap.ui.getCore().byId("myTable").getModel().refresh(true);
},

error: function(){
new sap.m.MessageToast.show("Error while adding the Customer");
oDialogue.close();
}
});

Thanks,

Vamc

former_member340030
Contributor
0 Likes

var token ;

$.ajax({ url: '<<My URL>>' ,
type: "GET",
beforeSend: function(xhr){ xhr.setRequestHeader("X-CSRF-Token", "Fetch") ; },
complete: function(xhr){ token = xhr.getResponseHeader("X-CSRF-Token");

$.ajax({
type: 'POST' ,
url : '<<My URL>>' ,
dataType: "json",
data: JSON.stringify(oNew),
contentType:"application/json" ,

beforeSend: function(xhr) { xhr.setRequestHeader('X-CSRF-Token', token);}

success: function(){

new sap.m.MessageToast.show("Customer Added Successfully");
oDialogue.close();
sap.ui.getCore().byId("myTable").getModel().refresh(true);
},
error: function(){
new sap.m.MessageToast.show("Error while adding the Customer");
oDialogue.close();
}
});


}
})

thanks

VIplove