jQuery Ajax POST call with JSON in Rest Web Service Issue - ajax

Question

I want to post a JSON object from my page to a Rest WS. But when I am posting json through jQuery ajax call as output I am getting a HTML page with "HTTP Status 405 - Method Not Allowed" instate of JSON, which I am sending from Rest Web Service. Please refer the following code snippet.
I am using jquery 1.11.3 version.
http://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js
jQuery Ajax Call:
$.ajax({
url: "http://localhost:8080/MyWebService/api/myService/jsonpost",
method: "POST",
data: jsonObj,
dataType: 'application/json',
contentType: "application/json",
success: function(result){
alert(result);
},
error(){
console.log('Error');
}
});
Please note my rest web service is running in my local tomcat.
Please find my Rest Web Service POST code.
#POST
#Path("/jsonpost")
#Consumes(MediaType.APPLICATION_JSON)
#Produces(MediaType.APPLICATION_JSON)
public String crunchifyJsonPostREST(SampleVO input) throws JSONException{
SampleVO sampleVO = input;
return new Gson().toJson(sampleVO);
}
VO:
public class SampleVO {
private String name;
/**
* #return the name
*/
#XmlElement
public String getName() {
return name;
}
/**
* #param name the name to set
*/
public void setName(String name) {
this.name = name;
}
}
My Maven Dependency is:
<dependency>
<groupId>com.sun.jersey</groupId>
<artifactId>jersey-server</artifactId>
<version>1.8</version>
</dependency>
<dependency>
<groupId>com.sun.jersey</groupId>
<artifactId>jersey-json</artifactId>
<version>1.8</version>
</dependency>
Firebug Details:
Please find my ajax request Header.
Please find my ajax response and response HTML.
Need your help to resolve this issue.
Thanks is advance.
Solution:
After lot of googling I have found some solution. Now I am using HTTP-Proxy-Servlet.
I have crated a java web application with my html page which has the ajax call and from my ajax call I am calling a URL of same domain. Please refer my ajax call.
$.ajax({
url: "rest/api/crunchifyService/jsonpost",
method: "POST",
data: JSON.stringify(jsonObj),
dataType: 'json',
contentType: "application/json",
success: function(result,status,jqXHR ){
//Do something
},
error(jqXHR, textStatus, errorThrown){
//Do something
}
});
Now I have done this same domain call mapping with org.mitre.dsmiley.httpproxy.ProxyServlet. Please refer my web xml.
<servlet>
<servlet-name>proxy</servlet-name>
<servlet-class>org.mitre.dsmiley.httpproxy.ProxyServlet</servlet-class>
<init-param>
<param-name>targetUri</param-name>
<param-value><!-- Cross domain URL goes here --></param-value>
</init-param>
<init-param>
<param-name>log</param-name>
<param-value>true</param-value>
</init-param>
</servlet>
<servlet-mapping>
<servlet-name>proxy</servlet-name>
<url-pattern>/rest/*</url-pattern>
</servlet-mapping>
Now my ajax is calling this Proxy Servlet and it is redirecting to the CROS destination Rest Web Service.
Please refer the following URL, you will get more details.
https://github.com/mitre/HTTP-Proxy-Servlet

Answer 1

After lot of googling I have found some solution. Now I am using HTTP-Proxy-Servlet.
I have crated a java web application with my html page which has the ajax call and from my ajax call I am calling a URL of same domain. Please refer my ajax call.
$.ajax({
url: "rest/api/crunchifyService/jsonpost",
method: "POST",
data: JSON.stringify(jsonObj),
dataType: 'json',
contentType: "application/json",
success: function(result,status,jqXHR ){
//Do something
},
error(jqXHR, textStatus, errorThrown){
//Do something
}
});
Now I have done this same domain call mapping with org.mitre.dsmiley.httpproxy.ProxyServlet. Please refer my web xml.
<servlet>
<servlet-name>proxy</servlet-name>
<servlet-class>org.mitre.dsmiley.httpproxy.ProxyServlet</servlet-class>
<init-param>
<param-name>targetUri</param-name>
<param-value><!-- Cross domain URL goes here --></param-value>
</init-param>
<init-param>
<param-name>log</param-name>
<param-value>true</param-value>
</init-param>
</servlet>
<servlet-mapping>
<servlet-name>proxy</servlet-name>
<url-pattern>/rest/*</url-pattern>
</servlet-mapping>
Now my ajax is calling this Proxy Servlet and it is redirecting to the CROS destination Rest Web Service.
Please refer the following URL, you will get more details.
https://github.com/mitre/HTTP-Proxy-Servlet

Answer 2

datatype should be dataType: 'json'
If you are using contentType: "application/json", , then you should stringify your data.
data:JSON.stringify(jsonObj),

Answer 3

Try using type & contentType settings of ajax:
type:'POST',
contentType: 'application/json',
Example:
function loadDoc(){
var num = '{"empid": 45,"name": "gaurav","salary":566.55}';
$.ajax({
url: 'http://localhost:9029/addS',
method: 'POST',
type:'POST',
contentType: 'application/json',
success: function(response){
console.log("response::::"+response);
$("#output").text(response);
},
error: function( jqXHR,textStatus, errorThrown){
console.log("Error askdjk");
console.log(jqXHR);
console.log(textStatus);
console.log(errorThrown);
}
});
}