Using Jquery.ajax () to implement cross-domain

Cross-domain through jquery ajax, which is actually implemented using the JSONP way.

JSONP is an abbreviation for English json with padding. It allows script tags to be generated on the server side to return to the client, that is, to dynamically generate JavaScript tags and to read data in the form of JavaScript callback.

The front-end code is as follows:

  
 

   
  

  
$.ajax({
   
  

  
 type:"get",
   
  

  
 async:false,
   
  

  
 url:"http://192.168.0.168:8080/lightview/filecentral/filePageNums.do?id=443d6058-8f2b-4caa-97c8-bdb542346745",
   
  

  
 dataType:"jsonp",
   
  

  
 jsonp:"jsoncallback",
   
  

  
 jsonpCallback:"success_jsoncallback",
   
  

  
 success:function(data){
   
  

  
 document.getElementById("spanTotalPageNum").innerHTML = data.pageNums;
   
  

  
 pageNumsMax = data.pageNums;
   
  

  
 }
   
  

  
 })
  
 

The server-side code is as follows:
Started to think, as long as the client through JSONP can directly cross-domain access, in fact, need server-side support

  
 

   
  

  
 @RequestMapping(value = "filePageNums.do",produces = "text/plain;charset=UTF-8")
   
  

  
 @ResponseBody
   
  

  
    pub Lic    string   Getfilepagenums  Span class= "pun" > (  @RequestParam   (  "id"  )    string   ID    @RequestParam   (  "Jsoncallback"  )    string   Callbackname  ) {  
   
  

  
 if(id==null||id.trim().equalsIgnoreCase("")){
   
  

  
 throw new NullPointerException();
   
  

  
 }
   
  

  

   
  

  
 FileScope fileScope=service.getFileById(id);
   
  

  

   
  

  
 String result=callbackName+"("+"{\"pageNums\":\"";
   
  

  
 if(fileScope==null){
   
  

  
 result+="0";
   
  

  
 }
   
  

  
 else {
   
  

  

   
  

  
 result+=String.valueOf(ViewFileAPI.viewFilePageNums(fileScope.getFileId()));
   
  

  
 }
   
  

  

   
  

  
 result+="\"})";
   
  

  
 return result;
   
  

  
 }
  
 

First register a callback (for example: ' Jsoncallback ') on the client, and then pass callback's name (for example: Success_jsonpcallback) to the server-side corresponding handler function.

The server becomes the JSON data that needs to be returned to the client. Then, in JavaScript syntax, a function is generated, and the function name is the value of the parameter (jsoncallback) passed up (Success_jsonpcallback).

Finally, the JSON data is placed directly into the function in the form of a parameter, so that a document of JS syntax is generated and returned to the client.
The client browser, parsing the script tag, and returning the server-side data as parameters,
Passed into the client's pre-defined callback function (as in the previous example, the jquery $.ajax () method encapsulates the Success:function (JSON)).

In fact, cross-domain loading data by dynamically adding script, unable to get data directly, so we need to use callback function.

From for notes (Wiz)

Using Jquery.ajax () to implement cross-domain