day01【后台】搭建环境/47-尚硅谷-尚筹网-环境搭建-表述层-Ajax-发送数组-方案一

我们下边要考虑的这个问题呢。就是。写代码咱们实际的来用一下啊，这些东西我们实际的来用一下，特别是这个request body。Response body相对还比较简单，就给一个Java类型，它就直接返回就解散了。Request body呢？嗯。这个首先有一个问题，就是我为啥非得要要用它。我不用它，我也一样能够把这个数据发送给这个服务器端。所以说我们去看一下相关的这个场景啊。Request body这个注解的这个使用。这个时候我们就得去写写这个GS代码了哈，写GS代码了。嗯。还是在我们这个index里边哈，咱们去写一些个这个测试的代码。

哎。就index里边咱们来个按钮啊。对。忽然间想起来，我们要是写Ajax的话，咱们得整个解query进来。啊，咱们肯定就不用原生GS去写这个写写aja啊，那那那几个就就郁闷了哈。那个事儿就不不那么容易办了。嗯。咱们这样哈，就是。哎，不是这个圆形里面。原型里边这儿有这个解块位啊，反正将来我们原型这些页面也都要拿进来，这些个样式文件也都要拿进来，咱们暂时咱们先别的不管，咱们先把这个解块先拿进来。就是他。CTRLC。嗯。把这目录拿过来。

CTRLC哈。然后呢，我们想要去把它给引入进来。引入进来呢，需要使用script标签。爱爱伤心。你看这个标签也是一个带路径的标签，这个路径呢，其实也需要参照这个base，它也要放到贝斯的这个后面。哎，然后呢，往下是jary。下边儿是去找他。所以在这哈，这个我们需要去引入一下这个j query。嗯。引入解块位，哎。

然后呢，这个下一步。哎，就是说这个在我们页面上写这个script的标签。然后呢，我们去给这个按钮绑定，单击小函数啊，这个按钮呢，我们来一个啊test。Request body。我想想啊，我们设定一个场景哈，我们得有一个需求来给大家解释为什么要用这个，我们发一个数组。我们要发这样一个数组的数据呢，到服务器端，所以说呢，我们大家看一下啊，有三种不同的方案。嗯，这个是我们叫send。这个数组啊，然后是第一个发。所以这是我们第一个按钮，来一个IDB TN。

哎，先写解块核心函数里边传一个function式，在倒元素绘制完成以后再来执行这个function式啊，就是我你就当是一个固定的套路绑定，单击响函数井号BTN1。点click。里边再传个方式。传这个方式，然后呢，我们去提交一下啊，不是我们想要去把这个数组的数据发送给服务器，那么我们写这个Ajax请求哈。我们做AX请求，这个时候有这么几种方法。啊，有这个有dollar.get。哎，有这个dollar.post。然后呢，还有一个Dollar a X。这个时候我们说啊，这两个都得是服务器端成功处理了请求以后才能够去。

去去调回调函数做后续的操作啊，但是这个只有到点AX可以在服务器端处理失败以后。他俩都得是想象状态码200，他呢是想要状态码不是200啊，你400呀，404呀什么的，他也能处理啊，所以说在这哎，咱们考虑情况周到一点，咱们使用这个到点HX这个函数。那么它里边呢？呃，用接对象的形式呢，给他传一些个参数，这个参数呢，首先是一个UR地址。这个UR地址呢。也是哈，也是我们去参照这个贝斯标签，然后呢，比如说我们这来一个test。叫做一个send AR啊，我们要发送一个数组到服务器端。嗯。然后呢，它返回的数据。我们现在是要测试这个发送数据，咱们先不考虑这个返回的啊，不考虑返回的，所以说他一会儿就让他还是返回一个简单的文本啊，返回一个success就行了。

嗯，这是UR地址，然后type呢，是请求的方式，用post的方式。哎，然后呢，这个data是我们要发送的数据。我们提前把这个数组哈。就放这儿吧。五。色啊，随便来几个数。然后还有一个。嗯，Data type。这个是什么呢？服务器端返回的数据的格式，比如说我们这时候服务器端呢，呃，就返回个返回，应该这么说，服务器端返回的数据我们如何去解析啊，就把它当做普通的文本。然后呢，Success。服务极端。这个响应成功的话，走走这这response。

A是服务器端处理失败。咱们来注释一下啊，这个是，嗯。请求目标资源的地址。哎，然后是这个我们的请求方式。哎，这个是我们，嗯，要发送的请求。呃，数据啊，其实是这是我们请求参数哈。这是请求参数。然后这个是。如何对待服务器端返回的数据？需要注意的是，服务器端返回什么，浏览器端是控制不了的。

