`

异步请求,跨域

 
阅读更多
(function ($) {
    $.rpc = {};

    $.rpc.setup = function (settings) {
        $.extend($.rpc.defaults, settings);
    };
    $.rpc.defaults = {
//        remoteHost:"http://test.wsd.com:8081/catering_oss",
        remoteHost:"http://liao-pc.wsd.com:8080/catering_oss",
        module:"/waiterIpad",
        urlExt:"",
        httpMethod:"get",
        dataType:"jsonp"
    };
    $.rpc.req = function (action, data, cb) {
        var settings = {};
        $.extend(settings, $.rpc.defaults);
        if (typeof action === "object") {
            $.extend(settings, action)
        } else {
            settings.action = action;
        }
        $.ajax({
            url:settings.remoteHost + settings.module + "/" + settings.action + settings.urlExt,
            type:settings.httpMethod,
            dataType:settings.dataType,
            jsonp:'jsoncallback',
            timeout:500,
            error:function (xhr) {
                if ($.isFunction(cb)) {
                    cb(null);
                }
            },
            data:data,
            success:function (data) {
                if ($.isFunction(cb)) {
                    cb(data);
                }
            }
        });

    };
   
    $.fn.showTime = function (tpid) {
        var showTimeFn = function () {
            var today = new Date();
            var hours = today.getHours();
            var minutes = today.getMinutes();
            var seconds = today.getSeconds();
            if (hours < 10) hours = "0" + hours;
            if (minutes < 10) minutes = "0" + minutes;
            if (seconds < 10) seconds = "0" + seconds;
            var timeStr = today.getFullYear() + "-" + today.getMonth() + "-" + today.getDate() + " " + hours + ":" + minutes + ":" + seconds;
            $('#' + tpid).html(timeStr);
        }
        showTimeFn();
        setInterval(showTimeFn, 1000)
    }
})(jQuery);

  调用:

初始化: $.rpc.setup({"module":"","urlExt":".json","remoteHost":"http://test.wsd.com:8081/catering_oss/manager",dataType:"jsonp"});

发送请求
 $.rpc.req("getEmployeeList",{"currentPage":pageIndex+1,"role":role,"staffName":staffName},function(resp){
  var employee={"data":{}};
            for(var key in resp.data.item){
                employee.data[key]=employee.data[key]||{};
                employee.data[key]=resp.data.item[key];
                employee.data[key].source="server";//标识数据来源
            }

 

分享到:
评论

相关推荐

    Ajax异步请求

    但是,需要注意异步请求的限制和安全问题,例如,避免cross-site scripting(XSS)攻击和跨域请求问题。 Ajax异步请求的优点包括: * 提高用户体验和页面加载速度 * 实现异步通信,提高应用程序的响应速度 * 减少...

    Ajax异步请求的验证

    Ajax异步请求的验证涉及多个方面,包括请求状态的检查、数据解析、错误处理以及跨域策略。熟练掌握这些知识点,能帮助开发者更好地构建高效、响应式的Web应用。在实践中,可以参考提供的`ajax-demo`代码,通过实际...

    基于react的企业后台管理开发框架.zip

    基于react的企业后台管理开发框架 node10.15.3 + react@16.12.0 + redux@3.7.2 + react-...- [√] axios异步请求跨域的设置 - [√] 实时的webpack包大小预览,方便优化 - [√] draftjs编辑器 - [√] cypress自动化测试

    Ajax异步(请求)提交类 支持跨域

    为了解决这一限制,开发者们开发了一系列的解决方案,其中就包括本文介绍的支持跨域的Ajax异步请求类。 #### 关键知识点详解 ##### 1. Ajax基础概念 - **定义**:Ajax(Asynchronous JavaScript and XML)是一种...

    异步 提交表单请求

    异步请求的核心在于,浏览器不会阻塞其他任务,而是创建一个新的请求并在后台处理。当服务器返回响应时,JavaScript会接收到数据并进行相应的操作,而不是像同步请求那样更新整个页面。 2. **Ajax基本结构** Ajax...

    基于React+webpack+redux+ant design+axios+less的全家桶后台管理框架

    项目技术栈 node10.15.3 + react@16.12.0 + redux@3.7.2 + react-router@3.2.0 + ...- [√] axios异步请求跨域的设置 - [√] 实时的webpack包大小预览,方便优化 - [√] draftjs编辑器 - [√]cypress自动化测试 ```

    Java通过jQuery实现ajax异步请求

    本示例工程"Java通过jQuery实现ajax异步请求"着重展示了如何利用jQuery的AJAX功能与后端Java服务器进行数据通信,从而实现页面的无刷新更新。以下将详细解释这个过程中涉及的关键知识点。 首先,jQuery是一个强大的...

    Ajax异步请求简单示例

    本示例将展示如何使用Ajax进行简单的异步请求。 首先,我们需要了解Ajax的工作流程。Ajax请求通常包含以下步骤: 1. **创建XMLHttpRequest对象**:这是所有Ajax操作的基础。在现代浏览器中,我们可以直接创建`...

    解决ajax跨域请求问题

    然而,跨域请求是Ajax的一个常见问题,由于浏览器的同源策略限制,Ajax请求只能向与当前页面同源的服务器发送。本文将深入探讨如何解决Ajax跨域请求的问题。 首先,理解“同源策略”是解决问题的关键。同源策略是...

    ajax跨域请求demo.zip

    jQuery的`$.ajax()`方法是进行异步请求的主要工具。在这个示例中,它可能包含以下关键配置: 1. `type`: 指定请求类型,通常是'GET'或'POST'。 2. `url`: 需要请求的服务器端接口地址。 3. `dataType`: 预期的...

    ExtJs异步请求和特殊用途

    在ExtJS中,异步请求(通常指的是Ajax请求)是实现动态数据加载、用户界面更新等关键功能的基础。Ajax框架允许开发者在不刷新整个页面的情况下与服务器进行通信,从而提供更流畅的用户体验。 1. **异步请求原理**:...

    ajax跨域请求WebService.asmx

    总结,Ajax跨域请求WebService.asmx是一个结合了前端JavaScript异步请求技术和后端C# Web服务交互的实例,它涉及到了跨域策略、HTTP通信、CORS配置以及JSON数据交换等多个Web开发的重要知识点。正确理解和运用这些...

    ajax处理跨域请求

    然而,随着互联网应用的发展,数据交互的需求日益增多,跨域请求成为一种常见的需求。AJAX(Asynchronous JavaScript and XML)技术允许我们在后台与服务器进行异步数据交换,而无需刷新整个页面。当使用AJAX进行...

    原生JavaScrpit中异步请求Ajax实现方法

    在前端页面开发的过程中,经常使用到Ajax...JavaScript实现Ajax异步请求 简单的ajax请求实现 Ajax请求的原理是创建一个XMLHttpRequest对象,使用这个对象来进行异步发送请求,具体实现参考下面代码: function ajax

    html通过 ajax jsonp跨域请求接收和传送数据

    它利用JavaScript创建异步HTTP请求,使得网页可以与服务器进行通信,从而实现数据的动态加载和更新。 **JSONP** JSONP(JSON with Padding)是一种解决跨域问题的非标准方法,主要用于JSON数据的获取。JSON是一种轻...

    详解Vuejs2.0之异步跨域请求

    在本文中,主要讨论了Vuejs2.0环境下如何处理异步跨域请求。Vuejs是现代前端开发中使用极为广泛的一个JavaScript框架,其2.0版本相较于1.0版本有了较大的变化。其中,HTTP请求的推荐方式也发生了改变,不再推荐使用...

    jquery下异步提交表单 异步跨域提交表单

    在使用jQuery处理表单提交时,异步提交和跨域提交是常见的需求,本篇文章将详细介绍如何利用jQuery实现这两种表单提交方式。 ### jQuery下异步提交表单 异步提交表单指的是在不刷新页面的情况下,通过JavaScript...

    Ajax 跨域异步传输

    总的来说,Ajax跨域异步传输是现代Web开发中的重要技术,JSONP提供了一种简单的方法来解决跨域问题,但仅限于GET请求。对于更复杂的跨域需求,开发者应当考虑使用CORS,它提供了更广泛的支持,包括POST和其他HTTP...

    原生JavaScript实现Ajax异步请求

    在前端页面开发的过程中,经常使用到Ajax...JavaScript实现Ajax异步请求 简单的ajax请求实现 Ajax请求的原理是创建一个XMLHttpRequest对象,使用这个对象来进行异步发送请求,具体实现参考下面代码: function ajax

Global site tag (gtag.js) - Google Analytics