jquery中ajax跨域的写法
由于JS同源策略的影响,因此js只能访问同域名下的文档。因此要实现跨域,一般有以下几个方法:
一、处理跨域的方式:
1.代理
2.XHR2
HTML5中提供的XMLHTTPREQUEST Level2(及XHR2)已经实现了跨域访问。但ie10以下不支持
只需要在服务端填上响应头:
header("Access-Control-Allow-Origin:*");
/*星号表示所有的域都可以接受,*/
header("Access-Control-Allow-Methods:GET,POST");
3.jsonP
原理:
ajax本身是不可以跨域的,
通过产生一个script标签来实现跨域。因为script标签的src属性是没有跨域的限制的。
其实设置了dataType: 'jsonp'后,$.ajax方法就和ajax XmlHttpRequest没什么关系了,取而代之的则是JSONP协议。JSONP是一个非官方的协议,它允许在服务器端集成Script tags返回至客户端,通过javascript callback的形式实现跨域访问。
ajax的跨域写法:
(其余写法和不跨域的一样):
比如
/*当前网址是localhost:3000*/
js代码 $.ajax({
type:"get",
url:"http://localhost:3000/showAll",/*url写异域的请求地址*/
dataType:"jsonp",/*加上datatype*/
jsonpCallback:"cb",/*设置一个回调函数,名字随便取,和下面的函数里的名字相同就行*/
success:function(){
。。。
}
}); /*而在异域服务器上,*/
app.js
app.get('/showAll',students.showAll);/*这和不跨域的写法相同*/ /*在异域服务器的showAll函数里,*/ var db = require("./database"); exports.showAll = function(req,res){ /**设置响应头允许ajax跨域访问**/
res.setHeader("Access-Control-Allow-Origin","*");
/*星号表示所有的异域请求都可以接受,*/
res.setHeader("Access-Control-Allow-Methods","GET,POST"); var con = db.getCon();
con.query("select * from t_students",function(error,rows){
if(error){
console.log("数据库出错:"+error);
}else{
/*注意这里,返回的就是jsonP的回调函数名+数据了*/
res.send("cb("+JSON.stringify(r)+")");
}
});
}
jquery中ajax跨域的写法的更多相关文章
- jquery中ajax跨域加载
今天学习ajax跨域加载,先来一段代码,异步加载的链接是爱奇艺的开源,我直接拿来用作测试 <!DOCTYPE html> <html lang="en"> ...
- JQuery中ajax跨域问题
var url = "http://apis.juhe.cn/idcard/index?key=e0a6277420506b2816b82f7d7821976c&cardno=&qu ...
- jquery中ajax跨域提交的时候会有2次请求
我们平时在同域中请求页面什么的时候不会有这种情况,这种情况大多发生在移动端的跨域请求中发生的. 解决方法就是在服务端中加一层过滤HTTP请求的类型,把OPTION等不用的类型过滤掉.就是当请求为非 H ...
- php中ajax跨域请求---小记
php中ajax跨域请求---小记 前端时间,遇到的一个问题,情况大约是这样: 原来的写法: 前端js文件中: $.ajax({ type:'get', url:'http://wan.xxx.c ...
- jQuery中getJSON跨域原理详解
详见:http://blog.yemou.net/article/query/info/tytfjhfascvhzxcytp28 jQuery中getJSON跨域原理详解 前几天我再开发一个叫 河蟹工 ...
- JQuery实现ajax跨域
AJAX 的出现使得网页可以通过在后台与服务器进行少量数据交换,实现网页的局部刷新.但是出于安全的考虑,ajax不允许跨域通信.如果尝试从不同的域请求数据,就会出现错误.如果能控制数据驻留的远程服务器 ...
- jQuery使用ajax跨域请求获取数据
jQuery使用ajax跨域请求获取数据 跨域是我在日常面试中经常会问到的问题,这词在前端界出现的频率不低,主要原因还是由于安全限制(同源策略, 即JavaScript或Cookie只能访问同域下的 ...
- JQuery的Ajax跨域请求的
JQuery的Ajax跨域请求的(Ajax) 什么是jsonp格式呢?API原文:假设获取的数据文件存放在远程server上(域名不同.也就是跨域获取数据),则须要使用jsonp类型.使用这样的类型的 ...
- PHP+JQuery实现ajax跨域
jQuery实现ajax跨域 1.dataType:'jsonp'2.type: 'get'3.把要传的参数以url方式传出去 url:'http://gameapi.feiliu.com/lqzg ...
随机推荐
- java对象在JVM堆中的数据结构
java对象和数组是存放在堆中的,那么这些instance的数据结构是什么呢? 对象头:对象头存放的是这个对象的一些元数据信息.例如每个对象都有哈希值,GC分代年龄,锁状态标志等,这些信息就是存放在对 ...
- NIO 02 (转)
本文转自:http://weixiaolu.iteye.com/blog/1479656 SelectionKey.OP_ACCEPT // 服务端监听,并注册OP_ACCEPT事件后,就已准备好接受 ...
- OpenVPN GUI出现CreateProcess错误的解决方法
问题描述 启动 OpenVPN GUI 时失败,提示“CreateProcess Failed, exe=’X:\XXXXX\OpenVPN\bin\openvpn.exe’ cmdline= ...
- Linux远程管理器xshell和xftp使用教程,以及遇到关闭Xshell后项目也停止的解决方法
1.xshell 是一个强大的安全终端模拟软件,它支持SSH1, SSH2, 以及Microsoft Windows 平台的TELNET 协议. 2.是一个基于 MS windows 平台的功能强大的 ...
- GoEasyWeb实时推送
GoEasyWeb实时推送,轻松实现实时消息推送. Web页面订阅(约5行代码),服务器端推送(2行代码)就可以轻松实现,而且在高并发时消息推送稳定. 自己完全可以只花五分钟写出属于自己的第一个实时推 ...
- Java-性能调优-理解GC日志
[ ~]# cat gc.log.0 | grep 'Full GC' 1.652: [Full GC (System) 1.652: [CMS: 0K->21718K(262144K), 0. ...
- 20145322《Java程序设计》第十周学习总结
20145322<Java程序设计>第十周学习总结 教材学习内容总结 网络概述 网络编程就是在两个或两个以上的设备(例如计算机)之间传输数据.程序员所作的事情就是把数据发送到指定的位置,或 ...
- 20135320赵瀚青LINUX第六周学习笔记
赵瀚青原创作品转载请注明出处<Linux内核分析>MOOC课程http://mooc.study.163.com/course/USTC-1000029000 概述 这周主要讲解的是进程. ...
- 用python打印99乘法口诀表
代码如下 #!/usr/bin/env python # encoding: utf-8 __author__ = 'Nicholas.Cage' i = 1 j = 1 while i <= ...
- mysql的一些基本知识
一.数据类型: 字符型 整型 浮点型 日期时间型 二.数据表操作: 插入记录:INSERT 表名(···,···,···) VALUES('···','···',···): 查找记录:SELECT ...