I use Angular $http GET request that respond with 401 status, as i verified with Chrome network tab.
Inside the errorCallback for this request the response.status is always -1. When i started to investigate it i found the source of -1 deeply inside angular file:
var requestError = function() {
// The response is always empty
// See https://xhr.spec.whatwg.org/#request-error-steps and https://fetch.spec.whatwg.org/#concept-network-error
completeRequest(callback, -1, null, null, '');
};
So, how i can retrieve the status code?
Call it like this:
$http.get('/Url').
success(function(data, status, headers, config) {
}).
error(function(data, status, headers, config) {
});
Finally i found the reason is CROS error. when i changed API endpoint to responde with header: Access-Control-Allow-Origin:* the problem solved and i can see the status code.
Related
I am a newbie angular js developer. Recently i am trying to build an application that uses Yahoo Query Language (YQL). I actually need the cricket.teams data from the data table. So, i am just making a $http resquest from the controller of the angularjs with the REST Query provides by Yahoo.
Here i my view:
<div ng-controller="ProfileCtrl">
<div style="height:80vh">
{{Hello}}
</div>
</div>
Here is my controller
app.controller('ProfileCtrl',function($scope,$http){
$scope.Hello='Welcome';
var url ='https://query.yahooapis.com/v1/public/yql?q=select%20*%20from%20cricket.teams&format=json&diagnostics=true&env=store%3A%2F%2F0TxIGQMQbObzvU4Apia0V0&callback=';
// Simple GET request example :
$http.get(url).
success(function(data, status, headers, config) {
alert(data);
}).
error(function(data, status, headers, config) {
// called asynchronously if an error occurs
// or server returns response with an error status.
alert('error'+status);
});
});
It is returning Error with the status 0. that means there is somehow an error. what i am doing wrong here ??
NB. i have tried with $http.jsonp() . and its giving the same result.
If you are getting status 0 then it might be due to illegal cross-origin request https://stackoverflow.com/a/10910212/1061668
Despite that your code is fully functional, see related plunker here http://plnkr.co/edit/xFAnI7
Following api call
$http.get(url).then(function(response) {
$scope.response = angular.toJson(response.data);
}).catch(function(response) {
$scope.response = response;
});
Will return something like
{"query":{"count":14,"created":"2015-05-05T10:38:27Z","lang":"fi-FI","diagnostics":{"cache":{"execution-start-time":"0","execution-stop-time":"3","execution-time":"3","method":"GET","type":"MEMCACHED","content":"TABLE.yql-query-yahooapis-com.v1.production.manhattan.bf1.yahoo.com.cricket.teams.cb28f8540307fdb68289fa5fedc2b832"},"url":[{"execution-start-time":"4","execution-stop-time":"9","execution-time":"5", ... etc etc
I am getting 304 status code through a angular JS webApi get request only using IE11. When I press Ctrl+F5, it corrects and get 200 status code (which is correct behavior). It works fine using Chrome. I am using following code.
factory('StudentService', function ($q, $http, pathProvider, searchParams, student) {
return {
getStudents: function (successcb) {
var deferred = $q.defer();
var url = pathProvider.getPath("Student/GetStudents");
$http({
method: 'GET'
, url: url
, cache:false
}).
success(function (data, status, headers, config) {
deferred.resolve(data);
}).
error(function (data, status, headers, config) {
deferred.reject(status);
alert('getStudents ' + status + ': ' + data);
});
return deferred.promise;
}
}
It appears IE has some problem.
Thanks
IE probably adds a If-Modified-Since or If-None-Match request header to the request. If you press CTRL+F5, you force a browser refresh, which means that IE does not add these headers.
It seems that IE does not interpret the angular option cache:false very well. I don't know whether this is an IE or an angular issue, but you can resolve it in javascript by making sure the request is unique. For instance, by adding a dummy parameter to the query string:
$http({
method: 'GET'
, url: url
, cache:false
, params: { 'foobar': new Date().getTime() }
})
You can also fix this on the server by disallowing any browser caching. How you do that depends on the server technology you use.
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 have code in a directive that is making a cross domain request. When it runs in Chrome, it works just fine. When it runs in Firefox or IE 11, I get a status code of 0 with no data. My code is:
$http({method: 'GET', url: 'https://mycrossdomain.url'})
.success(function(data, status, headers, config) {
alert('success');
})
.error(function(data, status, headers, config) {
alert('error');
})
In Firefox and IE I get "error" alerted and in Chrome I get "success" and I can view the data.
Why would this be happening? The server obviously supports cross domain requests because it works in Chrome. When I navigate to the URL in all browsers I get a response so it definitely exists. Any help would be appreciated.
Turns out the issue was that I needed to specify withCredentials like so:
$http.get('https://mycrossdomain.url', { withCredentials: true})
.success(function(data, status, headers, config) {
alert('success');
})
.error(function(data, status, headers, config) {
alert('error');
})
This is because I needed to pass the user credentials (a certificate) to the other domain. Angular was unfortunately not providing very useful error messages.
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.