1. 搭建node server

//引入模块

var http=require("http");

var fs=require("fs");
var url = require('url');
var querystring = require('querystring');

//创建服务器
var server=http.createServer();
server.on("request",function(req,res){
    console.log(req.url.split('?')[1])
    var urlpath=url.parse(req.url).pathname;
    var qs = querystring.parse(req.url.split('?')[1]);//callback=result
    if(urlpath === '/jsonp'){
                res.writeHead(200,{'Content-Type':'application/json;charset=utf-8'});
                function isJson(obj){
                    return typeof(obj)=="object"&&Object.prototype.toString.call(obj).toLowerCase()=="[object ]"
                }
                 fs.readFile("fs.json",function(err,data){
                     if(err){console.log(err)}
                     data=JSON.parse(data);//因为data是buffer要把他变成json
                     data=JSON.stringify(data)
                     var callback = qs.callback+'('+data+');'；//callback：test（{json}）
                    res.end(callback);//res.end参数为buffer或者string
                 })
            }else{
                res.writeHead(200, {'Content-Type':'text/html;charset=utf-8'});
                res.end('Hell World\n');
            }
});
server.listen("3000");
console.log("server running at localhost:3000");

前端代码：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>jsonp</title>
</head>
<body>
    <div id="box">hahahaha</div>
    <button id="but">click it</button>
    
    <script>
        function test(data){
                            alert(data.name);
                        }
    </script>
    <script src="http://localhost:3000/jsonp?callback=test"></script>

</body>
</html>

node实现jsonp跨域的更多相关文章

  1. 借助node实战JSONP跨域

    一.前言: 浏览器安全是基于同源策略的.所谓同源策略就是三相同: 1.协议相同: 2.域名相同: 3.端口相同. 但,凡事都是有利弊,同源策略也导致了我们想用AJAX跨域请求,但NO!!为了规避这种限 ...

  2. Jsonp跨域访问

    很早之前看过好几篇跨域访问的文章,然后做项目的时候基本没有遇到跨域访问的问题.不过该来的还是会来,前些天终于让我遇到了.于是重温了一下原理这些,再进行实战.于是现在也敢通过实战后的一些理解来和大家分享 ...

  3. 深入浅出：了解jsonp跨域的九种方式

    什么是“”跨域”: 跨域访问,简单来说就是 A 网站的 javascript 代码试图访问 B 网站,包括提交内容和获取内容.由于安全原因,跨域访问是被各大浏览器所默认禁止的.当一个域与其他域建立了信 ...

  4. 原生JS封装Ajax插件(同域&&jsonp跨域)

    抛出一个问题,其实所谓的熟悉原生JS,怎样的程度才是熟悉呢? 最近都在做原生JS熟悉的练习... 用原生Js封装了一个Ajax插件,引入一般的项目,传传数据,感觉还是可行的...简单说说思路,如有不正 ...

  5. jsonp跨域+ashx（示例）

    前言 做B/S项目的时候,我们一般使用jquery+ashx来实现异步的一些操作,比如后台获取一些数据到前台,但是如果ashx文件不在本项目下,引用的是别的域下的文件,这时候就访问不了.关于jsonp ...

  6. jsonp 跨域请求

    背景: JavaScript是一种在Web开发中经常使用的前端动态脚本技术.在JavaScript中,有一个很重要的安全性限制,被称为"Same-Origin Policy"(同源 ...

  7. 我的jsonp跨域问题

    关于jsonp跨域问题,在这个方面也是了解一点点,先记录下来,主要作为以后查看,之前下载并安装过wampserver,了解到了jsonp和json的区别,现在谈谈跨域这个问题: 首先什么是跨域,简单地 ...

  8. jsonP跨域调用

    -------------------------------------jsonP跨域调用------------------------------------- <div class=&q ...

  9. JSONP跨域的原理解析( 一种脚本注入行为)

    JavaScript是一种在Web开发中经常使用的前端动态脚本技术.在JavaScript中,有一个很重要的安全性限制, 被称为“some-Origin Policy”(同源策略).这一策略对于Jav ...

随机推荐

  1. redis数据类型-字符串类型

    Redis数据类型 字符串类型 字符串类型是Redis中最基本的数据类型,它能存储任何形式的字符串,包括二进制数据.你可以用其存储用户的邮箱.JSON化的对象甚至是一张图片.一个字符串类型键允许存储的 ...

  2. 前端通过Nginx反向代理解决跨域问题

    在前面写的一篇文章SpringMVC 跨域,我们探讨了什么是跨域问题以及SpringMVC怎么解决跨域问题,解决方式主要有如下三种方式: JSONP CORS WebSocket 可是这几种方式都是基 ...

  3. 浅析调用JSR303的validate方法, 验证失败时抛出ConstraintViolationException

    废话不多说,直接进入正题:如何使用JSR303的validate,进行数据校验,失败后直接抛出异常加入流转信息中,并在form页面提示出来. 首先我们为了启用验证,需要向 项目中添加Bean验证的实现 ...

  4. 精通libGDX游戏开发-RPG实战-欢迎来到RPG的世界

    欢迎来到RPG的世界 本章我会快速的使用tiled这样的瓷砖地图工具,来带领大家创造所设想的世界. 创建并编辑瓷砖地图 瓷砖地图(tile-based map)是广泛应用于各种游戏类型的地图格式,li ...

  5. ------- 软件调试——还原 QQ 过滤驱动对关键内核设施所做的修改 -------

    -------------------------------------------------------------------------------- 在前一篇博文中,我们已经处理完最棘手的 ...

  6. Spring的事务管理（理论篇，下篇提供代码实现）

    事务:逻辑上的一组操作,这组操作要么全部成功,要么全部失败(事务十大特性:原子性,一致性,隔离性,持久性) 原子性:事务是不可分割的工作单位,事务中的操作要么都发生了,要么都不发生.(也就是说不能单独 ...

  7. 洛谷 [P1578] WC2002 奶牛浴场

    本题是一道用极大化思想求最大子矩阵的经典题目.这个题目很出名,可以在百度搜索王知昆国家队dalao的论文,其中说的非常详细. 先枚举极大子矩形的左边界,然后从左到右依次扫描每一个障碍点,并不断修改可行 ...

  8. 济南清北学堂游记 Day 6.

    还剩一天半我就该回去了. 说实话今天挺可惜的,有很多本来可以得到的分数评测时没有拿到.上午的第一题和第二题我都想出了正解,T3敲了一个暴力,虽然暴力写坏了.预计是可以拿210的但是实际上只有很少的分数 ...

  9. POJ3335 POJ3130 POJ1474 [半平面交]

    终于写出自己的半平面交模板了....... 加入交点的地方用了直线线段相交判定 三个题一样,能从任何地方看到就是多边形的内核 只不过一个顺时针一个逆时针(给出一个多边形的两种方式啦),反正那个CutP ...

  10. 自兴人工智能-------------Python入门基础（1）

    Python 是一门简单易学且功能强大的编程语言. 它拥有高效的高级数据结构, 并且能够用简单而又高效的方式进行面向对象编程. Python 优雅的语法和动态 类型,再结合它的解释性,使其在大多数平台 ...