就好比说你去饭馆点菜啊。你你这个这个后厨呢，他怎么给你做这个，你是控制不了的。你能控制的是你怎么去对待人家给你端上来的菜。你是坐着吃还是站着吃？你是这个躺着吃还是倒立着吃是吧，这个是你自己能控制的，但是人家给你炒出来是什么样就什么样，这个你控制不了啊，我们这儿也是服务器端返回啥。哎，你根据服务器端返回的格式呢，按照这个格式去解析，但是它返回啥，这个其实你是控制不了的啊，这个得看服务器端的实际的情况。这个success这呢，这个是。嗯，服务器端成功处理请求后调用的回调函数。哎，下一个是服务器端。失败处理请求。这么说比较别扭哈，应该叫服务器端呢，处理请求失败。

哎，这就比较顺啊，要回答函数response response就是响应题啊。是这个响应体数据。哎，我们这儿呢，咱们就把这个response呢，咱们就alert一下就得了。好，这是我们前端的这个j query这个代码，哎，但是现在还不能用，我们得先再去写一下这个后端的这个代码。我想想啊。对，这个不能直接这么放在这儿。这个是得给它起个名。这个得给它起个名，这个比如说呢，我们就叫做一个，呃。这叫做一个。

那么这就请求参数的名字。哎，然后下边呢，我们去写一下这个handle的方法。找到我们这个ter。这个地址叫这个。呃，这个叫taste。那个服那个浏览器端叫send，这边就是receive了。And receiver。这个是第一种方案。嗯。这边接收的话呢，我们去来一个request per。

我们想接受这个。而瑞。哎，然后呢，这边来一个list。里边放个呃，放个眼贴，其实也可以哈。一会儿呢，我们就能看到，这是我们的一厢情愿。嗯，这就跟他没关系了啊，咱们拿到这个呢，咱们去打印一下。假设叫number哈。这个咱们只是纯粹是看一下这个语法。这也是返回一个target。来，咱们跑一下试试啊。看看会不会很惊悚？

那F12。我点。诶，这边返回的是个OB答案。然后呢，这边你看他400了。哎，400了，看这个哈。这边非常残酷的给我们返回了一个错误。这边他说required list，哎，我必须的list类型的参数，Array is not present。没有提供。我就觉得。非常的崩溃，我明明是给你传了这个参数啊。你居然说没有。啊，我明明给你了，你居然说没有啊，你让我情何以堪。哎，那么我们看一下啊。那么我们下边就到这个请求，请求的这些消消息头请求体的这个地方，Hads这个地方呢，具体看一看它是怎么发过去的。看最下边这哈。

看最下边这。嗯，这个问题就出在这儿。他这个请求参数的名字固然是二位。但是呢，浏览器应该不是浏览器是j query，他不知道哪根筋抽了哈，他在这个名字的后边呢，加了一个方括号。然后呢，这就导致我们发送请求参数的名字是这个。而我们接收的时候呢，是这个。那这两个名字不匹配，那当然那你想要的是这个，他发的是这个，他就接收不到了。所以这个就让我们很无语啊，这时候我们只能怎么办呢？我们在这儿呢，也加一个分号。等一会他服务器会重新加载。这是一个很郁闷的事。

哎，这个重新加载完了，我们再。重新发一下这个请求。哦，对了，对，这边是返回一个页面哈。不过我们主要看的不是它啊，返回的页面是这个啊。呃，我们现在呢，这个时候其实就这个数据呢，就发过去了。对，我这儿应该。对，我这应该其实是应该这么写哈。Success，然后这边呢，来个response保底哈，这个怪物哈。哎，我们这边呢，你看这几个数，这也能够打印出来。也就是说呢，现在这种方式去发这个数据，发这个数组哈。发这个数组，你接收呢，得用这个名去接收。你你在解宽代码这儿，明明没有带这方括号，你这边呢，还就偏偏就得带这方括号，哪天你把这事忘了，你觉得诶这两边咋不一致呢，哎，你把这就删了。

把这发括号一删了，他就又又接收不到了。这个就很闹腾啊，这个就很闹腾。所以说呢，好像看着这个数组挺简单的，但是把它发到服务器端还还得这个动动脑筋。爱动动脑筋。这个事挺麻烦啊，所以这第一种方案呢，我们觉得其实并不是很理想。嗯。发送数组到服务器端。这个方案一。嗯，咱们说这个是一部分是解块的代码。然后呢，这一部分是我们的handle德代码。

哎，这个最大的问题就是说这个handle德这边代码，它得多写一组括号。啊，这个是让我们觉得很闹腾的。哎，这个它的缺陷哈。就是说handler方法中接收。数据时。哎，需要在请求。参数名字后面多写。一组这个方括号。这是我们觉得这个方案不满意的一个原因。