在使用JQuery的Ajax从服务器请求数据或者向服务器发送数据时常常会遇到跨域无法请求的错误，常用的解决办法就是在Ajax中使用JSONP。基于安全性考虑，浏览器会存在同源策略，然而<script/>标签却具有跨域访问数据的能力，这就是JSONP工作的基本原理。有关同源策略以及什么是JSONP，可以参考园子里的这篇文章http://www.cnblogs.com/yuzhongwusan/archive/2012/12/11/2812849.html

　　在Node.js中实现JSONP非常简单，通过下面的代码我们从服务器返回并运行一个JavaScript函数，这个JavaScript函数已经在调用方提前被定义好了，于是当它被返回的时候就自动执行了。

var express = require('express');

var router = express.Router();

router.get('/getinfo', function(req, res, next) {

  var _callback = req.query.callback;

  var _data = { email: 'example@163.com', name: 'jaxu' };

  if (_callback){

      res.type('text/javascript');

      res.send(_callback + '(' + JSON.stringify(_data) + ')');

  }

  else{

      res.json(_data);

  }

});

module.exports = router;

　　代码中必须规定从服务器返回数据的类型，代码res.type('text/javascript')被加在返回的数据之前用于告诉浏览器这是一段JavaScript代码。

　　前端页面通过JQuery调用：

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>jsonp test</title>

    <script src="/bower_components/jquery/dist/jquery.js"></script>

</head>

<body>

    <input type="button" value="click" id="btn">

    <script type="text/javascript">

        $(function(){

            $('#btn').on('click', function(){

                $.get('http://anothersite/api/getinfo', function(d){

                    console.log(d);

                }, 'jsonp');

            });

        });

    </script>

</body>

</html>

　　运行代码，点击按钮，在浏览器的console面板总我们可以看到从远程服务器返回的json对象。

　　当然，如果使用express，则可以直接使用下面的代码：

router.get('/getinfo',function  (req,res,next) {

    var _data = { email: 'example@163.com', name: 'jaxu' };

    res.type('application/json');

    res.jsonp(_data);

});

　　参考express的文档http://www.expressjs.com.cn/4x/api.html#res.jsonp

Node.js返回JSONP的更多相关文章

  1. Node.js 返回 JSON 数据

    Node.js 返回 JSON 数据 request.end([data[, encoding]][, callback]) var http = require('http'); const log ...

  2. Node.js返回JSON

    在使用JQuery的Ajax从服务器请求数据或者向服务器发送数据时常常会遇到跨域无法请求的错误,常用的解决办法就是在Ajax中使用JSONP.基于安全性考虑,浏览器会存在同源策略,然而<scri ...

  3. Node.js初探之实现能向前台返回东西的简单服务器

    nodejs nodejs文件就是一个简单的js文件. 在shell中运行 Step 1. 打开终端,进入这个js文件所在目#录 Step 2. 用 'node 文件名.js' 命令运行它即可. 用n ...

  4. Node.js 使用jQuery取得Nodejs http服务端返回的JSON数组示例

    server.js代码: // 内置http模块,提供了http服务器和客户端功能(path模块也是内置模块,而mime是附加模块) var http=require("http" ...

  5. Node.js 使用jQuery取得Nodejs http服务端返回的JSON对象示例

    server.js代码: // 内置http模块,提供了http服务器和客户端功能(path模块也是内置模块,而mime是附加模块) var http=require("http" ...

  6. node.js通过回调函数获取异步函数的返回结果

    html文件代码 <!DOCTYPE html> <html lang="en"> <head> <meta charset=" ...

  7. 前端使用node.js+express+mockjs+mysql实现简单服务端，2种方式模拟数据返回

    今天,我教大家来搭建一个简单服务端 参考文章: https://www.jianshu.com/p/cb89d9ac635e https://www.cnblogs.com/jj-notes/p/66 ...

  8. node.js连接本地数据库及json返回数据

    新建一个文件夹node.js,目录下打开命令初始化一下 cnpm init 然后下载express框架 cnpm install express --save 接着下载数据库的依赖 cnpm inst ...

  9. 了不起的Node.js读书笔记

    原文摘自我的前端博客,欢迎大家来访问 http://www.hacke2.cn 第二章 Js概览 基于GoogleV8引擎 Object.keys(o) 数组方法:遍历forEach.过滤filter ...

随机推荐

  1. EXEC sp_executesql

    declare @sql nvarchar(max)declare @nu int set @sql='SELECT * FROM [FMTest].[dbo].[FM_Radio_Station]' ...

  2. c语言实现开灯问题

    开灯问题: 有n盏灯,编号为1~n,第1个人把所有灯打开,第2个人按下所有编号为2 的倍数的开关(这些灯将被关掉),第3 个人按下所有编号为3的倍数的开关(其中关掉的灯将被打开,开着的灯将被关闭),依 ...

  3. dedecms 文章页图片改为绝对路径

    这几天在网站改版,想把网站做大,想做频道页二级域名,于是在做网站的过程中发现一个问题,dedecms开设二级域名后,在二级域名的文章页无法显示图片,查看源代码后发现问题,由于dedecms文章页中的图 ...

  4. iOS Swift 3 open

    参考资料:http://stackoverflow.com/questions/38947101/what-is-the-open-keyword-in-swift

  5. startssl申请配置免费https证书

    之前给业务配置都是在沃通上申请免费证书,而后通过反向代理层的Nginx进行https认证. 今天来了个新需求,要求域名直接解析至阿里云SLB.https配置需要通过阿里云的控制台部署这倒无所谓,只是在 ...

  6. 总结30个CSS3选择器（转载）

    或许大家平时总是在用的选择器都是:#id  .class  以及标签选择器.可是这些还远远不够,为了在开发中更加得心应手,本文总结了30个CSS3选择器,希望对大家有所帮助. 1 *:通用选择器 * ...

  7. d8fs9f

    你好 - Helloworld 1. a 2. b 3. c 来自为知笔记(Wiz)

  8. JAVA多线程售票问题

    //定义一个类实现Runnable接口,定义一个需要同步的售票方法,然后重写run方法调用售票的sale方法 class SaleTicket implements Runnable{ private ...

  9. 谈BFC和haslayout

    今天提到BFC和haslayout,就顺带在网上查查资料,总结一下它们. CSS2我们再熟悉不过,当然它里面我们需要掌握的,就是CSS2的选择器和布局,选择器总共31种.避开这个不说,我们说布局. 布 ...

  10. ajax教程

    本文来自w3school 简介: AJAX = Asynchronous JavaScript and XML 异步的javascript和xml ajax不是新的编程语言,而是一种使用现有标准的新方 ...