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
10
votes
2 answers

AngularJS - Cannot read response headers from $http

My http response contains the headers Authentication (as mentioned here: Authentication:76efbc0946773b62c93e952b502a47acd898200f6f80dc46ac87ffc501c00780) when I inspect the request with the inspector, but a call to headers("Authentication") returns…
GeoffreyB
  • 1,791
  • 4
  • 20
  • 36
10
votes
1 answer

binding data from $http.get() request into ng-repeat

I'm getting fine my JSON data from a server, but the problem comes when trying to list it at my page using the ng-repeat directive. Here's my HTML body content, where 'mydata' (JSON array) is shown correctly as soon as the $http.get() method…
charliebrownie
  • 5,777
  • 10
  • 35
  • 55
9
votes
3 answers

Angular 6 Redirect to external url using POST

I am trying to incorporate payment gateway into angular app, I found following JavaScript snippet provided by the payment partner for incorporation, I tweaked it by adding ngNoForm and got it working with angular; stackBlitz
Saif
  • 1,745
  • 5
  • 23
  • 46
9
votes
3 answers

Angular client of Spring Boot 2 Reactor Flux API

How do I create an Angular 4 client for a Java Project Reactor reactive Flux API? The sample below has two APIs: a Mono API; and, Flux API. Both work from curl; but in Angular 4 (4.1.2) only the Mono API works; any ideas how to get Angular 4 to work…
Jan Nielsen
  • 10,892
  • 14
  • 65
  • 119
9
votes
1 answer

Send $http.get twice

Edit 1: Guys, I notice that I call $http.get('/posts') (for some special purpose) in my authentication factory. Sorry for the stupid question. I will delete it when the bounty is end. I have the following code to load a page…
SoftTimur
  • 5,630
  • 38
  • 140
  • 292
9
votes
4 answers

progress bar on web request ($http) AngularJS

I'm new in AngularJS. I'm trying to make a request to a web service. I would like to implement a progress bar that tells me what percentage this request. Maybe someone has a basic example of which can guide me. Greatly appreciate it if anyone can…
yavg
  • 2,761
  • 7
  • 45
  • 115
9
votes
1 answer

AngularJS: Performing $http request inside custom service and returning data

I have defined a custom http service in angular that looks like this: angular.module('myApp') .factory('myhttpserv', function ($http) { var url = "http://my.ip.address/" var http = { async: function (webService) { var promise…
aadu
  • 3,196
  • 9
  • 39
  • 62
8
votes
1 answer

Angular sending token with get (and other) requests

For some reason, the internet is devoid of examples on how to do this in Angular 4 (which uses TypeScript, which doesn't let you skip including option properties like the JavaScript it transpiles into does). I'm trying to hit my team's RESTful API,…
Mike Warren
  • 3,796
  • 5
  • 47
  • 99
8
votes
1 answer

Testing Http Service making multiple calls and returning observable without mapping the responses

I have a data service which fetches the data from server and makes multiple requests which then return an array of observables. I want to test the data. What i tried doing is in the mockrespone I sent array which contains two observables i dont know…
SONGSTER
  • 585
  • 3
  • 11
  • 28
8
votes
3 answers

Angular 4.3 Interceptors - How to use?

I am in the process of building a new app that requires authorization headers. Typically I use something very similar to the approach found in this scotch.io article. But it has come to my attention that HTTP Interceptors are now fully supported…
joshrathke
  • 7,564
  • 7
  • 23
  • 38
8
votes
2 answers

I want to convert a angular2 observable to a class

I am new in angular2 and I broke spend a lot of time to find a solution, but I didn't. I want to convert a oberservable from a http call store in a class. I have the following: json file [{ "nickname": "magicMike", "id": "123", "name":…
M. Fish
  • 266
  • 3
  • 4
  • 17
8
votes
5 answers

All data is gone on page reload. Is there any way to avoid that?

I have developed one dashboard application in angular js which is having search functionality and multiple views with lots of different data coming from that search functionality. Its single page application. So I am facing issue on page reload all…
priya_singh
  • 2,478
  • 1
  • 14
  • 32
8
votes
1 answer

Angular: Returning a $q.defer().promise instead of an $http promise

Watching a lot of Egghead.io videos, I noticed that a common pattern is to return a custom promise and resolve it in the callbacks. .factory('myFact', function($q, $http) { return { getData: function() { var deferred =…
diplosaurus
  • 2,538
  • 5
  • 25
  • 53
8
votes
1 answer

Can't specify headers in request in AngularJS

I have 2 parts in my app - Angular frontend and rails server. And because it's different domains, requests doesn't work by default. There are a lot of staff about that, including stack, but it doesn't works for me. This is my method in angular…
zishe
  • 10,665
  • 12
  • 64
  • 103
8
votes
3 answers

Use withCredential with $resource

I want to use resource with a cookie set in the navigator. With $http it is really easy, as I only need to set withCredential to true: $http({ method: 'POST', url: url, data: user, withCredentials: true }); But for $resource, I…
Alex Grs
  • 3,231
  • 5
  • 39
  • 58