如何通过Ajax调用使用剩余的Web服务

Question

I want to call my rest web service from ajax. Url for my service is ' https://scv-dev.com/cdcAug/surveys/surveyData '. Iam able to call this service from rest client (firefox browser) but when am trying to call from ajax am getting error.

Ajax call :

$.ajax({
     type: "POST",
     url: "https://scv-dev.com/cdcAug/surveys/surveyData",
     data: JSON.stringify({surveyId:1}),
     dataType: "json",
     headers: {
            Accept: "application/json",
            "Access-Control-Allow-Origin": "*"
        },
     success: function (data) {
          alert(1);
     },

     error: function (jqXHR) {            
          alert(2);
     }

 });

Below is code for webs service :

@RequestMapping(value = "/surveyData", method = RequestMethod.POST, headers = "Accept=application/json")
public @ResponseBody
SurveyDataResponse getSurveyData(@RequestBody SurveyResApp surveyResApp,
        final HttpServletResponse httpResponse) {
            ..............
        }

Answer 1

You appear to be confused about Access-Control-Allow-Origin: * . That is something the server returns, not something the client sets.

It appears that you have a same-origin access error and looking in the browser error log or diagnosing the returned error codes should tell you what exactly is going on.

You probably need to enable your web service for cross origin access by adding that header Access-Control-Allow-Origin: * to your server response. See here for an example.

Answer 2

I created filter class added below code in that to add "Access-Control-Allow-Methods" in response.

response.addHeader("Access-Control-Allow-Origin", "*");
    response.addHeader("Access-Control-Allow-Methods", "POST, GET, OPTIONS, PUT, DELETE, HEAD");
    response.addHeader("Access-Control-Allow-Headers", "X-PINGOTHER, Origin, X-Requested-With, Content-Type, Accept");
    response.addHeader("Access-Control-Max-Age", "1728000");