node实现jsonp跨域
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跨域的更多相关文章
- 借助node实战JSONP跨域
一.前言: 浏览器安全是基于同源策略的.所谓同源策略就是三相同: 1.协议相同: 2.域名相同: 3.端口相同. 但,凡事都是有利弊,同源策略也导致了我们想用AJAX跨域请求,但NO!!为了规避这种限 ...
- Jsonp跨域访问
很早之前看过好几篇跨域访问的文章,然后做项目的时候基本没有遇到跨域访问的问题.不过该来的还是会来,前些天终于让我遇到了.于是重温了一下原理这些,再进行实战.于是现在也敢通过实战后的一些理解来和大家分享 ...
- 深入浅出:了解jsonp跨域的九种方式
什么是“”跨域”: 跨域访问,简单来说就是 A 网站的 javascript 代码试图访问 B 网站,包括提交内容和获取内容.由于安全原因,跨域访问是被各大浏览器所默认禁止的.当一个域与其他域建立了信 ...
- 原生JS封装Ajax插件(同域&&jsonp跨域)
抛出一个问题,其实所谓的熟悉原生JS,怎样的程度才是熟悉呢? 最近都在做原生JS熟悉的练习... 用原生Js封装了一个Ajax插件,引入一般的项目,传传数据,感觉还是可行的...简单说说思路,如有不正 ...
- jsonp跨域+ashx(示例)
前言 做B/S项目的时候,我们一般使用jquery+ashx来实现异步的一些操作,比如后台获取一些数据到前台,但是如果ashx文件不在本项目下,引用的是别的域下的文件,这时候就访问不了.关于jsonp ...
- jsonp 跨域请求
背景: JavaScript是一种在Web开发中经常使用的前端动态脚本技术.在JavaScript中,有一个很重要的安全性限制,被称为"Same-Origin Policy"(同源 ...
- 我的jsonp跨域问题
关于jsonp跨域问题,在这个方面也是了解一点点,先记录下来,主要作为以后查看,之前下载并安装过wampserver,了解到了jsonp和json的区别,现在谈谈跨域这个问题: 首先什么是跨域,简单地 ...
- jsonP跨域调用
-------------------------------------jsonP跨域调用------------------------------------- <div class=&q ...
- JSONP跨域的原理解析( 一种脚本注入行为)
JavaScript是一种在Web开发中经常使用的前端动态脚本技术.在JavaScript中,有一个很重要的安全性限制, 被称为“some-Origin Policy”(同源策略).这一策略对于Jav ...
随机推荐
- ORACLE对象大小写问题
在数据库新建一个测试表(数据库版本为ORACLE 10.2.0.1.0),表名为小写的test. 脚本如下所示: CREATE TABLE test( id NUMBER(10), ...
- redhat linux/CentOS 6/7 如何关闭防火墙?
redhat linux/CentOS 6/7 如何关闭防火墙?关闭防火墙iptables的具体命令如下: 临时性的完全关闭防火墙,可以不重启机器(但是重启服务器后iptables防火墙服务会自动随系 ...
- Linux下passwd和shadow文件内容详解
一./etc/passwd /etc/passwd 文件是一个纯文本文件,每行采用了相同的格式: name:password:uid:gid:comment:home:shell name 用户登录名 ...
- MySQL数据库学习笔记----MySQL多表查询之外键、表连接、子查询、索引
本章主要内容: 一.外键 二.表连接 三.子查询 四.索引 一.外键: 1.什么是外键 2.外键语法 3.外键的条件 4.添加外键 5.删除外键 1.什么是外键: 主键:是唯一标识一条记录,不能有重复 ...
- Nginx500错误
- useradd和adduser
1.Ubuntu中,adduser是一个脚本,而useradd是一个二进制程序,前者对后者进行了封装,更加智能. 2.Centos中,adduser和useradd完全相同,adduser是一个符号链 ...
- Spring Boot-JPA
前文我们使用SPRING INITIALIZR快速构建了一个空的Spring Boot项目,并增加web模块实现了HTTP请求. 这一篇继续在该demo的基础上,增加JPA的功能. JPA全称Java ...
- Spring学习之二
1.初始化和销毁Bean 当实例化一个Bean时,可能需要执行一些初始化操作来确保该Bean处于可用状态.同样地,当不需要Bean时,将其从容器中移除时,我们可能还需要按顺序的执行一些清除工作. 为定 ...
- 使用Z3破解简单的XOR加密
使用Z3破解简单的XOR加密 翻译:无名侠 原文地址: https://yurichev.com/blog/XOR_Z3/ 如果我们有一段用简单XOR加密过的文本,怎么寻找密钥呢?密钥的长度可能很长, ...
- LANMP系列教程之php编译安装CentOS7环境
前提:必须先安装好MySQL以及Apache 1.准备好源码包并配置好yum源,需要的源码包包括: libmcrypt-2.5.8-9.el6.x86_64.rpm libmcrypt-devel ...