Java - spring controller - Angularjs form submission
Problem is with "#RequestBody OfferForm data" when i submit form i get error "404 bad request" but when i replace OfferForm bean with String object it works fine and display form data in json format.
any help appreciated.
Following is my angularjs function code
$scope.submitOffer = function() {
alert('submitOffer')
$http({method: 'POST', url: '/offer/submitOffer', data: $scope.formData}).
success(function(data, status, headers, config) {
$scope.successMsg = data;
}).
error(function(data, status, headers, config) {
if(status == 400) {
$scope.errMessages = data;
} else {
alert('Unexpected server error.');
}
});
};
Following is my controller code
#RequestMapping(value="offer")
public class OfferController{
#RequestMapping(value = "/submitOffer", method = RequestMethod.POST)
#ResponseBody public ResponseEntity<?> postForm(#RequestBody OfferForm data) {
System.out.println(data);
return new ResponseEntity<String>("Offer Created", HttpStatus.OK);
}
}
Following is my java bean
public class OfferForm {
private String offerType;
private String offerTitle;
public String getOfferType() {
return offerType;
}
public void setOfferType(String offerType) {
this.offerType = offerType;
}
public String getOfferTitle() {
return offerTitle;
}
public void setOfferTitle(String offerTitle) {
this.offerTitle = offerTitle;
}
}
Your $scope.formData object has more property than expected by the webservice.
You should provide to your webservice an object which has at most two properties of type string: offerType and offerTitle.
I think you currently have more properties than expected or you don't have the correct type, thus the bad request exception.
You could do something like that in your javascript, given that the two properties are a string:
$scope.submitOffer = function () {
$http({
method: 'POST',
url: '/offer/submitOffer',
data: {
offerType: $scope.formData.offerType,
offerTitle: $scope.formData.offerTitle
}
}).
success(function (data, status, headers, config) {
$scope.successMsg = data;
}).
error(function (data, status, headers, config) {
if (status == 400) {
$scope.errMessages = data;
} else {
alert('Unexpected server error.');
}
});
};
Related
From a js page (in angular) I call a REST request, GET method, were I would to pass an header, this is the function that I call from the REST request:
allstaffworking: function(_getstaff){
var currentToken = _GetToken();
var Headers = {
token: currentToken.stringtoken
};
console.log("idtoken"+Headers);
if (currentToken !== null) {
$http({
method : 'GET',
headers: Headers,
url : REST_URL+'staff/working'
}).then(function successCallback(response) {
_getstaff(response)
}, function errorCallback(response) {
console.log(response.statusText);
});
} else {
console.log("NON SEI LOGGATO!!!");
}
},
Whithout headers: Headers, it works, but I want to pass an important json string: {"idtokenStaff":11,"staffType":{"idstaffType":2,"type":"Dipendente"},"tokenStaff":"88d08m8ve4n8i71k796vajkd01"} in the Headers. I don't know How I can take this string in Jersey. This is java file in with I have the REST method:
#Path("/staff")
public class StaffController {
BaseDao sDao = new StaffDaoImpl();
StaffDao stfDao = new StaffDaoImpl();
TokenStaffDao tsDao = new TokenStaffDaoImpl();
TokenStaff ts = new TokenStaff();
#GET
#Produces(MediaType.APPLICATION_JSON)
public List<Staff> getStaff()
{
List<Staff> listOfStaff=sDao.getAll(Staff.class);
return listOfStaff;
}
#GET
#Path("/working")
#Produces(MediaType.APPLICATION_JSON)
#Consumes("application/json")
public List<Staff> getWStaff(#HeaderParam("token") String token) throws JSONException
{
JSONObject jsonObj = new JSONObject(token);
Boolean id = tsDao.getExistence(jsonObj.getInt("idtokenStaff"));
if (id){
List<Staff> listOfWStaff=stfDao.getAllW();
return listOfWStaff;
}
else
return null;
}
}
Taking header from: #HeaderParam("token") String token. How Can I take the element of the header?
A bit late to answer this, but you can also use #Context annotation to get httpheaders.
Eg.
public List<Staff> getWStaff(#Context HttpHeaders httpHeaders) {
String token = httpHeaders.getHeaderString("token");
JSONObject jsonObj = new JSONObject(token);
}
I'm trying to get a string response from my controller but I get the below error:
SyntaxError: Unexpected end of JSON input(…) "Error 200"
When I change the response to a boolean or a different type, it's working ok. The problem is when I try to return a string.
js code:
$.ajax({
method: "POST",
url: "./signup",
data: _data,
dataType: "json",
contentType : "application/json;charset=UTF-8",
success : function(data) {
console.log(data)
},
error : function(qXHR, textStatus, errorThrown){
console.log(errorThrown, "Error " + qXHR.status);
}
});
controller code:
#RequestMapping(value = "/signup", method = RequestMethod.POST, produces = {"text/plain", "application/*"})
public #ResponseBody String signup(#RequestBody UserSignup details) {
//...
return message;
}
any idea how can I solve this problem? I have tried a few things but nothing work. I think the response format is wrong as what the code expects.
Edit
I have changed my code(removed produces) but I still getting the same error:
SyntaxError: Unexpected end of JSON input(…) "Error 200"
#RequestMapping(value = "/signup", method = RequestMethod.POST)
public #ResponseBody String signup(#RequestBody UserSignup details) {
message = "ok";
}
return message;
}
Your method is wrong. You are saying to produce produces = {"text/plain", "application/*"} But you are also adding the #ResponseBody which will generate JSON format response.
I would suggest you remove the attribute produces. And verify the string you are returning is well formed
Try to wrap your response in ResponseEntity class
#RequestMapping(value = "/signup", method = RequestMethod.POST)
public #ResponseBody ResponseEntity<String> signup(#RequestBody UserSignup details) {
message = "ok";
return new ResponseEntity<>(message, HttpStatus.OK);
}
Also double check data that you are sending to server, maybe this is the problem, can you show us _data value?
As I don't have problem when the response is different stuff as a String I have solved the problem creating my own object. So below is the code:
public class Response<T> {
private T message;
private Exception ex;
public Exception getEx() {
return ex;
}
public void setEx(Exception ex) {
this.ex = ex;
}
public T getMessage() {
return message;
}
public void setMessage(T message) {
this.message = message;
}
}
#Controller
public class MyControllerController {
private Response<String> _response;
private String message;
public MyController() { _response = new Response<>(); }
#RequestMapping(value = "/signup", method = RequestMethod.POST)
public #ResponseBody Response<String> signup(#RequestBody UserSignup details) {
try{
message = "";
// code...
_response.setMessage(message);
return _response;
}catch (Exception ex){
_response.setEx(ex);
return _response;
}
}
}
response example in the browser:
Object {message: "", ex: null}
I've got Angular app and Java server.
I need to send POST request with JSON object consisting of string array and string field.
I'm using Angularjs $resource and Java javax.ws.rs.
My latest try as follows:
Client:
var messages = $resource('resources/messages/getmessages', {}, {
update: { method: 'POST', url: 'resources/messages/updatemessages' }
});
//...
var _args = { 'msgIdList': ['1', '2', '3'],
'action': 'makeSmth' };
return messages.update(_args).$promise.then(
function (data) {
//...
},
function (error) {
//...
}
)
Server:
#POST
#Path("updatemessages")
#Consumes(MediaType.APPLICATION_FORM_URLENCODED)
#Produces(MediaType.APPLICATION_JSON +"; charset=UTF-8")
public Response updateMessages( #FormParam("msgIdList") List<String> msgIdList,
#DefaultValue("") #FormParam("action") String action,
#CookieParam("rgsid") String c_sid,
#Context HttpServletRequest httpservletreq) {
//...
}
The problem is that I've got 415 Unsupported Media Type error, and don't know what to do next. I've tried lots of things, but may be I was wrong from the start, and I can't pass parameters this way?
Any help would be appreciated, thanks!
you can try this in your angular, maybe it can help.
var sendPost = $http({
method: "post",
url:"JAVA_SERVER_SERVICE_URL",
data: {
msgIdList: 'your_value',
action: 'your_value'
},
headers: { 'Content-Type': 'application/json' }
});
So, eventually I made a wrapper class, so now it looks this way:
#XmlRootElement
private static class RequestWrapper {
#XmlElement
private ArrayList<String> msgIdList;
#XmlElement
private String action;
public ArrayList<String> getMsgIdList() {
return msgIdList;
}
public void setMsgIdList(ArrayList<String> msgIdList) {
this.msgIdList = msgIdList;
}
public String getAction() {
return action;
}
public void setAction(String action) {
this.action = action;
}
public RequestWrapper() {
}
}
#POST
#Path("updatemessages")
#Consumes(MediaType.APPLICATION_JSON)
#Produces(MediaType.APPLICATION_JSON +"; charset=UTF-8")
public Response updateMessages( RequestWrapper requestData,
#CookieParam("rgsid") String c_sid,
#Context HttpServletRequest httpservletreq) {
//...}
Angular part stays unchanged.
I'm not really sure, if this the right way to go (class description and so on), but it works.
I ma using Spring MVC and trying to use jQuery. I have this on my web page:
$(document).ready(function () {
var entity = {mag: "status_key", paper: "View10"};
$("#btn").click(function () {
$.ajax({
url: "ajaxJsonPost",
type: 'post',
dataType: 'json',
data: JSON.stringify(entity),
contentType: 'application/json',
});
});
});
Spring server has this:
#RequestMapping(value = "ajaxJsonPost", method = RequestMethod.POST)
public void postJson(#RequestBody Entity en) throws IOException {
System.out.println("writing entity: " + en.toString());
}
OK, Entity cames to server. BUT browser console prints 404 not found. I know that my POST request needs any response. In the Internet I've found solution which recommends me to return ResponseEntity object, OR use annotation #ResponseStatus. They both return HttpStatus well, but I don't know in which cases I should use them. What is the best way?
#Controller
#RequestMapping("/apipath")
public class SomeController {
#RequestMapping(value = "/ajaxJsonPost", method = RequestMethod.POST, consumes = MediaType.APPLICATION_JSON_VALUE)
#ResponseBody
public String postJson(#RequestBody final Entity en) {
System.out.println(en.toString());
//assuming you have a class "EntityService" and
//it has a method postData
//which takes Entity object as parameter and pushes into database.
EntityService.postData(en);
System.out.println("added");
return "success";
}
}
Entity object on the Server side
#JsonAutoDetect
public class Entity {
private String mag;
private String paper;
public String getMag() {
return mag;
}
public void setMag(final String mag) {
this.mag = mag;
}
public String getPaper() {
return paper;
}
public void setPaper(final String paper)
this.paper = paper;
}
}
ajax
$(document).ready(function () {
var entity = {mag: "status_key", paper: "View10"};
$("#btn").click(function () {
$.ajax({
url: "/apipath/ajaxJsonPost",
type: 'post',
dataType: 'json',
data: JSON.stringify(entity),
contentType: 'application/json',
success : function(response) {
alert(response);
},
error : function() {
alert('error');
}
});
});
});
And as far as why and when to use #ResponseStatus and #ResponseEntity, there is already a short and simple answer here by #Sotirios Delimanolis. When use #ResponseEntity .
It says :
ResponseEntity is meant to represent the entire HTTP response. You can
control anything that goes into it: status code, headers, and body.
#ResponseBody is a marker for the HTTP response body and
#ResponseStatus declares the status code of the HTTP response.
#ResponseStatus isn't very flexible. It marks the entire method so you
have to be sure that your handler method will always behave the same
way. And you still can't set the headers. You'd need the
HttpServletResponse or a HttpHeaders parameter.
Basically, ResponseEntity lets you do more.
I get following response when I try to delete: 405 Method Not Allowed.
In my logs there is written that GET is allowed, but DELETE isn't.
Java:
#ResponseBody
#RequestMapping(method = RequestMethod.DELETE, value = "/{id}")
public void delete(#PathVariable String id) {
speakerService.delete(id);
}
Angularjs
app.factory('SpeakerResource', function ($resource) {
return $resource('rest/speaker/:speakerId',
{
speakerId: '#speakerId'
},
{
'update': { method: 'PUT' }
},
{
'delete': { method: 'DELETE', params: { 'id': 'speakerId' }}
}
)
});
SpeakerService
this.delete = function (id, callback) {
SpeakerResource.delete({ speakerId: id }, function () {
callback();
});
}
I do not know your complete code, and I am not an expert in AngularJS, but it looks like your want to send a DELETE request to the URL <hopefullySomething>/{id} (Path variable). But it looks like that you send a DELETE request so some URL with an parameter id <hopefullySomething>?id={id} (Request parameter).
This question and answers explain the difference between path variable and request parameters a bit more #RequestParam vs #PathVariable
use $http.delete(), and return data for example status, I just tested the following with spring and working correctly
#RequestMapping(value = "delete/{id}", method = RequestMethod.DELETE)
public #ResponseBody Status deletePerson(#PathVariable("id") int id) {
try {
personService.removePerson(id);
return new Status(1, "person deleted Successfully !");
} catch (Exception e) {
return new Status(0, e.toString());
}
}
angular
angular.module('personService', [])
.factory('Person', ['$http',function($http) {
return {
deletePerson: function(id) {
return $http.delete('/restperson/delete/'+id);
}
}
}]);
controller
angular.module('personController', [])
// inject the person service factory into our controller
.controller('mainController', ['$scope','$http','Person', function($scope, $http, Person) {
//delete
$scope.deletePerson = function(id) {
Person.deletePerson(id)
.success(function(data) {
$scope.message = data;
});
};
}]);