zoukankan      html  css  js  c++  java
  • ajax跨域请求数据

    最近开始接触ajax的跨域请求问题,相比网上说的一大堆,我这里就说得比较浅显了。

    关于为什么要跨域这个问题,实际的需求是当网站项目部署在一个域名上的时候,分域可以很好地解决网站卡顿问题(拥有多台服务器就另当别论)。

    这种做法现在很常见,多看几个网站细心点就可以看出点门道。

    下面对比一下跨域之前的ajax请求与跨域之后的请求:

    之前:

     $.post(wwwUrl + "/Home/DeleteById", { Id: id }, function (data) {
                    alert(data);
                    window.location.reload();
                });

    这里调用的是post方式(一般比较方便快捷,但是对ajax不熟练的话不推荐一开始就这样说使用),也可以用get。

    要说的是,跨域请求并不支持post方式!也不是说完全不支持,使用post请求在做跨域的时候对编码类型有限制,只允许content-type为

    application/x-www-form-urlencoded、multipart/form-data 或者 text/plain中一个。

    ........

    之后:

     $.ajax({
                    type: "GET",
                    async: false,
                    url: wwwUrl + "/Home/Index",
                    data: { Id: id },
                    dataType: "jsonp",
                    jsonp: "callback", //传递给请求处理程序或页面的,标识jsonp回调函数名(一般为:callback).
                    jsonpCallback: function (){}, //callback的function名称.
                    success: function (data) {
                        alert(data);
                        window.location.reload();
                    }
                });

    这里可以对比一下两种方式的区别。

    jsonpCallback属性后面接的是一个匿名函数,事实上这里应该是调用从另一个“域”返回的函数名,函数在本域的js里面,返回回来直接调用就行,记得带参!

    服务端的代码就不展示了,里面就是传个callback参数验证是否为空,肯定条件return一个JSON对面,包含操作数据返回时的状态Message,success里面调用的时候就是data.Message。

    百度文库有相关的详细说明,在此就不赘述。
  • 相关阅读:
    Ajax基础:3.Json
    Head First Design Patterns State Pattern
    Head First Design Patterns Template Method Pattern
    Articles For CSS Related
    Head First Design Patterns Decorator Pattern
    代码审查工具
    How To Be More Active In A Group
    Head First Design Patterns Factory Method Pattern
    Head First Design Patterns Composite Pattern
    Tech Articles
  • 原文地址:https://www.cnblogs.com/sunshine-wy/p/4708953.html
Copyright © 2011-2022 走看看