Detailed explanation of Json and Jsonp theoretical example code_Basic knowledge

What is Json?
JSON (JavaScript Object Notation) is a lightweight data exchange format. It is based on a subset of JavaScript (Standard ECMA-262 3rd Edition - December 1999). JSON adopts
a completely language-independent text format, but also uses conventions similar to the C language family (including C, C, C#, Java, JavaScript, Perl, Python, etc.). These properties make JSON an ideal data exchange language. Easy for humans to read and write, and easy for machines to parse and generate.
JSON has two structures:
Json is simply an object and an array in JavaScript, so these two structures are objects and arrays. Various complex structures can be expressed through these two structures
1. Object: The object is represented in js as the content expanded by "{}", and the data structure is the key-value pair structure of {key: value, key: value,...}. In object-oriented language, Key is the attribute of the object, and value is the corresponding attribute value, so it is easy to understand. The value method is object.key to obtain the attribute value. The type of this attribute value can be numbers, strings, arrays, and objects.
2. Array: Array in js is the content expanded by square brackets "[]". The data structure is ["java", "javascript", "vb",...], and the value method is the same as in all languages. Same as in, using index to obtain, the type of field value can be number, string, array, object.
Complex data structures can be combined through the two structures of objects and arrays.
The format or rules of JSON:
JSON can describe the data structure in a very simple way. It can do everything XML can do, so the two are completely equal in terms of cross-platform.
1. JSON has only two data type descriptors, curly brackets {} and square brackets []. The remaining English colons are mapping characters, English commas are delimiters, and English double quotes "" are defining characters.
2. Curly brackets {} are used to describe a set of "different types of unordered key-value pair sets" (each key-value pair can be understood as an OOP attribute description), and square brackets [] are used to describe a set of " "Ordered data collection of the same type" (which can correspond to OOP arrays).
3. If there are multiple sub-items in the above two sets, they should be separated by commas.
4. The key-value pairs are separated by English colon:, and it is recommended that the key names be added with English double quotes "" to facilitate the analysis of different languages.
5. Commonly used data types within JSON are nothing more than strings, numbers, Boolean, dates, and null. Strings must be enclosed in double quotes, and the rest are not used. The date type is quite special, so I won’t go into detail here. Yes, I just suggest that if the client does not have the function of sorting by date, then just pass the date and time directly as a string, which can save a lot of trouble.

JSON example

Copy code The code is as follows:

//Describe a person
var Person = {
"Name": "aehyok",
"Age": 25,
"Company": "aehyok",
"Engineer": true
}
//Get this person's information
var PersonAge = Person.Age;
alert(PersonAge);
//Describe several people
var members = [
{
"Name": "aehyok",
"Age": 25,
"Company": "aehyok",
"Engineer": true
},
{
"Name": "lqm",
"Age": 25,
"Company": "Oracle",
"Engineer": false
},
                                                                                                                   }
]
// Read the company name of lqm
var lqmCompany = members[1].Company;
alert(lqmCompany);
// Describe a conference
var conference = {
"Conference": "Future Marketing",
"Date": "2013-5-22",
"Address": "ShenZhen",
"Members":
[
 "Engineer": true
        },
                               
"Name": "lqm",
"Age": 25,
"Company": "Oracle",
"Engineer": false
       },
                                                                                           > "Name": "Thl",
"Age": 20,
"Company": "Microsoft",
"Engineer": false
                                                                                                           🎜>                                                                                                                                                                                       out out of which the participant Thl is an engineer?
What is Jsonp
1. A well-known problem, Ajax direct request for ordinary files has the problem of cross-domain unauthorized access, regardless of whether you are a static page, dynamic web page, web service, or WCF , as long as it is a cross-domain request, it is not allowed;
2. However, we also found that when calling js files on the Web page, it is not affected by whether it is cross-domain (not only that, we also found that any file with the "src" attribute All tags have cross-domain capabilities, such as <script>, <img>, <iframe>); , Websocket and other methods that belong to the future of HTML5 are not included) There is only one possibility to access data across domains, and that is to try to load the data into a js format file on the remote server for client calling and further processing; <br> 4. We happen to already know that there is a pure character data format called JSON that can describe complex data concisely. What’s even better is that JSON is also natively supported by js, so the client can process data in this format almost as desired; <br>5. In this way, the solution is ready. The web client calls the dynamically generated js format file (usually with JSON as the suffix) on the cross-domain server in exactly the same way as the calling script. It is obvious that the reason why the server needs to be dynamically generated The purpose of the JSON file is to load the data required by the client. <br>6. After the client successfully calls the JSON file, it will obtain the data it needs. The rest is to process and display according to its own needs. This method of obtaining remote data looks very much like AJAX , but it’s actually not the same. <br>7. In order to facilitate the client to use data, an informal transmission protocol has gradually formed. People call it JSONP. One of the key points of this protocol is to allow users to pass a callback parameter to the server, and then the server returns the data. This callback parameter will be used as a function name to wrap the JSON data, so that the client can customize its own function to automatically process the returned data. <br>If you are still a little vague about how to use the callback parameter, we will explain it with specific examples later. <br><br>Jsonp client specific implementation<strong>:</strong>1. Let’s start with the simplest one. First, I created two websites in IIS. Of course, one port is 888 and the other is 8888. We use 888 as the local server and 8888 as the remote server. <br>There is now such a web page locally<br><br><div class="codetitle"><span><a style="CURSOR: pointer" data="9777" class="copybut" id="copybut9777" onclick="doCopy('code9777')">Copy the code<u></u></a> The code is as follows:</span></div> <div class="codebody" id="code9777"><html&gt ;<BR>                                                                          ></script>





The JavaScript file refers to 8888's remote.js file.

Copy code The code is as follows:alert('I am a remote file');

After running the local server website, the effect is

Now the simplest cross-domain is successful.
2. Let’s modify it on the basis of 1. First look at the code

Copy the code The code is as follows:

 

  
   






First add a js function to the local file, and then call the js file of the remote server.

Copy code The code is as follows:

aehyok({"result":"I am a remote js The data brought"});

This is the code in the js file of the remote server.
After-run effect

The call was successful. It shows that the local function was successfully called by the cross-domain remote js, and the data brought by the remote js was also received. I am very happy that the purpose of cross-domain remote data acquisition has been basically achieved, but another question arises. How do I let the remote js know the name of the local function it should call? After all, jsonp servers have to face many service objects, and the local functions of these service objects are different? Let's look down.

Copy code The code is as follows:

I am in asp. net mvc3.0 project, so the background is in the controller

Copy code

The code is as follows: Public String Aehyok () {

Return "aehyok ({" result ":" I am the data brought by remote js "})"); The execution result is

Through debugging, you can find the URL http://localhost:6247/Home/aehyok?callback=aehyok&_=1369235398641
callback=aehyok is the callback function. After calling the background, it returns first Execute aehyok(data).
Then execute success(json) again. So there are two pop-ups.
I am just working on one project now, but the principle is still the same.