Ajax跨域 取值 Jsonp的定义注意事项

今天要做一个去之前的项目上取数据,打算建一个接口,WebServer。中间遇到了一些问题。就是跨域取值的问题

客户端页面

1.首先Ajax请求的DataTy:‘jsonp‘这种格式,还要加一个 jsonp: "callback",最为主要的是有一个 回调函数Callback(),可把我折腾坏了。直接上客户端代码:

<script type="text/javascript">
        $(function () {
            $.ajax({
                type: "GET",
                url: "http://localhost:48748/WebService1.asmx/GetGrid",
                data: "",
                dataType: "jsonp",
                jsonp: "callback",
                success: function(data) {
                    callback(data);
                },
                error: function (error) {
                    console.log(error);
                }
            })
        })
        function callback(data) {
                alert(data.rows[0].Name);
             }
    </script>

后台代码。

2.采用的webserver 服务器,具体配置就不多说了,今天的主题是跨域访问json数据,需要注意的问题就是前面提到的,需要用一个CallBack回调函数,要有一定的格式。请看代码:

[WebMethod]
        public void GetGrid()
        {
            List<Notice> list = new List<Notice>();
            list.Add(new Notice { Id=1,Name="xiaoming"});
            JavaScriptSerializer json = new JavaScriptSerializer();
            var grid = new { rows = list };
            Context.Response.Write("callback("+json.Serialize(grid)+")");
        }

这点东西搞了一天,    写于:2015年1月27日01:06:09

时间: 2024-10-25 03:28:29

Ajax跨域 取值 Jsonp的定义注意事项的相关文章

ajax 跨域获取数据jsonp使用

昨天帮同事从其他服务器传过来的json数据进行处理,遇到该问题.开始我的思路是用ajax直接请求把数据弄出来就OK了,然而出错了.原因是我使用的ajax 返回类型为json,默认ajax阻止跨服获取数据的.结合其他博文,ajax的dataType使用jsonp来解决此问题.开始觉得jsonp与json的使用类似,一步步的写着代码,如下: $.ajax({ type:'get', async:false, url:'http://112.11.131.238/nanhunongjing/GetCo

ajax 跨域请求之jsonp

需求 遇到的问题 解决办法 需求 今天项目需要访问一个外部链接获取数据,是跨域的.使用ajax 请求一直提示: 遇到的问题 1. 如何使用ajax 跨域请求数据 2. 能不能post请求 解决办法 经过网上查找资料,能使用jsonp请求跨域数据. jsonp请求数据只能get,不支持post跨域请求 使用方法,见代码: $.ajax({ type: "post",//这里写post也没用,也是get请求 url: "url", dataType: "jso

Ajax跨域请求解决方案——jsonp

转自:http://www.cnblogs.com/dowinning/archive/2012/04/19/json-jsonp-jquery.html 1.一个众所周知的问题,Ajax直接请求普通文件存在跨域无权限访问的问题,甭管你是静态页面.动态网页.web服务.WCF,只要是跨域请求,一律不准: 2.不过我们又发现,Web页面上调用js文件时则不受是否跨域的影响(不仅如此,我们还发现凡是拥有"src"这个属性的标签都拥有跨域的能力,比如<script>.<im

jquery Ajax 跨域请求( jsonp)

“Same-Origin Policy”(同源策略) JavaScript是一种在Web开发中经常使用的前端动态脚本技术.在JavaScript中,有一个很重要的安全性限制,被称为“Same-Origin Policy”(同源策略). 这一策略对于JavaScript代码能够访问的页面内容做了很重要的限制,即JavaScript只能访问与包含它的文档在同一域下的内容. 什么是跨域? 简单的来说,出于安全方面的考虑,页面中的JavaScript无法访问其他服务器上的数据,即“同源策略”.而跨域就是

ajax跨域请求获取jsonp数据

<!DOCTYPE html><html><head><meta charset="UTF-8"><title>Insert title here</title><script src="jquery.js"></script><script type="text/javascript">function getIntface(){ //?

ajax 跨域请求数据 jsonp 示例

1.请求页面 <!doctype html><head><html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>jsonp调用方法</title></head><body> <script type="text/javasc

ajax跨域传输(jsonp格式)

先抛个列子,转载自http://www.cnblogs.com/xcxc/p/3729660.html test.html <!doctype html> <html> <head> <meta charset="utf-8"> <title>test</title> <script src="jquery-1.5.2.min.js"></script> <scri

深入浅出JSONP:解决AJAX跨域问题

本文主要讲解了如何去解决AJAX跨域的问题,从跨域的简单原理到JONP实现模式详细的讲解整个解决方案,最后利用jQuery可以很方便的实现JSONP来进行跨域访问. 上周客户新买了服务器,原本在旧的服务器上放着客户的Web主页信息和一个后台程序(asp.net),在客户的主页中有一个动态显示最新消息的处理,这个处理就是通过ajax异步从那个后台程序中取得的.由于又购买了新的服务器,客户想把web主页和那个后台程序分开来,后台程序被部署到了新的服务器上.不过这个项目是我的同事小福同志开发的,也就由

Ajax跨域:Jsonp原理解析

推荐先看下这篇文章:JS跨域(ajax跨域.iframe跨域)解决方法及原理详解(jsonp) JavaScript是一种在Web开发中经常使用的前端动态脚本技术.在JavaScript中,有一个很重要的安全性限制,被称为“Same-Origin Policy”(同源策略).这一策略对于JavaScript代码能够访问的页面内容做了很重要的限制,即JavaScript只能访问与包含它的文档在同一域下的内容. JavaScript这个安全策略在进行多iframe或多窗口编程.以及Ajax编程时显得