• Node.js返回JSON


    在使用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>

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

    router.get('/getinfo',function  (req,res,next) {
        var _data = { email: 'example@163.com', name: 'jaxu' };
        res.type('application/json');
        res.jsonp(_data);
    });
  • 相关阅读:
    教你一招用 IDE 编程提升效率的骚操作!
    动态拼接sql语句工具类
    mysql数据建模规范
    分割字符串为数字列表
    linux 配置mysql odbc
    nodejs npm常用命令
    (四)jquery easyui panel window使用
    (三)jquery easyui常用form控件的使用
    (二)jquery easyUI提示框的使用
    (一)jQuery easyUI 环境的搭建
  • 原文地址:https://www.cnblogs.com/qqhfeng/p/11869452.html
Copyright © 2020-2023  润新知