ajax jsonp跨域

js跨域问题是指:js在不同的域之间进行数据传输或通信,比如用ajax向一个不同的域请求数据,或者通过js获取页面中不同域的框架中(iframe)的数据。只要协议、域名、端口有任何一个不同,都被当作是不同的域。

js跨域参考:http://www.cnblogs.com/2050/p/3191744.html

可以通过jsonp实现js跨域,但是获取的数据必须是脚本文件,例如json。

下面介绍jquery.ajax方法

jQuery.ajax(url,[settings]);url是必填的,其他都是选填的。

常用格式:

$.ajax({

url:url,

type:"get",

dataType: "jsonp",

sucess:function(data){}

});

主要选项介绍:

1)type:请求方式 ("POST" 或 "GET"),默认为GET;

2)dataType:

预期服务器返回的数据类型。如果不指定,jQuery将自动根据HTTP包MIME信息来智能判断,比如XML MIME类型就被识别为XML。在1.4中,JSON就会生成一个JavaScript对象,而script则会执行这个脚本。随后服务器端返回的数据会根据这个值解析后,传递给回调函数。可用值:

"xml": 返回 XML 文档,可用 jQuery 处理。

"html": 返回纯文本 HTML 信息;包含的script标签会在插入dom时执行。

"script": 返回纯文本 JavaScript 代码。不会自动缓存结果。除非设置了"cache"参数。‘‘‘注意:‘‘‘在远程请求时(不在同一个域下),所有POST请求都将转为GET请求。(因为将使用DOM的script标签来加载)

"json": 返回 JSON 数据 。

"jsonp": JSONP 格式。使用 JSONP 形式调用函数时,如 "myurl?callback=?" jQuery 将自动替换 ? 为正确的函数名,以执行回调函数。

"text": 返回纯文本字符串

3)async:(默认: true) 默认设置下,所有请求均为异步请求。

如果需要发送同步请求,请将此选项设置为false。同步请求将锁住浏览器,用户其它操作必须等待请求完成才可以执行。注意:用jsonp实现跨域,只能使用异步提交,无论你是否设置async。参见:http://api.jquery.com/jQuery.ajax/

原文:Cross-domain requests and dataType: "jsonp" requests do not support synchronous operation. Note that synchronous requests may temporarily lock the browser, disabling any actions while the request is active.

4)data:发送到服务器的数据

data选项既可以包含一个查询字符串,比如 key1=value1&key2=value2 ,也可以是一个映射,比如 {key1: ‘value1‘, key2: ‘value2‘} 。如果使用了后者的形式,则数据会被转换成查询字符串。

5)jsonp:在一个jsonp请求中重写回调函数的名字。这个值用来替代在"callback=?"这种GET或POST请求中URL参数里的"callback"部分,比如{jsonp:‘onJsonPLoad‘}会导致将"onJsonPLoad=?"传给服务器。

6)jsonpCallback:为jsonp请求指定一个回调函数名。这个值将用来取代jQuery自动生成的随机函数名。这主要用来让jQuery生成度独特的函数名,这样管理请求更容易,也能方便地提供回调函数和错误处理。你也可以在想让浏览器缓存GET请求的时候,指定这个回调函数名。

7)username和password选项

如果服务器需要HTTP认证,可以使用用户名和密码可以通过username和password选项来设置。

8)success(data, textStatus, jqXHR):请求成功后的回调函数。

9)timeout:设置请求超时时间(毫秒)。此设置将覆盖全局设置。

注意,当程序中需要发起多个AJAX请求时,则不用再为每一个请求配置请求的参数,所有的选项都可以通过$.ajaxSetup()函数来全局设置

举例:

$.ajaxSetup({
    timeout: 3000,
    dataType: 'html',
    //请求成功后触发
    success: function (data) { show.append('success invoke!' + data + '<br/>'); },
    //请求失败遇到异常触发
    error: function (xhr, status, e) { show.append('error invoke! status:' + status+'<br/>'); },
    //完成请求后触发。即在success或error触发后触发
    complete: function (xhr, status) { show.append('complete invoke! status:' + status+'<br/>'); },
    //发送请求前触发
    beforeSend: function (xhr) {
    //可以设置自定义标头
    xhr.setRequestHeader('Content-Type', 'application/xml;charset=utf-8');
    show.append('beforeSend invoke!' +'<br/>');
    },
  })

时间: 2024-10-12 08:36:46

ajax jsonp跨域的相关文章

JQuery+ajax+jsonp 跨域访问

