Node.js返回JSONP详解

在使用JQuery的Ajax从服务器请求数据或者向服务器发送数据时常常会遇到跨域无法请求的错误，常用的解决办法就是在Ajax中使用JSONP。基于安全性考虑，浏览器会存在同源策略，然而<script/>标签却具有跨域访问数据的能力，这就是JSONP工作的基本原理。有关同源策略以及什么是JSONP。

在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对象。

以上这篇Node.js返回JSONP详解就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持我们。

赞 (0)

相关推荐

  • 借助node实战JSONP跨域实例

    借助node实战JSONP跨域实例

    一.前言: 浏览器安全是基于同源策略的.所谓同源策略就是三相同: 1.协议相同: 2.域名相同: 3.端口相同. 但,凡事都是有利弊,同源策略也导致了我们想用AJAX跨域请求,但NO!!为了规避这种限制,其中有一方法就是JSONP. JSONP的基本思想:就是通过<script>的src,向服务器请求数据,且这不受同源策略限制(img和iframe的src也是如此):然后服务器将相应的数据放入指定的函数回调名中,返回给前端. 这,就实现了跨域请求信息. 如下图所示: 了解了JSONP的大体思路

  • Node.js返回JSONP详解

    Node.js返回JSONP详解

    在使用JQuery的Ajax从服务器请求数据或者向服务器发送数据时常常会遇到跨域无法请求的错误,常用的解决办法就是在Ajax中使用JSONP.基于安全性考虑,浏览器会存在同源策略,然而<script/>标签却具有跨域访问数据的能力,这就是JSONP工作的基本原理.有关同源策略以及什么是JSONP. 在Node.js中实现JSONP非常简单,通过下面的代码我们从服务器返回并运行一个JavaScript函数,这个JavaScript函数已经在调用方提前被定义好了,于是当它被返回的时候就自动执行了.

  • Node.js 事件循环详解及实例

     Node.js  事件循环详解及实例 Node.js 是单进程单线程应用程序,但是通过事件和回调支持并发,所以性能非常高. Node.js 的每一个 API 都是异步的,并作为一个独立线程运行,使用异步函数调用,并处理并发. Node.js 基本上所有的事件机制都是用设计模式中观察者模式实现. Node.js 单线程类似进入一个while(true)的事件循环,直到没有事件观察者退出,每个异步事件都生成一个事件观察者,如果有事件发生就调用该回调函数. Node.js 有多个内置的事件,我们可以

  • Node.js  事件循环详解及实例

     Node.js  事件循环详解及实例 Node.js 是单进程单线程应用程序,但是通过事件和回调支持并发,所以性能非常高. Node.js 的每一个 API 都是异步的,并作为一个独立线程运行,使用异步函数调用,并处理并发. Node.js 基本上所有的事件机制都是用设计模式中观察者模式实现. Node.js 单线程类似进入一个while(true)的事件循环,直到没有事件观察者退出,每个异步事件都生成一个事件观察者,如果有事件发生就调用该回调函数. Node.js 有多个内置的事件,我们可以

  • 利用nvm管理多个版本的node.js与npm详解

    利用nvm管理多个版本的node.js与npm详解

    前言 Nvm 管理不同版本的 node 与 npm nvm 是 NodeJS 的多版本管理工具,有点类似管理 Ruby 的 rvm,如果是需要管理 Windows 下的 node,官方推荐是使用 nvmw 或 nvm-windows . 卸载已安装的全局 node/npm 在官网下载的 node 安装包,运行后会自动安装在全局目录,其中node 命令在 /usr/bin/node ,npm 命令在全局 node_modules 目录中,具体路径为 /usr/lib[lib64]/node_mod

  • node.js实现BigPipe详解

    node.js实现BigPipe详解

    BigPipe 是 Facebook 开发的优化网页加载速度的技术.网上几乎没有用 node.js 实现的文章,实际上,不止于 node.js,BigPipe 用其他语言的实现在网上都很少见.以至于这技术出现很久以后,我还以为就是整个网页的框架先发送完毕后,用另一个或几个 ajax 请求再请求页面内的模块.直到不久前,我才了解到原来 BigPipe 的核心概念就是只用一个 HTTP 请求,只是页面元素不按顺序发送而已. 了解了这个核心概念就好办了,得益于 node.js 的异步特性,很容易就可以

  • 利用Nginx实现反向代理Node.js的方法详解

    前言 公司有项目前端是用node.js进行服务器渲染,然后再返回给浏览器,进而解决单页面的SEO问题.项目部署的时候,使用Nginx反向代理Node.js.具体的步骤如下: (Nginx.Node.js的安装和基本配置直接跳过) 首先我们要在nginx.cnf文件中的http节点打开下面的配置: http { log_format main '$remote_addr - $remote_user [$time_local] "$request" ' '$status $body_by

  • Node.js的特点详解

    Node.js是一个基于Chrome v8引擎建立的Java运行平台,用于搭建响应速度快.易于扩展的网络应用.本文和大家分享的是Node.js的一些特点,希望对大家学习Node.js有帮助. 异步I/O 这里,我们来详细解释一下: 异步是什么意思 比如说你的爸,今天要叫你做些事情,比如说你要做饭.洗衣服还有扫地,以及烧开水等等一系列的事情.那么,就你一个人来说,你是不是得一件事一件事的挨个做完了之后,才能接着做下一件事.比如说,你是不是烧完开水,然后才来扫地,扫完地然后再来煮饭,煮完饭,你可能才

  • Node.js文件操作详解

    Node有一组数据流API,可以像处理网络流那样处理文件,用起来很方便,但是它只允许顺序处理文件,不能随机读写文件.因此,需要使用一些更底层的文件系统操作. 本章覆盖了文件处理的基础知识,包括如何打开文件,读取文件某一部分,写数据,以及关闭文件. Node的很多文件API几乎是UNIX(POSIX)中对应文件API 的翻版,比如使用文件描述符的方式,就像UNIX里一样,文件描述符在Node里也是一个整型数字,代表一个实体在进程文件描述符表里的索引. 有3个特殊的文件描述符--1,2和3.他们分别

  • yarn的使用与升级Node.js的方法详解

    前言 在官方介绍里有这么一句话: Yarn is a package manager for your code. It allows you to use and share code with other developers from around the world. Yarn does this quickly, securely, and reliably so you don't ever have to worry. 关键意思就是,快速,安全,可靠.你下载的包将不再重新下载.而且

  • node.js超时timeout详解

    node.js超时timeout详解

    如果在指定的时间内服务器没有做出响应(可能是网络间连接出现问题,也可能是因为服务器故障或网络防火墙阻止了客户端与服务器的连接),则响应超时,同时触发http.ServerResponse对象的timeout事件. response.setTimeout(time,[callback]); 也可以不在setTimeout中指定回调函数,可以使用时间的监听的方式来指定回调函数. 如果没有指定超时的回调函数,那么出现超时了,将会自动关闭与http客户端连接的socket端口.如果指定了超时的回调函数,

随机推荐