Hi I just started learning Spring, AJAX, JSON. I have been getting an error when i try to post a message back.

messages.jsp

function success(data) {
    $("#form" + data.target).toggle();
    $("#alert" + data.target).text("Message sent.")
    startTimer();

}

function error(data) {
    alert("Error sending message");
} 

function sendMessage(i, name, email){
    var text = $("#textbox" + i).val();

    $.ajax({
        type: "POST", 
        url: '<c:url value="/sendmessage" />',
        data: JSON.stringify({"target": i, "text": text, "name": name, "email": email}),
        success: success,
        error: error,
        contentType: "application/json",
        dataType: "json"
    });

}

function showMessages(data){

    $("div#messages").html("");

    for(var i=0; i<data.messages.length; i++) {
        var message = data.messages[i];

        var messageDiv = document.createElement("div");
        messageDiv.setAttribute("class", "message");

        var subjectSpan = document.createElement("span");
        subjectSpan.setAttribute("class", "subject");
        subjectSpan.appendChild(document.createTextNode(message.subject));

        var contentSpan = document.createElement("span");
        contentSpan.setAttribute("class", "contentText");
        contentSpan.appendChild(document.createTextNode(message.content));

        var nameSpan = document.createElement("span");
        nameSpan.setAttribute("class", "nameSpan");
        nameSpan.appendChild(document.createTextNode("From: "+ message.name + '('));

        var link = document.createElement("a");
        link.setAttribute("class", "replylink");
        link.setAttribute("href", "#");
        link.setAttribute("onClick", "showReply(" + i + ")");
        link.appendChild(document.createTextNode(message.email));
        nameSpan.appendChild(link);
        nameSpan.appendChild(document.createTextNode(")"));

        var alertSpan = document.createElement("span");
        alertSpan.setAttribute("class", "alert");
        alertSpan.setAttribute("id", "alert" + i);          

        var replyForm = document.createElement("form");
        replyForm.setAttribute("class", "replyForm");
        replyForm.setAttribute("id", "form" + i);

        var textarea = document.createElement("textarea");
        textarea.setAttribute("class", "replyArea");
        textarea.setAttribute("id", "textbox" + i);


        var replyButton = document.createElement("input");
        replyButton.setAttribute("class", "replyButton");
        replyButton.setAttribute("type", "button");
        replyButton.setAttribute("value", "reply");
        replyButton.onclick = function(j, name, email) {
            return function() {
                sendMessage(j, name, email);
            }
        }(i, message.name, message.email);

        replyForm.appendChild(textarea);
        replyForm.appendChild(replyButton);

        messageDiv.appendChild(subjectSpan);
        messageDiv.appendChild(contentSpan);
        messageDiv.appendChild(nameSpan);
        messageDiv.appendChild(alertSpan);
        messageDiv.appendChild(replyForm);


        $("div#messages").append(messageDiv);
    }
}

controller.java

@RequestMapping(value="/sendmessage", method=RequestMethod.POST, produces="application/json")
@ResponseBody
public Map<String, Object> sendMessages(Principal principal, @RequestBody Map<String, Object> data){

    String text = (String)data.get("text");
    String name = (String)data.get("name");
    String email = (String)data.get("email");
    Integer target = (Integer)data.get("target");

    System.out.println(name + " , " + email + " , " + text);

    Map<String, Object> returnVal = new HashMap<String, Object>();      
    returnVal.put("success", true);
    returnVal.put("target", target);

    return returnVal;
}

I have tried many different things to solve this problem but nothing is working, I can't post the message.

Any help or reason why I keep getting this error?

jquery.js:4 POST http://localhost:8080/spring/sendmessage 403 (Forbidden) send @ jquery.js:4 ajax @ jquery.js:4 sendMessage @ messagesView:32 (anonymous function) @ messagesView:90

Screenshot

Hi I just started learning Spring, AJAX, JSON. I have been getting an error when i try to post a message back.

messages.jsp

function success(data) {
    $("#form" + data.target).toggle();
    $("#alert" + data.target).text("Message sent.")
    startTimer();

}

function error(data) {
    alert("Error sending message");
} 

function sendMessage(i, name, email){
    var text = $("#textbox" + i).val();

    $.ajax({
        type: "POST", 
        url: '<c:url value="/sendmessage" />',
        data: JSON.stringify({"target": i, "text": text, "name": name, "email": email}),
        success: success,
        error: error,
        contentType: "application/json",
        dataType: "json"
    });

}

