好几年没有搞过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">
<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>
看一下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>
还是红色部分,与之前的红色部分代码都多了../的相对父级路径标识,ok问题解决了
希望这段记录能够帮到,该问题困扰的你