Questions tagged [angular-http]

AngularJS tag for $http service is a core Angular service that facilitates communication with the remote HTTP servers via the browser's XMLHttpRequest object or via JSONP.

The $http service is a core Angular service that facilitates communication with the remote HTTP servers via the browser's XMLHttpRequest object or via JSONP.

For unit testing applications that use $http service, see $httpBackend mock.

For a higher level of abstraction, please check out the $resource service.

The $http API is based on the deferred/promise APIs exposed by the $q service. While for simple usage patterns this doesn't matter much, for advanced usage it is important to familiarize yourself with these APIs and the guarantees they provide.

General usage

The $http service is a function which takes a single argument — a configuration object — that is used to generate an HTTP request and returns a promise with two $http specific methods: .then and .catch.

// Simple GET request example :
$http.get('/someUrl')
  .then(function(response) {
    var data = response.data;
    // this callback will be called asynchronously
    // when the response is available
}).catch(function(response) {
    // called asynchronously if an error occurs
    // or server returns response with an error status.
});
// Simple POST request example (passing data) :
$http.post('/someUrl', {msg:'hello word!'})
  .then(function(response) {
    // this callback will be called asynchronously
    // when the response is available
}).catch(function(response) {
    // called asynchronously if an error occurs
    // or server returns response with an error status.
});

Since the returned value of calling the $http function is a promise, you can also use the then method to register callbacks, and these callbacks will receive a single argument – an object representing the response. See the API signature and type info below for more details.

A response status code between 200 and 299 is considered a success status and will result in the success callback being called. Note that if the response is a redirect, XMLHttpRequest will transparently follow it, meaning that the error callback will not be called for such responses.

970 questions
536
votes
21 answers

How can I post data as form data instead of a request payload?

In the code below, the AngularJS $http method calls the URL, and submits the xsrf object as a "Request Payload" (as described in the Chrome debugger network tab). The jQuery $.ajax method does the same call, but submits xsrf as "Form Data". How can…
mjibson
  • 16,852
  • 8
  • 31
  • 42
343
votes
37 answers

AngularJs $http.post() does not send data

Could anyone tell me why the following statement does not send the post data to the designated url? The url is called but on the server when I print $_POST - I get an empty array. If I print message in the console before adding it to the data - it…
Spencer Mark
  • 5,263
  • 9
  • 29
  • 58
233
votes
12 answers

Processing $http response in service

I recently posted a detailed description of the issue I am facing here at SO. As I couldn't send an actual $http request, I used timeout to simulate asynchronous behavior. Data binding from my model to view is working correct, with the help of…
bsr
  • 57,282
  • 86
  • 216
  • 316
202
votes
3 answers

AngularJs ReferenceError: $http is not defined

I have the following Angular function: $scope.updateStatus = function(user) { $http({ url: user.update_path, method: "POST", data: {user_id: user.id, draft: true} }); }; But whenever this function is called, I…
Chubby Boy
  • 30,942
  • 19
  • 47
  • 47
196
votes
8 answers

How to cancel an $http request in AngularJS?

Given a Ajax request in AngularJS $http.get("/backend/").success(callback); what is the most effective way to cancel that request if another request is launched (same backend, different parameters for instance).
mpm
  • 20,148
  • 7
  • 50
  • 55
122
votes
4 answers

from jquery $.ajax to angular $http

I have this piece of jQuery code that works fine cross origin: jQuery.ajax({ url: "http://example.appspot.com/rest/app", type: "POST", data: JSON.stringify({"foo":"bar"}), dataType: "json", contentType: "application/json;…
Endless
  • 34,080
  • 13
  • 108
  • 131
111
votes
16 answers

Angular 4.3 - HttpClient set params

let httpParams = new HttpParams().set('aaa', '111'); httpParams.set('bbb', '222'); Why this doesn't work? It only set the 'aaa' and NOT the 'bbb' Also, I have an object { aaa: 111, bbb: 222 } How can I set all the values without looping? UPDATE…
Michalis
  • 6,686
  • 13
  • 52
  • 78
93
votes
2 answers

$http get parameters does not work

Does anyone know why this does not work? $http .get('accept.php', { source: link, category_id: category }) .success(function (data, status) { $scope.info_show = data }); and this does work: $http …
kahonmlg
  • 3,839
  • 3
  • 17
  • 21
67
votes
6 answers

Error handling in AngularJS http get then construct

How can I handle an HTTP error, e.g. 500, when using the AngularJS "http get then" construct (promises)? $http.get(url).then( function(response) { console.log('get',response) } ) Problem is, for any non 200 HTTP response, the inner…
Federico Elles
  • 4,659
  • 7
  • 27
  • 35
61
votes
5 answers

Angularjs autocomplete from $http

I'm trying to write an autocomplete directive that fetches data from the server using an $http request (without using any external plugins or scripts). Currently it works only with static data. Now, I know that I need to insert my $http request into…
Gidon
  • 3,490
  • 7
  • 23
  • 31
60
votes
4 answers

Angular 2 http get not getting

I new to Angular 2 still learning I am trying to hit a URL with a get call but the get doesn't seem to go through even in browser's network I cannot find that get URL being called. The program is going to that method console logging above and below…
user7161814
54
votes
3 answers

How to read JSON error response from $http if responseType is arraybuffer

I load some binary data using $http.post(url, data, { responseType: "arraybuffer" }).success( function (data) { /* */ }); In case of an error, the server responds with an error JSON object like { "message" : "something went wrong!"…
hansmaad
  • 18,417
  • 9
  • 53
  • 94
51
votes
7 answers

Send array via GET request with AngularJS' $http service

I need to send a GET request using the $http service. One of the parameters will be an array of ids. The url looks like this one mysite.com/items?id[]=1&id[]=2&id[]=3&id[]=4 I tried this approach $http( method: 'GET', url: '/items', params: { …
Gio Polvara
  • 23,416
  • 10
  • 66
  • 62
37
votes
6 answers

HTTP Post with no body in Angular

I'm wondering how to send an HTTP post request without a body (specifically in Angular). Here's what I'm doing now, but I'm getting the error Expected 2-3 arguments, but got 1). I realize the second argument is for the body, but I'm not sending…
Kyle Krzeski
  • 6,183
  • 6
  • 41
  • 52
37
votes
3 answers

How to handle unauthorized requests(status with 401 or 403) with new httpClient in angular 4.3

I have an auth-interceptor.service.ts to handle the requests import {Injectable} from '@angular/core'; import {HttpErrorResponse, HttpEvent, HttpHandler, HttpInterceptor, HttpRequest} from '@angular/common/http'; import {Observable} from…
1
2 3
64 65