json与jsonp有什么区别?json与jsonp的区别对比
json与jsonp在刚学习的时候很容易混淆,所以本篇文章就来介绍一下json和jsonp的区别,有需要的朋友可以参考一下。
话不多说,我们直接进入正题~
json和jsonp的区别:
首先我们应该知道JSON是一种数据交换格式,而JSONP是一种被开发人员创造出来的一种非官方的跨域数据交互协议。(不清楚的同学可以看一下这两篇文章:jsonp是什么?jsonp的原理详解和json是什么意思?是用来干嘛的?)
我们来看一下json和jsonp的对比
json是一种基于文本的数据交换格式,用于描述复杂的数据,比如,描述一个学生的信息可以这样子写:
var student = { "id":"001", "name":"张三", "sex":"男", "age":20 } console.log(student.id); //001 console.log(student.name); //张三
然后就可以通过student.id,student.name这种方式获取这个学生的学号和姓名。
json数据格式在前端开发这个领域用的比较多,其优点在于:
(1)基于纯文本,跨平台传递简单;
(2)JavaScript原生支持,后台语言几乎全部支持;
(3)轻量级数据格式,占用字符数量极少,特别适合互联网传递;
(4)可读性较强;
(5)容易编写和解析;
jsonp是一个跨域交互协议,可以理解为jsonp约定了json的这个数据怎样进行传递。简单的说,就是json不支持跨域,而js可以跨域,因此在服务器端用客户端提供的js函数名将json数据封装起来,再将函数提供给客户端调用,从而获得json数据。比如:
客户端代码如下:
$(function () { var user = { "username": "HelloWorld" }; $.ajax({ url: "http://localhost:8080/Changyou/UserInfo", type: "POST", contentType: "application/json; charset=utf-8", dataType: "jsonp", //json不支持跨域请求,只能使用jsonp data: { user: JSON.stringify(user) }, jsonp: "callback", //传递给请求处理程序或页面的,用以获得jsonp回调函数名的参数名,默认为callback jsonpCallback: "userHandler", //自定义的jsonp回调函数名称,默认为jQuery自动生成的随机函数名,也可以写"?",jQuery会自动为你处理数据 success: function (data) { $("#user_name")[0].innerHTML = data.user_name; $("#user_teleNum")[0].innerHTML = data.user_teleNum; $("#user_ID")[0].innerHTML = data.user_ID; }, error: function () { alert("请求超时错误!"); } }) });
服务器端代码如下:
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { response.setContentType("application/json; charset=utf-8"); String username = new String(request.getParameter("user").getBytes("ISO-8859-1"),"utf-8"); String callback = new String(request.getParameter("callback").getBytes("ISO-8859-1"),"utf-8"); System.out.println("接收到的数据:" + username); System.out.println("callback的值:" + callback); JSONObject user = JSONObject.fromObject(username); System.out.println("接收到的用户名:" + user.get("username")); JSONObject userinfo = new JSONObject(); userinfo.put("user_name", "张鸣晓"); userinfo.put("user_teleNum", "18810011111"); userinfo.put("user_ID", "123456789098765432"); PrintWriter out = response.getWriter(); String backInfo = callback + "(" + userinfo.toString() + ")"; //将json数据封装在callback函数中提供给客户端 out.print(backInfo); out.close(); }
说明:尽管客户端没有实现userHandler函数,但也能成功运行,原因就是jquery在处理jsonp类型的ajax时,自动帮你生成回调函数并把数据取出来供success属性方法来调用。
本篇文章到这里就全部结束了,更多精彩内容大家可以关注PHP中文网!!!
Atas ialah kandungan terperinci json与jsonp有什么区别?json与jsonp的区别对比. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Alat AI Hot

Undresser.AI Undress
Apl berkuasa AI untuk mencipta foto bogel yang realistik

AI Clothes Remover
Alat AI dalam talian untuk mengeluarkan pakaian daripada foto.

Undress AI Tool
Gambar buka pakaian secara percuma

Clothoff.io
Penyingkiran pakaian AI

AI Hentai Generator
Menjana ai hentai secara percuma.

Artikel Panas

Alat panas

Notepad++7.3.1
Editor kod yang mudah digunakan dan percuma

SublimeText3 versi Cina
Versi Cina, sangat mudah digunakan

Hantar Studio 13.0.1
Persekitaran pembangunan bersepadu PHP yang berkuasa

Dreamweaver CS6
Alat pembangunan web visual

SublimeText3 versi Mac
Perisian penyuntingan kod peringkat Tuhan (SublimeText3)

Topik panas



Artikel membincangkan membuat, menerbitkan, dan mengekalkan perpustakaan JavaScript, memberi tumpuan kepada perancangan, pembangunan, ujian, dokumentasi, dan strategi promosi.

Artikel ini membincangkan strategi untuk mengoptimumkan prestasi JavaScript dalam pelayar, memberi tumpuan kepada mengurangkan masa pelaksanaan dan meminimumkan kesan pada kelajuan beban halaman.

Soalan dan penyelesaian yang sering ditanya untuk percetakan tiket kertas terma depan dalam pembangunan front-end, percetakan tiket adalah keperluan umum. Walau bagaimanapun, banyak pemaju sedang melaksanakan ...

Artikel ini membincangkan debugging JavaScript yang berkesan menggunakan alat pemaju pelayar, memberi tumpuan kepada menetapkan titik putus, menggunakan konsol, dan menganalisis prestasi.

Artikel ini menerangkan cara menggunakan peta sumber untuk debug JavaScript minifikasi dengan memetakannya kembali ke kod asal. Ia membincangkan membolehkan peta sumber, menetapkan titik putus, dan menggunakan alat seperti Chrome Devtools dan Webpack.

Artikel ini meneroka penggunaan rangka koleksi Java yang berkesan. Ia menekankan memilih koleksi yang sesuai (senarai, set, peta, giliran) berdasarkan struktur data, keperluan prestasi, dan keselamatan benang. Mengoptimumkan penggunaan pengumpulan melalui cekap

Sebaik sahaja anda telah menguasai tutorial TypeScript peringkat kemasukan, anda harus dapat menulis kod anda sendiri dalam IDE yang menyokong TypeScript dan menyusunnya ke dalam JavaScript. Tutorial ini akan menyelam ke dalam pelbagai jenis data dalam TypeScript. JavaScript mempunyai tujuh jenis data: null, undefined, boolean, nombor, rentetan, simbol (diperkenalkan oleh ES6) dan objek. Typescript mentakrifkan lebih banyak jenis atas dasar ini, dan tutorial ini akan meliputi semuanya secara terperinci. Jenis data null Seperti JavaScript, Null dalam TypeScript

Tutorial ini akan menerangkan cara membuat carta pai, cincin, dan gelembung menggunakan carta.js. Sebelum ini, kami telah mempelajari empat jenis carta carta.js: carta baris dan carta bar (tutorial 2), serta carta radar dan carta rantau polar (Tutorial 3). Buat carta pai dan cincin Carta pai dan carta cincin sangat sesuai untuk menunjukkan perkadaran keseluruhan yang dibahagikan kepada bahagian yang berlainan. Sebagai contoh, carta pai boleh digunakan untuk menunjukkan peratusan singa lelaki, singa wanita dan singa muda dalam safari, atau peratusan undi yang diterima oleh calon yang berbeza dalam pilihan raya. Carta pai hanya sesuai untuk membandingkan parameter tunggal atau dataset. Harus diingat bahawa carta pai tidak dapat menarik entiti dengan nilai sifar kerana sudut kipas dalam carta pai bergantung pada saiz berangka titik data. Ini bermaksud mana -mana entiti dengan perkadaran sifar
