首页 前端知识 解决jquery发送ajax请求失败

解决jquery发送ajax请求失败

2024-02-08 15:02:51 前端知识 前端哥 992 171 我要收藏

目录

  • jquery发送请求出现跨域问题解决
  • jquery post请求返回空值的结局

jquery发送请求出现跨域问题解决

在这里插入图片描述
上述是我在做注册做用户添加时侯的报错,注意这里做的时post请求,get请求作者没有产生跨域问题。
然后经过查了一些资料,大部分是说在前端通过一个回调去解决,但是尝试了很久,依旧没有效果。
然后我就采用了在后端添加拦截器的方式解决了问题。

  • 下面是我的工作目录
    在这里插入图片描述
  • 代码
package com.itheima.interceptor;
import org.springframework.http.HttpMethod;
import org.springframework.web.servlet.HandlerInterceptor;
import org.springframework.web.servlet.ModelAndView;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
public class CorsInterceptor implements HandlerInterceptor {
@Override
public boolean preHandle(HttpServletRequest request, HttpServletResponse response, Object handler) throws Exception {
//表示接受任意域名的请求,也可以指定域名
response.setHeader("Access-Control-Allow-Origin",request.getHeader("origin"));
//该字段可选,是个布尔值,表示是否可以携带cookie
response.setHeader("Access-Control-Allow-Credentials", "true");
response.setHeader("Access-Control-Allow-Methods", "GET, HEAD, POST, PUT,PATCH, DELETE, OPTIONS");
response.setHeader("Access-Control-Allow-Headers", "*");
if (HttpMethod.OPTIONS.toString().equals(request.getMethod())){
return true;
}
return true;
}
@Override
public void postHandle(HttpServletRequest request, HttpServletResponse response, Object handler, ModelAndView modelAndView) throws Exception {
}
@Override
public void afterCompletion(HttpServletRequest request, HttpServletResponse response, Object handler, Exception ex) throws Exception {
}
}
复制
package com.itheima.interceptor;
import org.springframework.context.annotation.Configuration;
import org.springframework.web.servlet.config.annotation.InterceptorRegistry;
import org.springframework.web.servlet.config.annotation.WebMvcConfigurer;
@Configuration
public class InterceptorConfig implements WebMvcConfigurer {
@Override
public void addInterceptors(InterceptorRegistry registry) {
/**
* 拦截全部路径,跨域放到最上面
*/
registry.addInterceptor(new CorsInterceptor()).addPathPatterns("/**");
//拦截哪些路径
WebMvcConfigurer.super.addInterceptors(registry);
}
}
复制

在解决了跨域问题后,又出现了一个问题,就是在我发送post请求后,给我返回了一个null值,那么对于这个问题我是下面这样解决的

jquery post请求返回空值的结局

  • 产生这种原因,无非就是没有采用正确的ajax请求方式,作者踩了很多坑,找到了一种可行的请求方式
$.ajax({
async: false,
cache: false,
type: 'POST',
url: 'http://localhost:92/personalInfo/b',
dataType: "json",
contentType: 'application/json', //第二步:定义格式
data: JSON.stringify(data), //第二步;把json转为String传递给后台
error: function () {
alert('请求失败 ');
},
success: function (data) {
console.log(data);
//alert(data);
}
});
复制
  • 重点关注一下上面7个参数,至于具体代表,大家自行查阅资料
转载请注明出处或者链接地址:https://www.qianduange.cn//article/1562.html
标签
ajax
评论
还可以输入200
共0条数据,当前/页
会员中心 联系我 留言建议 回顶部
复制成功!