统一的Ajax提交封装,一劳永逸好工具(带跨域处理)

直接上代码,核心代码的使用文末提供

        //---------核心关键,大家爱护----------//
        /**
        * 公共:基础支撑
        **/
        var G = {
            /**
            * 统一的请求
            * @parm url请求服务器地址,格式:"${contextPath }/docmanage/list"
            * @parm fn回调函数,格式:function setTableTr(data){for(..){..}}
            * @parm parm提交的条件,格式:{"name":"zhangsan","age":"23"}
            **/
            request:function (url,fn,parm) {
                $.ajax({
                    type: "post", 
                    async: false,
                    url: url, //请求的URL
                    dataType: "json",
                    data: parm,
                    //动态执行这个callback函数
                    success: function (data) {
                        if(fn!=undefined)fn(data);
                    },
                    error:function(reslt){
                        alert("服务器,请求失败。");
                    }
             })
            }
        }

跨域请求,使用下面这段

//统一的请求
function request(url,params, fn) {
    $.ajax({
        type: "get", //jquey是不支持post方式跨域的
        async: false,
        url: url, //跨域请求的URL
        dataType: "jsonp",
        //传递给请求处理程序,用以获得jsonp回调函数名的参数名(默认为:callback)
        jsonp: "callback",
        data: params,
        //成功获取跨域服务器上的json数据后,会动态执行这个callback函数
        success: function (data) {
            var result = data.result;
            if (data.head != ‘SUCCESS‘) {
                alert("服务器错误,请及时联系开发商!");
                return;
            }
            
            if(fn!=undefined) fn(result);
        }
    });
}

使用方法:

request("http://www.baidu.com",{"money":"100000"},moneyCall);

function moneyCall(data){

alert(JSON.stringify(data));

}

时间: 2024-10-11 20:46:12

统一的Ajax提交封装,一劳永逸好工具(带跨域处理)的相关文章

【网络开发】WeX5的Ajax和Django服务器json接口对接跨域问题解决

问题背景 WeX5是典型的html5+js架构.源文件全部放到服务器的UI Server中,使用通用的tomcat,例如使用域名www.wuyoubar.cn:8080/x5. Android和IOS的服务器端Django已经实现了json的处理,json的主域名www.wuyoubar.cn:80 PC访问WeX5页面.避免重复进行数据处理,WeX5的JS代码里面直接使用Ajax请求Django的json接口数据.这样就出现了跨域的问题,对于客户端来说,请求的源码,页面文件,css和js代码等

AJAX学习笔记2:XHR实现跨域资源共享(CORS)以及和JSONP的对比

1 前言: 首先对参考文章作者表示感谢,你们的经验总结给我们这些新手提供了太多资源.本文致力于解决AJAX的CORS问题,我在逻辑上进行了梳理:首先,系统的总结了CORS问题的起源-同源策略:其次,介绍JSONP这种仅能支持GET请求的跨域方式和CORS作对比:最后,阐述CORS的XHR解决方式和IE中的XDR解决方式,在此基础上提供了工具函数进行跨浏览器的HTTP请求对象创建. 2 跨域问题的源头-同源策略 在客户端编程语言中,如javascript和 ActionScript,同源策略是一个

vueCli3 封装axios 及 配置proxy跨域

步骤1:首先呢,在util文件下创建一个auth.js 用来获取token .存储token .删除token (这里的token是存放在sessionStorage里面) const TokenKey = 'user_token' export function getToken() { return sessionStorage.getItem(TokenKey) } export function setToken(token) { return sessionStorage.setIte

微信web开发者工具的跨域

1.点击微信开发者工具,击右键, 选择"属性",打开面板之后,选择"快捷方式" => "目标" 2.在目标那一行的最后,输入"空格--disable-web-security --user-data-dir",务必要输入这个命令前面的空格 3.点击"应用" => "确定" 4.重启微信开发者工具即可 "空格--disable-web-security --user-

在控制台中承载WCF服务,并提供Ajax访问和SOAP访问,以及跨域访问

WCF服务可以承载与iis.winform.console.window服务中,下面重点介绍以console为载体,对外提供服务(服务满足web访问以及soap方式访问) 1.服务类的实现 wcf服务类一般有两种实现方式,下面分别对两种方式进行介绍: 1.1 使用接口进行实现 1 namespace Example 2 { 3 [ServiceContract] 4 public interface IService 5 { 6 7 [OperationContract] 8 string Ge

Ajax通过script src特性加载跨域文件 jsonp

<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>Document</title></head><body><input type="text" id="text"><ul></ul> <script type="text/javasc

聊聊Ajax跨域

前言 由于浏览器的同源策略,使得发送请求的时候,只能给本域发送请求,不能跨域发送请求.对于Ajax请求来说,跨域浏览器是不允许的.原因不是不能发送,Ajax跨域的时候,确实发送了请求,并且收到了另一个域名的响应.但是浏览器会报错,默认情况下,Ajax不允许跨域,而script,img,  iframe 允许跨域,  基本上通过src引用去发送请求的,都可以跨域.src请求相当于发送了一个GET请求 那么如何让Ajax可以跨域请求呢?今天介绍两种方案 JSONP 什么是jsonp?jsonp是如何

ajax跨域访问数据

通过json发送和接受数据,数据以json的格式在服务器端和前台进行传递,什么是json数据?这里就不进行详细阐述,轻自行百度解决. 在html5 中利用ajax 异步请求时,会遇到跨域的问题,如果域名不一致.ip地址不一致,端口不一致都会导致跨域请求不成功. 为了解决这个问题,需要在前台和后台均设置相关的属性进行跨域请求. 现在展示服务器端的代码: 自己封装的过滤器: package utils; import java.io.IOException; import javax.servlet

Ajax跨域问题解决(Ajax JSONP)

因WEB安全原因,Ajax默认情况下是不能进行跨域请求的,遇到这种问题,自然难不倒可以改变世界的程序猿们,于是JSONP(JSON with Padding)被发明了,其就是对JSON的一种特殊,简单来说就是在原有的JSON数据上做了点手脚,从而达到可以让网页可以跨域请求.在现在互联网技术对"前后分离"大规模应用的时期,JSONP可谓意义重大啊. 假设我们原来的JSON数据为 {"hello":"你好","veryGood":