Need help with the exception getting whilst posting data to server, although GET method works fine within the same REST Resource. Code is given below; Early attention appreciated.
REST Endpoint
#RestController
#RequestMapping("/trading-api")
public class MemberMessageResource {
private final Logger log = LoggerFactory.getLogger(MemberMessageResource.class);
#Inject
MemberMessageService service;
#RequestMapping(value = "/messages/reply/", method = RequestMethod.POST, produces = MediaType.APPLICATION_JSON_VALUE)
public ResponseEntity<MemMessage> replyMemeberMessage(#RequestBody MemMessage msg)
throws URISyntaxException {
log.info("REST Request to reply a message : {" + msg.toString() + " }");
MemMessage result = msg;
return new ResponseEntity<MemMessage>(result, HttpStatus.OK);
}
}
MessageService.js
'use strict';
angular.module('nkApp').factory(
'messagesService',
[
'$http',
'$q',
function($http, $q) {
var REST_SERVICE_URI = '/trading-api/messages/';
var factory = {
replyMemeberMessage : replyMemeberMessage
};
return factory;
function replyMemeberMessage(message) {
console.log('Replying Message : ', message);
var deferred = $q.defer();
$http.post(REST_SERVICE_URI + "reply/" + message)
.then(
function (response) {
deferred.resolve(response.data);
},
function(errResponse){
console.error('Error while Replying Message');
deferred.reject(errResponse);
}
);
return deferred.promise;
}
} ]);
Console Error
2017-03-10 23:49:21.515 WARN 11764 --- [nio-8080-exec-8] o.s.web.servlet.PageNotFound : Request method 'POST' not supported
Browser Error
{"timestamp":1489189761519,"status":405,"error":"Method Not Allowed","exception":"org.springframework.web.HttpRequestMethodNotSupportedException","message":"Request method 'POST' not supported","path":"/trading-api/messages/reply/[object%20Object]"}
Your message object should not be part of your url, it should be your request body. Instead of adding to the url string, just pass it as the data argument in your angular javascript function:
$http.post(REST_SERVICE_URI + "reply/", message)
Related
in my angular js code I have date as string:
self.submit = function () {
console.log("in voice prompt component - submit");
console.log(self.voice);
self.fromDate = new Date(self.fromDate);
$http.put('http://localhost:8082/api/Voices/updateVoice', self.fromDate).then(
function successCallback(response) {
self.voices = response.data;
}, function errorCallback(response) {
// called asynchronously if an error occurs
// or server returns response with an error status.
console.log(response);
});
}
I want to send it to my server: LocalDate from Java 8
#Path("/updateVoice")
#PUT
#Produces(MediaType.APPLICATION_JSON + ";charset=utf-8")
public void updateVoice(LocalDate fromDate) throws Exception {
but i get an error:
Can not construct instance of java.time.LocalDate: no String-argument constructor/factory method to deserialize from String value ('2017-04-04T21:00:00.000Z')
Hello all i am trying to post a form using angular but i am getting null values in my spring controller.Also in my console i see null values for the sysout.Moreover i get an error alert even though i see bull is printed on my console.
My JS Controller
angular.module('ngMailChimp', ['ngAria', 'ngMessages', 'ngAnimate'])
.controller('SignUpController', function ($scope, $http) {
$http.defaults.headers.post["Content-Type"] = "application/x-www-form-urlencoded; charset=utf-8";
var ctrl = this,
newCustomer = { firstName:'',lastName:'',email:'',streetName:'',aptName:'',cityName:'',stateName:'',countryName:'', zipName:'', userName:'',password:'' };
var signup = function () {
if( ctrl.signupForm.$valid) {
ctrl.showSubmittedPrompt = true;
var formData = {
'firstName' : $scope.ctrl.newCustomer.firstName,
'lastName' : $scope.ctrl.newCustomer.lastName,
'email' : $scope.ctrl.newCustomer.email,
'streetName' : $scope.ctrl.newCustomer.streetName,
'aptName' : $scope.ctrl.newCustomer.aptName,
'cityName' : $scope.ctrl.newCustomer.cityName,
'stateName' : $scope.ctrl.newCustomer.stateName,
'countryName' : $scope.ctrl.newCustomer.countryName,
'zipName' : $scope.ctrl.newCustomer.zipName,
'userName' : $scope.ctrl.newCustomer.userName,
'password' : $scope.ctrl.newCustomer.password
};
var response = $http.post('http://localhost:8080/Weber/user/save', JSON.stringify(formData));
response.success(function(data, status, headers, config) {
$scope.list.push(data);
});
response.error(function(data, status, headers, config) {
alert( "Exception details: " + JSON.stringify({data: data}));
});
}
};
My Spring controller
#RestController
#RequestMapping(value = "/user")
public class UserRegistrationControllerImpl implements UserRegistrationController {
#Autowired
UserRegistrationDao userDao;
#RequestMapping(value = "/save", method = RequestMethod.POST)
public String saveUser(UserRegistration userReg) {
System.out.println(userReg.getFirstName()+" "+userReg.getLastName());
userDao.registerUser(userReg);
return "success";
}
Please help me out
Thank you
mark.
There is no mapper specified for converting JSON to Java object.
Use Jackson(dore, databind, annotations) if you want the JSON to be converted to object of UserRegistration.
Check this out: Convert nested java objects to Jackson JSON
Need to add below in dispatcher-servlet. This is for mapping the JSON to Java objects:
<beans:bean
class="org.springframework.web.servlet.mvc.method.annotation.RequestMappingHandlerAdapter">
<beans:property name="messageConverters">
<beans:list>
<beans:ref bean="jsonMessageConverter" />
</beans:list>
</beans:property>
</beans:bean>
<!-- Configure bean to convert JSON to POJO and vice versa -->
<beans:bean id="jsonMessageConverter"
class="org.springframework.http.converter.json.MappingJackson2HttpMessageConverter">
</beans:bean>
EDIT 1:
Is the method in controller something like this?
#RequestMapping(value = "/save", method = RequestMethod.POST, headers = "Accept=application/json")
public String saveUser(#RequestBody UserRegistration userReg) {
System.out.println(userReg.getFirstName()+" "+userReg.getLastName());
userDao.registerUser(userReg);
return "success";
}
Use above if you are not responding back to the webpage with a result to be consumed. If you want something to be returned from this method and displayed in the webpage or consumed elsewhere, the declaration of method would change to:
public #ResponseBody String saveUser(#RequestBody UserRegistration userReg)
EDIT 2:
$scope.post = function() {
$scope.data = null;
$http({
method : 'POST',
url : 'save',
params : {
firstName : $scope.ctrl.newCustomer.firstName,
lastName : $scope.ctrl.newCustomer.lastName,
email : $scope.ctrl.newCustomer.email,
streetName : $scope.ctrl.newCustomer.streetName,
aptName : $scope.ctrl.newCustomer.aptName,
cityName : $scope.ctrl.newCustomer.cityName,
stateName : $scope.ctrl.newCustomer.stateName,
countryName : $scope.ctrl.newCustomer.countryName,
zipName : $scope.ctrl.newCustomer.zipName,
userName : $scope.ctrl.newCustomer.userName,
password : $scope.ctrl.newCustomer.password
}
}).success(function(data, status, headers, config) {
$scope.list.push(data);
}).error(function(data, status, headers, config) {
alert("Exception");
});
};
Try add #RequestBody in the method arguments:
#RequestMapping(value = "/save", method = RequestMethod.POST)
public String saveUser(#RequestBody UserRegistration userReg) {
System.out.println(userReg.getFirstName()+" "+userReg.getLastName());
userDao.registerUser(userReg);
return "success";
}
I'm making a simple establishment of registration that must have data and a logo. In tests could transmit the file and the data separately but when trying to send them together the following error occurs:
SyntaxError: Unexpected token S
at Object.parse (native)
at qc (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js:14:245)
at Zb (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js:76:423)
at https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js:77:283
at r (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js:7:302)
at Zc (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js:77:265)
at c (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js:78:414)
at https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js:112:113
at n.$get.n.$eval (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js:126:15)
at n.$get.n.$digest (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js:123:106)
The Angular Controller
angular.module('EntregaJaApp').controller('EstabelecimentoController', ['$scope', '$http','Upload', function($scope, $http,Upload){
$scope.salvar = function(){
Upload.upload({
url: 'http://localhost:8080/site-web/gerencial/estabelecimento/salvar',
file: $scope.picFile[0],
method: 'POST',
headers: {'Content-Type': 'multipart/form-data'}, // only for html5
data: {'estabelecimento': $scope.estabelecimento}
});
}}
The Spring Controller
#Controller
#RequestMapping("/gerencial/estabelecimento")
public class EstabelecimentoController {
#Autowired
private EstabelecimentoService estabelecimentoService;
#RequestMapping(value = "/salvar", method = RequestMethod.POST)
public ResponseEntity<?> salvar(Estabelecimento estabelecimento,#RequestParam(value="file", required=false) MultipartFile file){
try {
byte[] bytes;
if (!file.isEmpty()) {
bytes = file.getBytes();
//store file in storage
}
System.out.println(String.format("receive %s from %s", file.getOriginalFilename(), estabelecimento.getNome()));
estabelecimentoService.salvar(estabelecimento);
return new ResponseEntity<>(MensagensGerais.SUCESSO_SALVAR,HttpStatus.OK);
} catch (Exception e) {
return new ResponseEntity<>((StringUtil.eVazia(e.getMessage()) ? MensagensGerais.ERRO_CONSULTAR : e.getMessage()),HttpStatus.BAD_REQUEST);
}
}
}
did you missed the return type annotation? Like
#RequestMapping(value = "/salvar", method = RequestMethod.POST)
#Produces(MediaType.APPLICATION_JSON)
public ResponseEntity<?> salvar(Estabelecimento estabelecimento,#RequestParam(value="file", required=false) MultipartFile file){...}
Assuming that the request specifies an Accept Header "application/json", it seems that the Strings are not correctly serialized (by Spring?). Angular versions prior to 1.3.x seem to have been generous, but now an exception is thrown when the response is not correct JSON. I have added the following response transformer to my app:
$httpProvider.defaults.transformResponse.unshift(function(data, headersGetter, status){
var contentType = headersGetter('Content-Type');
if(angular.isString(contentType) && contentType.startsWith('application/json')){
try {
angular.fromJson(data);
} catch(e){
var mod = '"'+data+'"';
try {
angular.fromJson(mod);
return mod;
}
catch(e){
return data;
}
}
return data;
}
else{
return data;
}
});
It transforms a JS string to a JSON string object by wrapping it in additional ".
I have implemented authentication system and after upgrading from angular 1.0.8 to 1.2.x,
system doesn't work as it used to. When user logs in it gets a token. When token is expired,
a refresh function for new token is called. New token is successfully created on a server and it is
stored to database. But client doesn't get this new token, so it requests a new token again,
and again and again until it logs out. Server side (MVC Web Api) is working fine, so problem must
be on client side. The problem must be on a retry queue. Below I pasted relevant code and
a console trace for both versions of applications (1.0.8 and 1.2.x).
I am struggling with this for days now and I can't figure it out.
In the link below, there are 5 relevant code blocks:
interceptor.js (for intercepting requests, both versions)
retryQueue.js (manages queue of retry requests)
security.js (manages handler for retry queue item and gets a new token from api)
httpHeaders.js (sets headers)
tokenHandler.js (handles tokens in a cookies)
Code: http://pastebin.com/Jy2mzLgj
Console traces for app in angular 1.0.8: http://pastebin.com/aL0VkwdN
and angular 1.2.x: http://pastebin.com/WFEuC6WB
interceptor.js (angular 1.2.x version)
angular.module('security.interceptor', ['security.retryQueue'])
.factory('securityInterceptor', ['$injector', 'securityRetryQueue', '$q',
function ($injector, queue, $q) {
return {
response: function(originalResponse) {
return originalResponse;
},
responseError: function (originalResponse) {
var exception;
if (originalResponse.headers){
exception = originalResponse.headers('x-eva-api-exception');
}
if (originalResponse.status === 401 &&
(exception === 'token_not_found' ||
exception === 'token_expired')){
queue.pushRetryFn(exception, function retryRequest() {
return $injector.get('$http')(originalResponse.config);
});
}
return $q.reject(originalResponse);
}
};
}])
.config(['$httpProvider', function($httpProvider) {
$httpProvider.interceptors.push('securityInterceptor');
}]);
retryQueue.js
angular.module('security.retryQueue', [])
.factory('securityRetryQueue', ['$q', '$log', function($q, $log) {
var retryQueue = [];
var service = {
onItemAddedCallbacks: [],
hasMore: function(){
return retryQueue.length > 0;
},
push: function(retryItem){
retryQueue.push(retryItem);
angular.forEach(service.onItemAddedCallbacks, function(cb) {
try {
cb(retryItem);
}
catch(e){
$log.error('callback threw an error' + e);
}
});
},
pushRetryFn: function(reason, retryFn){
if ( arguments.length === 1) {
retryFn = reason;
reason = undefined;
}
var deferred = $q.defer();
var retryItem = {
reason: reason,
retry: function() {
$q.when(retryFn()).then(function(value) {
deferred.resolve(value);
}, function(value){
deferred.reject(value);
});
},
cancel: function() {
deferred.reject();
}
};
service.push(retryItem);
return deferred.promise;
},
retryAll: function() {
while(service.hasMore()) {
retryQueue.shift().retry();
}
}
};
return service;
}]);
security.js
angular.module('security.service', [
'session.service',
'security.signin',
'security.retryQueue',
'security.tokens',
'ngCookies'
])
.factory('security', ['$location', 'securityRetryQueue', '$q', /* etc. */ function(){
var skipRequests = false;
queue.onItemAddedCallbacks.push(function(retryItem) {
if (queue.hasMore()) {
if(skipRequests) {return;}
skipRequests = true;
if(retryItem.reason === 'token_expired') {
service.refreshToken().then(function(result) {
if(result) { queue.retryAll(); }
else {service.signout(); }
skipRequests = false;
});
} else {
skipRequests = false;
service.signout();
}
}
});
var service = {
showSignin: function() {
queue.cancelAll();
redirect('/signin');
},
signout: function() {
if(service.isAuthenticated()){
service.currentUser = null;
TokenHandler.clear();
$cookieStore.remove('current-user');
service.showSignin();
}
},
refreshToken: function() {
var d = $q.defer();
var token = TokenHandler.getRefreshToken();
if(!token) { d.resolve(false); }
var session = new Session({ refreshToken: token });
session.tokenRefresh(function(result){
if(result) {
d.resolve(true);
TokenHandler.set(result);
} else {
d.resolve(false);
}
});
return d.promise;
}
};
return service;
}]);
session.service.js
angular.module('session.service', ['ngResource'])
.factory('Session', ['$resource', '$rootScope', function($resource, $rootScope) {
var Session = $resource('../api/tokens', {}, {
create: {method: 'POST'}
});
Session.prototype.passwordSignIn = function(ob) {
return Session.create(angular.extend({
grantType: 'password',
clientId: $rootScope.clientId
}, this), ob);
};
Session.prototype.tokenRefresh = function(ob) {
return Session.create(angular.extend({
grantType: 'refresh_token',
clientId: $rootScope.clientId
}, this), ob);
};
return Session;
}]);
Thanks to #Zerot for suggestions and code samples, I had to change part of the interceptor like this:
if (originalResponse.status === 401 &&
(exception === 'token_not_found' || exception === 'token_expired')){
var defer = $q.defer();
queue.pushRetryFn(exception, function retryRequest() {
var activeToken = $cookieStore.get('authorization-token').accessToken;
var config = originalResponse.config;
config.headers.Authorization = 'Bearer ' + activeToken;
return $injector.get('$http')(config)
.then(function(res) {
defer.resolve(res);
}, function(err)
{
defer.reject(err);
});
});
return defer.promise;
}
Many thanks,
Jani
Have you tried to fix the error you have in the 1.2 log?
Error: [ngRepeat:dupes] Duplicates in a repeater are not allowed. Use 'track by' expression to specify unique keys. Repeater: project in client.projects, Duplicate key: string:e
That error is at the exact point where you would need to see the $httpHeaders set line. It looks like your session.tokenrefresh is not working(and that code is also missing from the pastebin so I can't check.)
Interceptors should always return a promise.
So in responseError, you should better return $q.reject(originalResponse); instead of just return originalResponse.
Hope this helps
I think that your interceptor returns wrong result in errorResponse method.
I faced some "undebuggable" issue for the same reason.
With this code you could fall in some infinite loop flow...
Hope this helps.
Follow up from AngularJS $resource calls the wrong API URL when using method:POST
My controller is set up like this, with Angular's $resource:
$scope.updateProduct = $resource('/api/updateProduct/:product/:param/:value',{},{
query: {method:'GET'},
post: {method:'POST'},
save: {method:'PUT', params: {brand: '#brand', param:'#param', value:'#value'}},
remove: {method:'DELETE'}
});
$scope.updateProduct.save({
product : $scope.post._id,
param: 'likes',
value: $scope.user._id
});
My server runs on NodeJS and ExpressJS. In my console, when the save operation is called, I can see:
POST /api/updateBrand/<productid>/likes/fun,%20quirky%20loud,%20boho,%20hippy 200 22ms - 2.31kb
However, my API is not being correctly accessed. For instance, if I go to the above URL in my browser, the API function is called, and my database is updated (and it is reported in my server's console). Yet when Angular does a PUT on this URL, nothing happens at all.
Interestingly, when I change $scope.updateProduct.save() to $scope.updateProduct.get(), the API is correctly called and everything works fine.
Any ideas what's going on here?
EDIT: Here's the server setup:
ExpressJS API setup:
app.get('/api/updateProduct/:product/:param/:value', api.updateProduct);
API code
exports.updateProduct = function (req, res) {
console.log("TEST")
var product = req.params.product;
var param = req.params.param;
var value = req.params.value;
var props = { $push: {} };
if(param == 'userTags'){
var oldVal = value;
value = oldVal.match(/[-'"\w]+/g);
props.$push[param];
props.$push[param] = {$each: []};
props.$push[param].$each = value;
}else{
var props = { $push: {} };
props.$push[param] = value;
}
db.products.update({"_id": ObjectId(product)}, props, function (err, record) {
if (err || !(record)) {
console.log("Lookup Error: " + err);
} else{
console.log("Updated " + product + " with " + param);
console.log(record);
res.json({obj:record})
}
});
};
It seems that your server is not waiting for a POST or PUT request, but a GET request as per your configuration.
app.get('/api/updateProduct/:product/:param/:value', api.updateProduct);
According to the ExpressJS API (http://expressjs.com/api.html), you should be able to replace the get with any valid http verb.
app.VERB(path, [callback...], callback)
app.post('/api/updateProduct/:product/:param/:value', api.updateProduct);
app.put('/api/updateProduct/:product/:param/:value', api.updateProduct);