Angularjs through $http and server communication _angularjs

Source: Internet
Author: User

$http

ANGULARJS provides $http services to communicate with the server, and the XMLHttpRequest objects in the service team browser are encapsulated so that we can request data from the servers in an AJAX way.

When interacting with a remote HTTP server in Angularjs, a very critical service-$http is used.

1, $http is a core service in angular, using the browser's XMLHttpRequest or via Jsonp object to interact with the remote HTTP server.

2, the use of $http and jquery provides the same $.AJAX operations, are supported by a variety of method requests, get, post, put, delete and so on.

3, $http of various ways of the request is more close to the rest style.

4, in the controller in the same way as $scope to get $http objects,e.g. function controller($scope,$http){}

The following is a description of the use of the $http service, which is called as follows:

$http (config). Success (function (Data,status,headers,config) {}). Error (function (data,status,headers,config) {});

The $http service is a function that takes a parameter, the type of which is an object, used to configure the generated HTTP request, which returns a Promise object

var promise = $http ({method
 : ' Get ',
 URL: '/api/user.json '
});

Promise.then (function (resp) {}, function (RESP) {})

$http the requested Configuration object

The configuration object accepted by $http () can contain the following properties:

Method:http request method, can be get,delete,head,jsonp,post,put

URL: string, requested target

Params: String or object, will be converted to query string appended URL after

Data: used when sending a POST request, sent as a message body to the server

Headers: A list, each element is a function, returns the HTTP header

Xsrfheadername (String): The name of the HTTP header that holds the XSFR token

Xsrfcookiename: Save the cookie name of the XSFR token

Transformrequest: A function or array of functions used to convert the request body and header information of an HTTP request and return the converted result.

Transformresponse: A function or array of functions used to convert the response body and header information of an HTTP response and return the converted result.

Cache: Boolean type or Cached object, angular cache get request after setting.

Timeout: value, delay request

Responsetype: String, response type. Can be Arraybuffer, Blob,document,json, text, Moz-blob, Moz-chunked-text, moz-chunked-

Arraybuffer

$http the requested Response object

The response object that angular passes to the then method includes the following several properties

Data: Response body after conversion

Status:http Response Status Code

Headers: Header information

Config: The settings object that generated the original request

Text for statustext:http response status

Intercepting device

In angular we can intercept requests and responses from the global level through interceptors.

Before using interceptors, we factory() declare a service and then $httpProvider register the Interceptor. The interceptor is divided into four types, two successful interceptors, and two failure interceptors.

Angular.module (' Test ', []). Factory (' Testinterceptor ', function ($q) {
 var interceptor = {
 ' request ': function ( Config) {return
 config;
 },
 ' response ': function (RESP) {return
 response;
 },
 ' Requesterror ': function (rejection) {return
 $q. Reject (rejection);
 },
 ' Responseerror ': function ( Rejection) {return
 rejection
 }
 } return
 interceptor;
})

Angular.module (' Test ', []). config (function ($httpProvider) {
 $httpProvider. Interceptors.push (' Testinterceptor ');
}

Summarize

The above is the entire content of this article, I hope to be able to learn or work to bring certain help, if there is doubt you can message exchange.

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.