function showMessages(data){

    $("div#messages").html("");

    for(var i=0; i<data.messages.length; i++) {
        var message = data.messages[i];

        var messageDiv = document.createElement("div");
        messageDiv.setAttribute("class", "message");

        var subjectSpan = document.createElement("span");
        subjectSpan.setAttribute("class", "subject");
        subjectSpan.appendChild(document.createTextNode(message.subject));

        var contentSpan = document.createElement("span");
        contentSpan.setAttribute("class", "contentText");
        contentSpan.appendChild(document.createTextNode(message.content));

        var nameSpan = document.createElement("span");
        nameSpan.setAttribute("class", "nameSpan");
        nameSpan.appendChild(document.createTextNode("From: "+ message.name + '('));

        var link = document.createElement("a");
        link.setAttribute("class", "replylink");
        link.setAttribute("href", "#");
        link.setAttribute("onClick", "showReply(" + i + ")");
        link.appendChild(document.createTextNode(message.email));
        nameSpan.appendChild(link);
        nameSpan.appendChild(document.createTextNode(")"));

        var alertSpan = document.createElement("span");
        alertSpan.setAttribute("class", "alert");
        alertSpan.setAttribute("id", "alert" + i);          

        var replyForm = document.createElement("form");
        replyForm.setAttribute("class", "replyForm");
        replyForm.setAttribute("id", "form" + i);

        var textarea = document.createElement("textarea");
        textarea.setAttribute("class", "replyArea");
        textarea.setAttribute("id", "textbox" + i);


        var replyButton = document.createElement("input");
        replyButton.setAttribute("class", "replyButton");
        replyButton.setAttribute("type", "button");
        replyButton.setAttribute("value", "reply");
        replyButton.onclick = function(j, name, email) {
            return function() {
                sendMessage(j, name, email);
            }
        }(i, message.name, message.email);

        replyForm.appendChild(textarea);
        replyForm.appendChild(replyButton);

        messageDiv.appendChild(subjectSpan);
        messageDiv.appendChild(contentSpan);
        messageDiv.appendChild(nameSpan);
        messageDiv.appendChild(alertSpan);
        messageDiv.appendChild(replyForm);


        $("div#messages").append(messageDiv);
    }
}

controller.java

@RequestMapping(value="/sendmessage", method=RequestMethod.POST, produces="application/json")
@ResponseBody
public Map<String, Object> sendMessages(Principal principal, @RequestBody Map<String, Object> data){

    String text = (String)data.get("text");
    String name = (String)data.get("name");
    String email = (String)data.get("email");
    Integer target = (Integer)data.get("target");

    System.out.println(name + " , " + email + " , " + text);

    Map<String, Object> returnVal = new HashMap<String, Object>();      
    returnVal.put("success", true);
    returnVal.put("target", target);

    return returnVal;
}

I have tried many different things to solve this problem but nothing is working, I can't post the message.

Any help or reason why I keep getting this error?

jquery.js:4 POST http://localhost:8080/spring/sendmessage 403 (Forbidden) send @ jquery.js:4 ajax @ jquery.js:4 sendMessage @ messagesView:32 (anonymous function) @ messagesView:90

Screenshot

• javascript
• jquery
• json
• ajax
• spring

Share Improve this question Follow edited Oct 30, 2016 at 8:50 JJ9999 asked Oct 29, 2016 at 21:47 JJ9999JJ9999 5111 gold badge11 silver badge66 bronze badges 10

• What about your security configuration? – M S Commented Oct 29, 2016 at 21:50
• I have set the security to isAuthenticated likes this: <security:intercept-url pattern="/messagesView" access="isAuthenticated()" /> <security:intercept-url pattern="/sendmessage" access="isAuthenticated()" /> – JJ9999 Commented Oct 29, 2016 at 21:54
• Have you logged in your application before the sending request? If you have a security problem you can check with setting permitAll for one time. If is it work when you set permitAll that means you have a security problem. – M S Commented Oct 29, 2016 at 21:56
• Yeah I am logged in I keep getting the error message – JJ9999 Commented Oct 29, 2016 at 22:04
• I keep getting this error -POST localhost:8080/spring/sendmessage 403 (Forbidden) – JJ9999 Commented Oct 29, 2016 at 22:05

 |  Show 5 more ments

2 Answers 2

Sorted by: Reset to default 1

I had the same problem, you need to add the CSRF headers into the AJAX POST request. Take a look at Cross Site Request Forgery. I'm not at my development system at the moment so can't post an example, but using the info from this page worked for me.

step-1: put a id to the form --->

<form id='formid' ....>    

step-2: pass the form as serialize form --->

$.ajax({
        type: "POST", 
        url: '<c:url value="/sendmessage" />',
        data: ('#formid').serialize(),
        success: success,
        error: error,
        contentType: "application/json",
        dataType: "json"
 });