ssm + ajax过程中遇到的问题

最新推荐文章于 2021-08-05 13:38:08 发布

mateer

最新推荐文章于 2021-08-05 13:38:08 发布

阅读量3.2k

点赞数

文章标签： ajax html5 url

本文链接：https://blog.csdn.net/mateer/article/details/49909773

版权

好几年没有搞过web项目了，最近公司要搞个web项目，于是采用了ssm+ajax+html5，问题不少先记个比较经典的问题吧

问题1：html文件中的静态资源无法访问（下面红色标记的部分无法访问）

问题2：ajax代码的url部分无法访问（下面红色标记的部分无法访问）

看一下html文件

<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title>SignUp Form</title>
<script type="text/javascript" src="js/jquery-1.7.1.js"></script>
<script type="text/javascript" src="js/jquery.formvalidation.js"></script>
<link href="css/Form.css" rel="stylesheet">

看一下web.xml的DispatcherServlet的映射

<servlet-mapping>
<servlet-name>springMVC</servlet-name>
<url-pattern>/</url-pattern>
</servlet-mapping>

嗯，很经典的设置，设置全部拦截。

再看一下springMVC的静态资源配置项

<mvc:resources mapping="/img/**" location="/img/" />
<mvc:resources mapping="/js/**" location="/js/" />
<mvc:resources mapping="/css/**" location="/css/" />
<mvc:resources mapping="/html/**" location="/html/" />

也是很经典的设置

controller代码：

@Controller
@RequestMapping("/user")
public class UserController {

@RequestMapping("/testUser")
public void testUser(HttpServletRequest request, HttpServletResponse response) {

//方法内容

｝

一切没有什么特别的，但是会出现上述两个问题（这个问题好像很多人遇到，也有很多解答）

上网各种找答案，一遍又一遍的试...... 没有结果

看来网上的答案对我的这个问题没有什么实质性的帮助，自己来吧

打开浏览器的调试功能看看问题出在什么地方？看一下截图

这是第一个问题的截图：not found 没有找到，也就是被服务器过滤了请求。为什么在springMVC静态资源配置里设置了那么多的项还会被过滤了呢？？？

不急看一下第二个问题的截图

也是not found 没有找到，这是为什么呢？？？

答案揭晓：

眼尖的同学可能已经发现了，每个请求中都有，我在代码里没有加html啊怎么会突然多了呢？

想了一下明白了，我的页面是在目录html里存放着的，所以每个请求中都有了 /html/ 。这回好改了把/html/去掉就可以了

怎么改？这个很简单就是把相对路径给全就ok了，看一下修改后的页面代码

<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title>SignUp Form</title>
<script type="text/javascript" src="../js/jquery-1.7.1.js"></script>
<script type="text/javascript" src="../js/jquery.formvalidation.js"></script>
<link href="../css/Form.css" rel="stylesheet">

<script type="text/javascript">
function ajax() {
$.ajax({
//要用post方式
type : "POST",
//方法所在页面和方法名
url : "../user/testUser",
success : function(data) {
//返回的数据用data.d获取内容
alert(data.d);
},
error : function(err) {
alert(err);
}
});
//禁用按钮的提交
return false;
}
</script>
</head>