Jsonp(JSON with Padding)是资料格式 json 的一种“使用模式”,可以让网页从别的网域获取资料. 关于Jsonp更详细的资料请参考http://baike.baidu.com/view/2131174.htm,下面给出例子: 一.客户端 Html代码   <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.

jquery ajax jsonp跨域调用实例代码

今天研究了AJAX使用JSONP进行跨域调用的方法,发现使用GET方式和POST方式都可以进行跨域调用,这里简单分享下,方便需要的朋友 客户端代码 复制代码 代码如下: <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="WebApp.WebForm1" %><!DOCTYPE html P

你不知道的jQuery Item11 -- ajax jsonp跨域方法详解

文章从JSON和JSONP区别开始讲起,用实例来对比他们之间的不同之处,然后详细讲解了jQuery中的ajax jsonp的使用并给出了示例及详细参数说明. 1.JSON和JSONP JSON(JavaScript Object Notation)是一种轻量级的数据交换格式,用于在浏览器和服务器之间交换信息. JSONP(JSON With Padding),就是打包在函数调用中的的JSON(或者包裹的JSON),你要跨域请求别人的东西,你肯定要包裹起来,不要污染了别人的东西,把Json数据包裹

ajax jsonp跨域处理问题

客户端 html $.ajax({ type : "get", async:false, dataType : "jsonp", jsonp: "jsoncallback",//服务端用于接收callback调用的function名的参数 jsonpCallback:"success_jsonpCallback",//callback的function名称 url:'http://www.apps.com/netWork.ph

AJAX的跨域与JSONP

AJAX的跨域与JSONP 什么是AJAX的跨域请求 出于安全的考虑,如果你要从www.a.com通过Ajax来请求另外一个网站www.b.com的内容,浏览器是不允许你这样做的(不理解这里的安全是指什么?想想如果没有这个限制的话,黑客可以做些什么).那什么样的情况下算是跨域?域名不同那当然算是跨域了,例如a.com向b.com发送请求,这当然就是跨域了,不允许的.不过子域名不同(例如sub.a.com向www.a.com发送请求)甚至是同域名不同端口(例如a.com:80向a.com:8080

原生JS封装Ajax插件(同域&amp;&amp;jsonp跨域)

抛出一个问题,其实所谓的熟悉原生JS,怎样的程度才是熟悉呢? 最近都在做原生JS熟悉的练习... 用原生Js封装了一个Ajax插件,引入一般的项目,传传数据,感觉还是可行的...简单说说思路,如有不正确的地方,还望指正^_^ 一.Ajax核心,创建XHR对象 Ajax技术的核心是XMLHttpRequest对象(简称XHR),IE5是第一款引入XHR对象的浏览器,而IE5中的XHR对象是通过MSXML库中的一个ActiveX对象实现的,因此在IE中可能有3个版本,即MSXML2.XMLHttp.

Ajax+Spring MVC实现跨域请求(JSONP)JSONP 跨域

JSONP原理及实现 接下来,来实际模拟一个跨域请求的解决方案.后端为Spring MVC架构的,前端则通过Ajax进行跨域访问. 1.首先客户端需要注册一个callback(服务端通过该callback(jsonp)可以得到js函数名(jsonpCallback)),然后以JavaScript语 法的方式,生成一个function 2.接下来,将JSON数据直接以入参的方式,放置到function中,这样就生成了一段js语法文档,返回给客户端. 3.最后客户端浏览器动态的解析script标签,

笔记-Ajax[4]-JSONP跨域获取数据。

JS的跨域:跨域名获取数据,a域名获取b域名中的数据. 解决跨域获取数据的方法也叫JSONP(JSON and Padding) JSONP方法: 1:服务器代理:XMLHttpRequest代理文件 2:script标签:jsonp(常用);//利用script标签的src引入外部文件的功能,src能够引入任何的文件的类型 3:location.hash方式:iframe 4:window.name方式 5:flash方式 6:html5的postMessage方式 例子:百度输入数据下拉框提

tp5+ajax 实现jsonp跨域

好久没更新博客了,今天加了会班,领导布置了一个需求,由于上线网站是编辑器开发的,这就需要混合开发了,需求模块有一个模块需要和我已经布置好阿里云的另一个域名交互开发,也就是说我用tp5框架搭建了A后台 需要和另一个域名的模块进行对接,我首先选择了ajax交互跨域到我A后台的方法里,注意 ajax的type 一定要看好,本人就进坑了,因为jsonp是get传参,所以A后台ajax方法接受一定要用get来,然后再tp5后台 返回success 用 return jsonp($data),前端ajax常