Ajax发送POST请求的心路历程
好多年前就在项目中用ajax实现了页面部分数据的发送,当时用的是GET方法。
这次用POST方法实现同样的功能,竟然花费了不少的时间!
① 关于JQuery ajax的配置项说明
url : 请求的url。
type : http请求消息的方法,例如get,post等。
contentType : http请求消息的数据类型,例如json,text,xml等。
dataType : http响应消息的数据类型,可以不配置。
配置请求数据类型为:
contentType: "application/json;charset=utf-8",额……问题来了。
② 415 Unsupported Media Type
这是响应的错误码,直译就是不支持的媒体类型。既然是服务器响应的,那就是说服务器不支持媒体类型。
我配置的数据类型为json,用的Spring MVC,那就是需要增加Spring的json数据支持。
查询对比了一下,发现jackson库是JSON封装解析效率比较高,开发比较活跃的库。
③ 下载jackson库
从好几个mvn仓库中下载的版本竟然是错误的,弄的我差点开始怀疑人生。
最后还是从官网连接的仓库中下载了正确的版本。
理论上除了导入jackson库,还需要适当的配置让Spring支持JSON解析。
但是一个<context:annotation-config />配置就自动的完成了相关配置。
省事了,也会让人有些疑惑。凡事没有绝对吧。
④ 400 Bad Request
新的错误来了,服务器响应“坏的请求”。
服务器的报错信息如下:Unrecognized token 'name': was expecting ('true', 'false' or 'null')
从浏览器抓包如下:
Request Payload
name=test&passwd=
找到原因了,就是说服务器根据请求消息携带的媒体类型json做好了解析JSON数据的准备,然而找不到相关的数据键,因为事实上浏览器发出去的请求确实不是JSON格式的数据啊。
我是这么填写的数据:
data : {'name':'test','passwd':'123456'},
就是说这么写看起来是JSON格式,事实上不是。那就明确一下数据格式吧,改动如下:
data : JSON.stringify({'name':'test','passwd':''}),
哈哈,终于前后台打通了~~~~
⑤ 完整的JS代码如下,友情提示:纸上得来终觉浅,绝知此事要躬行。
$(document).ready(function() {
$("#submitBtn").click(function(e) {
e.preventDefault();
var obj = $(this);
var name = $("input[name='loginname']").val();
var passwd = $("input[name='loginpasswd']").val();
$.ajax({
url : "http://localhost:8080/star/loginCheck/",
type : "POST",
contentType: "application/json;charset=utf-8",
data : JSON.stringify({'name':name,'passwd':passwd}),
dataType : "text",
success : function(result) {
if (result == "success") {
obj.parents('form').submit();
} else {
}
},
error:function(msg){
$(".notice").html('Error:'+msg);
}
})
return false;
})
});
</script>
后记:
想让返回数据类型更加丰富,修改dataType为“json”。
结果发现无法跳转到success的回调函数。
既然不能调用success,那就看error回调函数吧:
Error:SyntaxError: JSON.parse: unexpected character at line column of the JSON data
最终原因如下:因为服务器返回的数据格式不是标准json,所以无法进入success。
Ajax发送POST请求的心路历程的更多相关文章
- Ajax发送Post请求
Ajax发送post请求与发送get请求大致类似.以下看详细实例.首先看JSP显示页面: <form action="servlet/LoginServlet" method ...
- 使用Ajax发送http请求(get&post请求)
本文最初发表于博客园,并在GitHub上持续更新前端的系列文章.欢迎在GitHub上关注我,一起入门和进阶前端. 以下是正文. 同步和异步 同步和异步的概念 同步:必须等待前面的任务完成,才能继续后面 ...
- AJAX发送PUT请求引发的血案
如果直接发送ajax=put形式的请求 是拿不到请求体中的数据的. Tomcat: 1.将请求体中的数据,封装一个map ...
- AJAX的来龙去脉(由来)-如何被封装出来的--ajax发送异步请求(四步操作)
<黑马程序员_超全面的JavaWeb视频教程vedio\JavaWeb视频教程_day23_ajax> \JavaWeb视频教程_day23_ajax\day23ajax_avi\14.打 ...
- Ajax发送POST请求对数据的封装
Ajax发送POST请求把数据到后端后,后端收到数据并解析出来 示列一: Ajax发送请求,这里主要是发送一个数组的数据类型到后端,如果没有先把数组进行格式化成字符串的话,后端就收了就是一个字符串类型 ...
- 原生JS实现ajax 发送post请求
1. [代码]原生JS实现ajax 发送post请求 <script> var oStr = ''; var postData = {}; var oAjax = null; //post ...
- IT兄弟连 JavaWeb教程 使用AJAX发送POST请求并获取响应
POST请求用于向服务器发送应该被保存的数据,因此POST请求天然比GET请求多需要一份需要被保存的数据.那么这些数据应该放在何处呢?毕竟,我们的open()方法接收的三个参数都没有合适的位置. 答案 ...
- IT兄弟连 JavaWeb教程 使用AJAX发送GET请求并获取响应
GET请求用于获取数据,有时候我们需要获取的数据需要通过"查询参数"进行定位,在这种情况下,我们会将查询参数追加到URL的末尾,令服务器解析. 使用Ajax发送GET请求非常简单, ...
- Ajax发送XML请求案例
Ajax发送XML请求需求: 根据输入的国家,输出这些国家下面的城市. 如果请求参数较多,而且请求参数的结构关系复杂,则可以考虑发送XML请求.XML请求的实质还是POST请求,只是在发送请求的客户端 ...
随机推荐
- linux下的网络配置
临时生效的命令: 设置静态ip: ip addr add 192.168.1.2/24 dev eth0 设置网关: ip route add default via 192.168.1.1 启动某个 ...
- 【sinatra】结合Padrino framework
用Sinatra来做复杂的Web应用时,会出现若干个比较麻烦的点. 要手工作成一个个的应用骨架.作成test .view.public目录等等 将Sinatra DSL集中在一个类中的话,画面数量增加 ...
- Writable、WritableComparable和comparators
hadoop的序列化格式 hadoop自身的序列化存储格式就是实现了Writable接口的类,他只实现了前面两点,压缩和快速.但是不容易扩展,也不跨语言. 我们先来看下Writable接口,Writa ...
- 文字处理控件TX Text Control X10独家揭秘(一):数据源自动处理
TX Text Control即将发布的X10版本,将升级重点还是放到了其比较优势的流式布局报表设计和生成上.慧都获得了来自其开发商Text Control GmbH公司的一手资料,迫不及待的为大家带 ...
- OC基础数据类型-NSData
1.NSData,数据,当我们需要把一些信息写入到文件里或发送到网络上,我们需要把这些数据转换下,变成纯粹的0.1字符流 1 NSString * str = @"hello, world! ...
- Python字符界面函数库
curses ncurses prettytable from prettytable import PrettyTable row = PrettyTable() row.field_names = ...
- python 购物车和三级菜单
程序:购物车程序 需求: 启动程序后,让用户输入工资,然后打印商品列表 允许用户根据商品编号购买商品 用户选择商品后,检测余额是否够,够就直接扣款,不够就提醒 可随时退出,退出时,打印已购买商品和余额 ...
- ACM题目————小A的计算器
Description 以往的操作系统内部的数据表示都是二进制方式,小A新写了一个操作系统,系统内部的数据表示为26进制,其中0-25分别由a-z表示. 现在小A要在这个操作系统上实现一个计算器,这 ...
- [团队项目]SCRUM项目5.0
5.0--------------------------------------------------- 1.团队成员完成自己认领的任务. 2.燃尽图:理解.设计并画出本次Sprint的燃尽图的理 ...
- class打包成exe方式
首先运行dos命令 jar -cvf **.jar *.class 把所有文件打包成jar包 用解压器打开jar包 打开meta-inf文件夹 打开用记事本打开main.mf文件 增加语句Main-C ...