Angularjs implementing cross-domain requests

cross-domain, front-end development frequently encountered problems, ANGULARJS implementation of cross-domain approach similar to Ajax, using the cors mechanism.
The following illustrates the use of $http for cross-domain request data in Angularjs.

AngularJS XMLHttpRequest: $http used to read data from a remote server

$http. Post (URL, data, [Config]). Success (function () {...}); $http. Get (URL, [config]). Success (function () {...}); $http. Get (URL, [config]). Success (function () {...});

first, $http. Jsonp "Implementing Cross-Domain"1. Specify the callback and callback function names, and when the function name is Json_callback, the success callback function is called and the Json_callback must be all uppercase.
2. Specify a different callback function, but it must be a global function defined under window. Callback must be added to the URL.
ii. $http. Get "implement cross-domain"1. Server-side settings allow access under other domain names

Response.setheader ("Access-control-allow-origin", "*"); Allow all domain names to access Response.setheader ("Access-control-allow-origin", "http://www.123.com"); Allow www.123.com access

2. Angularjs end using $http.get ()
iii. $http. Post "Implementing Cross-Domain"1. Server-side settings allow access under other domain names, and response type, response header settings

Response.setheader ("Access-control-allow-origin", "*"); Response.setheader ("Access-control-allow-methods", "POST" ); Response.setheader ("Access-control-allow-headers", "X-requested-with,content-type");

2. Angularjs End uses $http.post () to set the request header information

$http. Post (' http://localhost/ajax/getAllIndustryCategoty.pt ', {languagecolumn: ' Name_eu '},{' content-type ': ' Application/x-www-form-urlencoded '}). Success (data) {$scope. Industries = data;});

Iv. Ways of realizationcross-domain mode one "JSONP":Method One:

$http. JSONP ("http://localhost/sitesettings/getBadgeInfo.pt?jsonp=JSON_CALLBACK&siteid=137bd406"). Success ( function (data) {...}); /The name of the  callback should be the string json_callback.

Method Two "Returns a value that needs to be received using the corresponding callback method, but how to place the $scope??? 】：

$http. JSONP ("http://localhost/sitesettings/getBadgeInfo.pt?jsonp=badgeabc&siteid=137bd406"); function BADGEABC (data) {...}

Public String Execute () throws Exception {string result = Fail;response.setheader ("", ""); Sitehandleraction sitehandleraction = (sitehandleraction) Beansfactory.getbean (Sitehandleraction.class); Badgehandleraction badgehandleraction = (badgehandleraction) Beansfactory.getbean (Badgehandleraction.class), if ("". Equals (SiteID) | | SiteID = = NULL | | Stringutils.isblank ("Jsonp")) {result = FAIL;} Else{site Site = Sitehandleraction.find (SiteID); Userbadgestatus userbadgestatus = Badgehandleraction.getuserbadgestatus (Site.getid ()); if (UserBadgeStatus! = null) { result = "{\" t\ ":" +userbadgestatus.getstyle () + ", \" l\ ":" +userbadgestatus.getsuspend_location () + ", \" s\ ":" + Site.getid () + "}"; Jsonobject jsonobj = jsonobject.fromobject (result); String json = jsonobj.tostring (); result = Jsonp + "(" + JSON + ")";}} PrintWriter write = Response.getwriter (); Write.print (result); Write.flush (); Write.close (); return NONE;}

cross-domain mode two "$http. Get ()":

function Getadustrycontroller ($scope, $http) {$http. Get (' http://localhost/ajax/getAllIndustryCategoty.pt? Languagecolumn=name_eu '). Success (function (data) {$scope. Industries = data;});}

cross-domain mode three "$http. Post ()":

function Getadustrycontroller ($scope, $http) {$http. Post (' http://localhost/ajax/getAllIndustryCategoty.pt ', { Languagecolumn: ' Name_eu '},{' content-type ': ' application/x-www-form-urlencoded '}. Success (function (data) {$ scope.industries = data;});}

Java Side Support cross-domain request public String execute () {Response.setheader ("Access-control-allow-origin", "*"); Which URLs are allowed to cross-domain request to this domain Response.setheader ("access-control-allow-methods", "POST"); The allowable method of request is generally get,post,put,delete,optionsresponse.setheader ("Access-control-allow-headers", "X-requested-with", Content-type "); Which request headers are allowed to cross the domain sitehandleraction Sitehandler = (sitehandleraction) Beansfactory.getbean (Sitehandleraction.class); list<industrycategory> list = Sitehandler.getallindustrycategory (); All classification sets Jsonarray Jsonarray = Jsonarray.fromobject (list); Convert list to jsonstring JSON = jsonarray.tostring (); Convert to JSON string try {PrintWriter write = Response.getwriter (); Write.print (JSON); Write.close ();} catch (IOException e) { E.printstacktrace ();} return NONE;}

<table ng-controller= "Getadustrycontroller" ><tr ng-repeat= ' industry in industries ' ><td>{{ Industry.id}}</td><td>{{industry.name_ch}}</td><td>{{industry.name_eu}}</td>< td>{{INDUSTRY.NAME_JP}}</td></tr></table>

Angularjs implementing cross-domain requests