Ajax的前后台封装

Posted wangsoft

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了Ajax的前后台封装相关的知识,希望对你有一定的参考价值。

1.get传值(同步)

function ajaxHandler(className, functionName, data, successFunc, errorFunc) {
var path = getRootPath();
var Para = "?className=" + className + "&functionName=" + functionName + "&ran=" + new Date().getUTCMilliseconds();
$.ajax({
type: "GET",
url: path + "/Handler/HandlerAll.ashx" + Para,
data: data,
success: function (datd) {
successFunc(datd);
},
error: function () {
if (arguments.length == 5) {
errorFunc();
}
}
});
}

2.post传值(同步)

function ajaxPostHandler(className, functionName, data, successFunc, errorFunc) {
var path = getRootPath();
var Para = "?className=" + className + "&functionName=" + functionName + "&ran=" + new Date().getUTCMilliseconds();
$.ajax({
type: "POST",
url: path + "/Handler/HandlerAll.ashx" + Para,
data: data,
success: function (datd) {
successFunc(datd);
},
error: function () {
if (arguments.length == 5) {
errorFunc();
}
}
});
}

3.post传值(异步)

function ajaxPostHandlersync(className, functionName, data, successFunc, errorFunc) {
var path = getRootPath();
var Para = "?className=" + className + "&functionName=" + functionName + "&ran=" + new Date().getUTCMilliseconds();
$.ajax({
type: "POST",
async: false,
url: path + "/Handler/HandlerAll.ashx" + Para,
data: data,
success: function (datd) {
successFunc(datd);
},
error: function () {
if (arguments.length == 5) {
errorFunc();
}
}
});
}

4.get传值(异步)
function ajaxHandlerasync(className, functionName, data, successFunc, errorFunc) {
var path = getRootPath();
var Para = "?className=" + className + "&functionName=" + functionName + "&ran=" + new Date().getUTCMilliseconds();
$.ajax({
type: "GET",
async: false,
url: path + "/Handler/HandlerAll.ashx" + Para,
data: data,
success: function (datd) {
successFunc(datd);
},
error: function () {
if (arguments.length == 5) {
errorFunc();
}
}
});
}

 

后台:

public override void Process_Request(HttpContext context)
{
string functionName = context.Request.QueryString["functionName"];
string ClassName = context.Request.QueryString["className"];
Type type = Type.GetType(ClassName);
if (functionName.Trim() != string.Empty)
{
List<object> objList = new List<object>();
objList.Add(context);
string postdata = context.Request.Form["$postdata$"];
if (!String.IsNullOrEmpty(postdata))
{
string encode = context.Request.QueryString.Get("encode");
if (encode == "b")
{
postdata = Public.ToStringFromBase64(postdata);
}
dynamic DynamicObject = ConvertJson(postdata);
objList.Add(DynamicObject);
}
type.GetMethod(functionName).Invoke(null, objList.ToArray());
}
}

public dynamic ConvertJson(string json)
{
//javascriptSerializer jss = new JavaScriptSerializer();
//jss.RegisterConverters(new JavaScriptConverter[] { new DynamicJsonConverter() });
//dynamic dy = jss.Deserialize(json, typeof(object)) as dynamic;


var serializer = new JavaScriptSerializer();
serializer.RegisterConverters(new[] { new DynamicJsonConverter() });
dynamic dy = serializer.Deserialize(json, typeof(object));
return dy;
}

 

以上是关于Ajax的前后台封装的主要内容,如果未能解决你的问题,请参考以下文章

前后端交互之封装Ajax+SpringMVC源码分析

React后台管理系统-ajax请求封装

前后台交互ajax请求模块

(十四)硅谷外卖前端部分-前后台交互 ajax

2017.11.30 Reat前后端数据交互之Button提交数据处理(ajax方法单独封装成API,不用Form)

前后分离模型之封装 Api 调用