django 后台与前端js数据交互对ajax封装_前端怎么传数据给django后端-优快云博客

本文介绍了一种使用JS发起AJAX请求调用Django后端服务的方法，包括前端定义业务模型、封装请求方法及后端配置。通过具体实例展示了如何实现前后端分离的应用场景。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1、首先定义一个js数组，对业务逻辑进行分类，如二手电子市场来说，有二手单车模块、二手电器模块、二手书籍模块等。

var models = [
    { modelName:"bicycleApi",remoteUrl:'/remote/bicycleApi/'},
    { modelName:"equipmentApi",remoteUrl:'/remote/equipmentApi/'}
   ]

2、js封闭ajax方法

(function($){
    var remote = china.nameSpace("remote");
    
    var models = window.models || [];
    
    for (var i = 0; i < remoteUrls.length; i++) {
        var modelName = models[i]['modelName'];
        var remoteUrl = models[i]['remoteUrl'];
        var initRemoteClass = function(modelName, remoteUrl) {
            remote[viewName] = {};

            remote[viewName].c = function(method, params, dataType, async) {
                if ( typeof params == 'undefined') params = {};
                if (!dataType) { dataType = "json";  }
                if(async !== false){async = true}
                
                var _params = $.toJSON( typeof params === "function" ? params() : params);
                var url = remoteUrl + method + '/';
                return $.ajax({
                    url : url,
                    type : "POST",
                    async : async,
                    data : {
                        params : _params
                    },
                    dataType : dataType
                });
            };

            remote[viewName].rc = function(method, params) {
                if ( typeof params == 'undefined')
                    params = {};
                var url = remoteUrl + method + '/';
                var readConfig = {
                    url : url,
                    type : 'post',
                    dataType : "json",
                    data : {
                        params : typeof (params) == 'function' ? function() {
                            return $.toJSON(params())
                        } : $.toJSON(params)
                    }
                }

                return readConfig;
            };

        };

        initRemoteClass(modelName, remoteUrl);
    }

})(jQuery);

3、在django urls.py里添加如下配置

import json 
apiClasses = [
        bicycleApi,
        equipmentApi
    ]

def getApiClasses(clsName):
    for apiCls in apiClasses:
        if apiCls.__name__ == clsName:
            return apiCls
    return None

def _loadParams(request, pname):
    q = request.REQUEST.get(pname, "{}")
    q = json.loads(q)
    return q


def remoteView(request, apiClsName, methodName):
    cls = getApiClasses(apiClsName)
    if not cls:raise Exception("Can't find remote api class [%s]" % apiClsName)
    
    if cls and hasattr(cls, methodName):
        params = _loadParams(request, 'params')
        inst = cls()
        inst.request = request
        m = getattr(inst, methodName)
        params = dict([[str(k), v] for k, v in params.items()])
        rs = m(**params)
        return HttpResponse(json.dumps(rs))
    
    raise Exception("Can't find remote method[%s] with api class [%s]" % (methodName, apiClsName))

urlpatterns = patterns('',
    (r'^remote/(?P<apiClsName>\w*)/(?P<methodName>[a-zA-Z]+\w*)/', remoteView)
    )

bicycleApi类实现业务逻辑，如：

#coding=utf-8

class bicycleApi(object):
    def getAllBicycleS(money=None):
       pass

4、然后
bicycleApi、equipmentApi 实现后台逻辑

5、这样子后，js代码编写如下代码就只可以远程调用后台方法了

china.remote.bicycleApi.c("getAllBicycles", {money:30} ).success(function(msg){

})

《完》