一、JSON和JSONP

JSONP的全称是JSON with Padding,由于同源策略的限制,XmlHttpRequest只允许请求当前源(协议,域名,端口)的资源。如果要进行跨域请求,我们可以通过使用html的script标记来进行跨域请求,并在相应中返回要执行的script代码,其中可以直接使用JSON传递javascript对象。这种跨域的通讯方式成为JSONP。

由此我们可以看出两者的区别:

json: 一种轻量级的数据格式。

jsonp:为实现跨域,而采用的一种脚本注入方法。

备注:要了解更多json,可以参见我原先写的一篇介绍json的文章:《JSON那些事》

二、实现

为了简单起见,我们要读取数据都是

jQuery111300015746519762624978_1477902649311

({"first_name":"888","last_name":"888"})

1. 服务器端代码:

var express = require('express');

var app = express();

app.use(express.static('public'));

app.get('/index.html', function (req, res) {

res.sendFile( __dirname + "/" + "index.html" );

})

app.get('/process_get', function (req, res) {

// 输出 JSON 格式

response =({

first_name:req.query.first_name,

last_name:req.query.last_name

});

res.end(req.query.callback+'('+JSON.stringify(response)+')');//jsonp格式

// res.end("("+JSON.stringify(response)+")");

})

var server = app.listen(8081, function () {

var host = server.address().address

var port = server.address().port

console.log("应用实例,访问地址为 http://%s:%s", host, port)

})


2. 游览器端代码,为方便起见,我直接用了jquery的方法

$.ajax({​

url: "http://127.0.0.1:8081/process_get?first_name=888&last_name=888",

dataType: "jsonp",

success: function (data) {

console.log(44444);

console.log(data);

},

error: function(XMLHttpRequest, textStatus, error) {

console.log(XMLHttpRequest.status);

console.log(XMLHttpRequest.readyState);

console.log(textStatus);

console.log(error);

},

})

用nodejs实现json和jsonp服务的更多相关文章

  1. [转]说说JSON和JSONP,也许你会豁然开朗,含jQuery用例

    本文转自:http://www.cnblogs.com/dowinning/archive/2012/04/19/json-jsonp-jquery.html 前言: 说到AJAX就会不可避免的面临两 ...

  2. JSON和JSONP (含jQuery实例)(share)

    来源:http://www.cnblogs.com/dowinning/archive/2012/04/19/json-jsonp-jquery.html 前言: 说到AJAX就会不可避免的面临两个问 ...

  3. 【转载】说说JSON和JSONP,也许你会豁然开朗,含jQuery用例

    前言: 说到AJAX就会不可避免的面临两个问题,第一个是AJAX以何种格式来交换数据?第二个是跨域的需求如何解决?这两个问题目前都有不同的解决方案,比如数据可以用自定义字符串或者用XML来描述,跨域可 ...

  4. json和jsonp(json是目的,jsonp是手段)

    自己理解:JSON是一种数据交换格式,而JSONP是一种依靠开发人员的聪明才智创造出的一种非官方跨域数据交互协议.我们拿最近比较火的谍战片来打个比方,JSON是地下党们用来书写和交换情报的" ...

  5. json 与jsonp 特点及区别

    简单描述JSON跟JSONP的区别以及实战 什么是JSON? 前面简单说了一下,JSON是一种基于文本的数据交换方式,或者叫做数据描述格式,你是否该选用他首先肯定要关注它所拥有的优点. JSON的优点 ...

  6. 说说JSON和JSONP,也许你会豁然开朗(转)

    前言 由于Sencha Touch 2这种开发模式的特性,基本决定了它原生的数据交互行为几乎只能通过AJAX来实现. 当然了,通过调用强大的PhoneGap插件然后打包,你可以实现100%的Socke ...

  7. JSON和JSONP的区别

    先前的概念中对JSON还是比较熟悉,对JSONP不是特别的清楚,整理完相关知识发现才豁然开朗.简单的说JSON是一种数据交换格式,而JSONP是 一种非官方跨域数据交互协议.JSON是“暗号”,而JS ...

  8. json与jsonp的区别

    前言 由于Sencha Touch 2这种开发模式的特性,基本决定了它原生的数据交互行为几乎只能通过AJAX来实现. 当然了,通过调用强大的PhoneGap插件然后打包,你可以实现100%的Socke ...

  9. 说说JSON和JSONP,也许你会豁然开朗

    前言 由于Sencha Touch 2这种开发模式的特性,基本决定了它原生的数据交互行为几乎只能通过AJAX来实现. 当然了,通过调用强大的PhoneGap插件然后打包,你可以实现100%的Socke ...

随机推荐

  1. plsql dev

    访问v$session,v$sesstat and v$statname视图的权限 grant create session,resource to chf; grantselectonv_$sess ...

  2. AE调用GP工具的方法(转)

    第一,首先要明确自己需要调用arctoolbox里面的什么工具,实现什么样的功能. 第二,按照需求看看在arctoolbox工具中是怎么实现功能的,然后确定需要的数据源. 第三,编写command或t ...

  3. 【译】Learn ES2015——箭头函数

    原文:https://babeljs.io/learn-es2015/ 理解也许有偏差,欢迎指正 箭头函数 不同于函数,箭头函数和包裹它的代码拥有同一个this.如果一个箭头函数在一个function ...

  4. Latex 建立带有竖线和编号的算法环境

    Latex 建立带有竖线和编号的算法环境 Latex源码: \documentclass{article} \usepackage{amssymb} \usepackage{amsmath} \use ...

  5. Eclipse 创建maven项目

    新建maven project

  6. GitHub的使用之新建与更新代码

    一.新建仓储:注册GitHub后你就会有0.3G的免费空间,不过只能创建公开项目,这也满足代码分享的目的,我最喜欢的倒是它的代码展示方式,可以直接浏览你的代码,代码是经过高亮.添加行号处理过的,十分漂 ...

  7. .Net Core 跨平台系列之环境部署

    前言 作为一名.NET程序员,很多时候都会被什么拖控件.跨平台等字眼所鄙视过,但是在我的的内心还是没有把自己看低过.因为说到底,平台和语言只是我们吃饭的工具.很多时候公司的发展是取决于商业竞争的,微软 ...

  8. linux 网卡问题 Device eth0 does not seem to be present,delaying initialization.

    Device eth0 does not seem to be present,delaying initialization. 网上搜索后才发现原因所在:原来vmware在复制了虚拟机后会自动生成一 ...

  9. css个人随笔,适合新手总结整理

    CSS的3种引用方式:1.外部样式表 都是在head标签内使用Link标签来引用的.2.内部样式表 <style type="text/css"> </style ...

  10. (转)客户端触发Asp.net中服务端控件事件

    第一章. Asp.net中服务端控件事件是如何触发的 Asp.net 中在客户端触发服务端事件分为两种情况: 一. WebControls中的Button 和HtmlControls中的Type为su ...