首先,如果一直回调error的方法,可以先看看错误信息
error: function (XMLHttpRequest, textStatus, errorThrown) {
// 状态码
console.log(XMLHttpRequest.status);
// 状态
console.log(XMLHttpRequest.readyState);
// 错误信息
console.log(textStatus);
}
我所碰到的问题
1.URL问题
协议必须是http或者data等等,报错信息如下
Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https.
2.编码问题
servlet处理方法加上
resp.setContentType("text/html;charset=utf-8");
3.返回格式问题
java PrintWriter返回的内容格式必须和ajax的dataType格式对应
如dataType=“json”,那么PrintWriter就得返回json格式的字符串,jQuery会检测格式是否符合。
如果你只想返回一个字符串做做测试什么的,ajax写上dataType=”text"就行
ajax的dataType默认是json
预期服务器返回的数据类型。如果不指定,jQuery 将自动根据 HTTP 包 MIME 信息来智能判断,比如XML MIME类型就被识别为XML。在1.4中,JSON就会生成一个JavaScript对象,而script则会执行这个脚本。随后服务器端返回的数据会根据这个值解析后,传递给回调函数。可用值:
“xml”: 返回 XML 文档,可用 jQuery 处理。
“html”: 返回纯文本 HTML 信息;包含的script标签会在插入dom时执行。
“script”: 返回纯文本 JavaScript 代码。不会自动缓存结果。除非设置了"cache"参数。’’‘注意:’’'在远程请求时(不在同一个域下),所有POST请求都将转为GET请求。(因为将使用DOM的script标签来加载)
“json”: 返回 JSON 数据 。
“jsonp”: JSONP 格式。使用 JSONP 形式调用函数时,如 “myurl?callback=?” jQuery 将自动替换 ? 为正确的函数名,以执行回调函数。
“text”: 返回纯文本字符串
参考文档:
http://hemin.cn/jq/jQuery.ajax.html
4.最后附上我之前用于测试的代码
jsp
<%@page language="java" pageEncoding="UTF-8" %>
<html>
<head>
<title>ajax test</title>
<script src="https://cdn.bootcss.com/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/vue.js"></script>
</head>
<body>
<div id="app">
<input type="text" :value="msg">
<input type="button" @click="onButtonClick" value="戳我">
</div>
</body>
<script>
var vm = new Vue({
el:'#app',
data:{
msg:""
},
methods:{
onButtonClick(){
var that = this;
$.ajax({
type:"GET",
dataType:"text",
url:"http://localhost:8080/ajax",
success(msg){
that.msg = msg
},
error: function (XMLHttpRequest, textStatus, errorThrown) {
// 状态码
console.log(XMLHttpRequest.status);
// 状态
console.log(XMLHttpRequest.readyState);
// 错误信息
console.log(textStatus);
}
})
}
}
})
</script>
</html>
java servlet
package servlet;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;
import java.io.PrintWriter;
@WebServlet("/ajax")
public class AjaxTestServlet extends HttpServlet {
@Override
protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
resp.setContentType("text/html;charset=utf-8");
PrintWriter pw = resp.getWriter();
pw.println("啦啦啦");
pw.flush();
pw.close();
}
}