平时做技术实践时，很多问题不是概念不会，而是细节没串起来。拿“webform采用ajax访问后端接口的两种做法小结”来说，它看着像小点，放到项目里常会牵出环境、配置、兼容性和维护成本。下面按实际采用顺序，把思路、关键写法和容易踩坑的地方讲清楚，便于大家直接对照操作。
第一种方法：ajax前后端交互，前端采用这种传参方式：JSON.stringify({obj:JSON.stringify(json_obj)})，而后端采用这种接参方式：public static string mymethod(string obj)，注意前后端参数的名称必须相同。
function login() {
var username_str = $("#username").textbox("getValue");
var pwd_str = $("#password").textbox("getValue");
if (username_str != "" && pwd_str != "") {
var json_obj = {
username: username_str,
password: pwd_str,
};
$.ajax({
type: "POST",
url: "login.aspx/mymethod",
contentType: "application/json; charset=utf-8",
dataType: "json",
data: JSON.stringify({obj:JSON.stringify(json_obj)}),//传递 JSON 对象，注意参数名需要与 WebMethod 中的一致
success: function (result) {
var json_result_data = JSON.parse(result.d);
},
error: function (error) {
console.log(error);
}
});
}
}/// <summary>
/// 登录方法
/// </summary>
/// <param name="loginJsonObj">含有用户名和密码的json对象字符串</param>
/// <returns></returns>
[WebMethod]
public static string mymethod(string obj)
{
JObject data = new JObject(
new JProperty("jg", false)
);
// 解码 Base64 并将 JSON 字符串转换为对象
LoginInfo jsonObj = JsonConvert.DeserializeObject<LoginInfo>(obj);
string username_str = jsonObj.username.Trim();
string password_str = jsonObj.password.Trim();
string sqlstr = "select * from userinfo where username=@UserName";
// 创建参数集合
SqlParameter[] parameters = {
new SqlParameter("@UserName", username_str),
};
DataTable userInfo_dt = SqlHelper.ExecuteDataTable(sqlstr, parameters);
if (userInfo_dt != null && userInfo_dt.Rows.Count > 0)
{
if (password_str.Equals(userInfo_dt.Rows[0]["password"].ToString().Trim()))
{
data["jg"] = true;
}
}
return data.ToString();
}
第二种方法：ajax前后端交互，前端采用这种传参方式：data: JSON.stringify(json_obj)，而后端采用用这种接参方式:public static string login_method(string username,string password),参数名必须与json对象中的名称相同。
function login_2() {
var username_str = $("#username").textbox("getValue");
var pwd_str = $("#password").textbox("getValue");
if (username_str != "" && pwd_str != "") {
var json_obj = {
username: username_str,
password: pwd_str,
};
$.ajax({
type: "POST",
url: "login.aspx/login_method",
contentType: "application/json; charset=utf-8",
dataType: "json",
data: JSON.stringify(json_obj),//传递 JSON 对象，注意参数名需要与 WebMethod 中的一致
success: function (result) {
var json_result_data = JSON.parse(result.d);
},
error: function (error) {
console.log(error);
}
});
}
}
/// <summary>
/// 登录方法
/// </summary>
/// <param name="loginJsonObj">含有用户名和密码的json对象字符串</param>
/// <returns></returns>
[WebMethod]
public static string login_method(string username,string password)
{
JObject data = new JObject(
new JProperty("jg", false)
);
string sqlstr = "select * from usertb where username=@UserName";
// 创建参数集合
SqlParameter[] parameters = {
new SqlParameter("@UserName", username),
};
DataTable userInfo_dt = SqlHelper.ExecuteDataTable(sqlstr, parameters);
if (userInfo_dt != null && userInfo_dt.Rows.Count > 0)
{
if (password.Equals(userInfo_dt.Rows[0]["password"].ToString().Trim()))
{
data["jg"] = true;
}
}
return data.ToString();
}
到此这篇关于webform采用ajax访问后端接口的两种方法的文章就介绍到这了,更多相关webform采用ajax访问后端接口内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多兼容脚本之家！
您可能感兴趣的文章:
- 编写轻量ajax组件01-与webform平台上的各种实现方法比较
- Ajax Throws Sys.WebForms.PageRequestManagerErrorException with Response.Redirect的解决方法
- 让AJAX不依赖后端接口实现方案