I am trying to do an $http.post and get the response, I tried in several ways but I can't get it working.
The data I am sending (userData) is an json object.
$http.post(url, userData)
.success(function(data, status, headers, config) {
console.log('post success');
console.log('data');
console.log(data);
console.log('status');
console.log(status);
console.log('headers');
console.log(headers);
console.log('config');
console.log(config);
}).error(function(data, status, headers, config) {
console.log('post error');
console.log('data');
console.log(data);
console.log('status');
console.log(status);
console.log('headers');
console.log(headers);
console.log('config');
console.log(config);
});
And I am getting a 404 in status.
Thank you
The "405 Method not allowed" response is because your browser is doing a "preflight" OPTIONS method request via angular $http and your server doesn't support it. There are a bunch of prerequisite responses to enable CORS. If you have access to the server, you can add support for it. One option is to use nginx as a front-end proxy with this kind of configuration:
http://enable-cors.org/server_nginx.html
Read the comments--they are really informative.
Also: see "Preflighted Requests" here: https://developer.mozilla.org/en-US/docs/HTTP/Access_control_CORS
404 means that the URL you're sending the request to does not exist.
If you're using a sub-directory like mysite.com/angular-site, and you set the URL here to a relative path like "/url/to/api" - you will get to "mysite.com/url/to/path" instead of the correct "mysite.com/angular-site/url/to/path".
So pay attention to that, it might be the problem.
Related
This may be one of these questions that doesn't need much explanation i just didn't found the answer elsewhere.
I'm pretty new to AngularJS and NodeJS. I did some tutorials and now i try to put something together.
In nodeJS when i do something like this:
app.get('/db-get-extra-bookings', function(req, res) {
res.json({name: "hello"});
});
than in AngularJS i can GET that response and do something with that even if /db-insert-extra-bookings is not an fysical page
return $http
.get(formURL)
.then(function(response){
// some code
});
But when i want to post something from out of AngularJS to my NodeJs environment
return $http
.post(formJson, JSON.stringify(bookings))
.then(function(response){
//some code
});
NodeJS:
app.get('/db-insert-extra-bookings', function(req, res) {
// do something with the request
});
I got a 404 error in my webbrowser console.
base.js:5 POST http://localhost:3000/db-insert-extra-bookings 404 (Not Found)
It sounds like normal behaviour, but why am i getting a 404 error when i POST to a non existing page, and why am i getting the data like i want when i GET from a non existing page?
Do i really need to make an empty page to post to?
I'm not a expert in NodeJS, but if you want to create a route that answer any HTTP method you should use app.all() instead of app.get(). In your code you are just creating a route for GET requests, that is why it works for a GET and don't work for a POST. Check out this reference
Just to clarify, NodeJS endpoints (GET included) do not need to serve an HTML page to work. You can send any type of HTTP response, e.g. plain text, JSON, HTML, etc - with the appropriate 'Content-Type' header.
In NodeJS routes:
app.post('/db-get-extra-bookings', function(req, res) {
res.json({name: "hello"});
});
Now in your angular code (You don't need to JSON.stringify):
// Change localhost:9000 with your hostname
$http.post('http://localhost:9000/db-get-extra-bookings', bookings)
.success(function (data, status, headers, config) {
// console.log(data);
})
.error(function (data, status, headers, config) {
// console.log(status);
});
Also, remember to restart your NodeJS server for the changes to take effect.
I've been working with angular and I have an error when I do a ajax request post with angularjs I don`t know what is the error just I can see a message, I would like to know what kind error is it more details.
.error(function(data, status, headers, config) {
console.log(data);
console.log("error");
});
Any reason this doesn't work?
$http.get('http://localhost:8383/api/login.php').respond(function (method, url, data, headers) {
return authorized ? [200, customers] : [401];
});
I know another way to do it, but would like to know why this doesn't work, as it seems to match the syntax in the docs.
safari: 'undefined is not a function'
chrome: 'err_empty_response'
Sincere thanks for the help... it is greatly appreciated!
There is no method respond as far as i know :-)
Either use suceess with error or use then
$http.get('http://localhost:8383/api/login.php').
success(function(data, status, headers, config) {
// this callback will be called asynchronously
// when the response is available
}).
error(function(data, status, headers, config) {
// called asynchronously if an error occurs
// or server returns response with an error status.
});
$http.get('http://localhost:8383/api/login.php')
.then(function(result) {
//USe result here
});
Doc
I am trying to access the dreamfactory data through $http request. To handle cross domain request, i have just added the JSON callback with the url.
.factory('DonorService', ['$resource','$http', '$q',
function($resource,$http,$q){
return{
getDonors:function(){
var donor = "https://dsp-sixerofsixes.cloud.dreamfactory.com/rest/db/icbd_donors/?callback=JSON_CALLBACK&app_name=blooddonate&fields=*";
var deferred = $q.defer();
$http.jsonp(donor).
success(function(data, status, headers, config) {
console.log(data);
deferred.resolve(data);
}).
error(function(data, status, headers, config) {
console.log(data);
});
return deferred.promise;
}
}
}])
But on making the request it creates a internal server error in the df. while typing the url in the browser shows the data along with wrapping callback.
Link to the JSON data
Link which is actually called from JSONP
I can't comment yet, so I guess I'll have to write this here.
Remove the resource injection. Just use $http.
ngResource incrementally creates those angular callback names.
I need to get JSON data from a server with URL :
http://xxxx.xxxx.xxxx.xxxx:8084/inpulse/api/user/listall
Here's my angular code:
var app = angular.module('app',[]);
app.controller('Controller', function ($scope,$http) {
$scope.email="";
$scope.password="";
$scope.sample="";
$http({
method: 'GET',
url: 'http://xxxx.xxxx.xxxx.xxxx/inpulse/api/user/listall',
})
.success(function (data, status, headers, config) {
var ret = data;
$scope.sample = JSON.stringify(ret);
})
.error(function (data, status, headers, config) {
alert(status);
// something went wrong :(
});
});
Now the same code worked when i used a JSON test URL like http://ip.jsontest.com/.
Its Definitely not a problem with the server because I tested it with a REST client and got a response. I can't figure out what I'm doing wrong.
It might be a CORS configuration issue.
If you are trying to access the server from a page that is not in the same domain/origin, you'll get an error because the server is not configured to allow CORS.
The error reported by Chrome looks like this:
XMLHttpRequest cannot load http://xxxx.xxxx.xxxx.xxxx/inpulse/api/user/listall. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://fiddle.jshell.net' is therefore not allowed access.
Other than that the code seems to work just as expected.