使用ajax进行前后端交互的方法

使用ajax进行前后端交互的方法:(我只测试通了json对象作为参数的方式,其他方式我没有测试通过)

1、前端方法:

传参方式:POST

请求类型:json对象

响应类型:json对象

csharp 复制代码
 function test() {
            var param1Value = "Hello";
            var param2Value = "World";

            // 构建发送给服务器的JSON对象
            var jsonobj = {
                param1: param1Value,
                param2: param2Value
            };
            $.ajax({
                type: "POST",//传参方式
                url: "test01.aspx/tt",  // 这里根据你的WebMethod路径进行修改
                data: JSON.stringify(jsonobj), //请求类型,将对象序列化为JSON字符串后传递到后端
                contentType: "application/json; charset=utf-8",
                dataType: "json", //响应类型
                success: function (data) {
                    // 请求成功的回调函数
                    // data是服务器返回的JSON对象
                    console.log(data);
                },
                error: function (error) {
                    // 请求失败的回调函数
                    console.error(error);
                }
            });
        }

2、后端方法:无需创建一个类来接收前端传来的json字符串,需要注意是:使用的接收参数必须与前端定义的json对象中的键名要一致。

csharp 复制代码
 [WebMethod]
        [ScriptMethod(ResponseFormat = ResponseFormat.Json)]
        public static string tt(string param1, string param2)
        {
            //后端创建json对象
            var resultObject = new
            {
                Message = "Success",
                Data = new
                {
                    Param1Result = param1.ToUpper(),
                    Param2Result = param2.ToLower(),
                    SomeOtherData = "Hello from server!"
                }
            };

            // 将对象序列化为JSON字符串并返回
            return Newtonsoft.Json.JsonConvert.SerializeObject(resultObject);
        }
相关推荐
weixin_382395234 小时前
为小工厂量身打造:本地部署的物料管理系统带缺料计算
前端·制造
__zRainy__5 小时前
解决pnpm v10+不自动构建
前端·pnpm·工程化
猫猫不是喵喵.5 小时前
Vue3 Props 属性
前端·javascript·vue.js
醉城夜风~6 小时前
CSS元素显示模式(display)
前端·css
AI大模型-小华7 小时前
Codex 三方充值快速入门指南
java·前端·数据库·chatgpt·ai编程·codex·chatgpt pro
做前端的娜娜子9 小时前
同一链接实现 PC Web 与移动 H5 自适应
前端·掘金·金石计划
小帅不太帅9 小时前
架构没变、规模没变,DeepSeek V4 Flash 正式版凭什么暴涨 47 分?
前端·aigc·deepseek
jarvisuni10 小时前
DeepSeekFlash前端依旧拉垮,而且变慢了很多!
前端·javascript·算法
卷福同学11 小时前
AI编程出海第二步:验证关键词能否做站
前端·人工智能·后端