解决的是访问资源时,使用相对路径的去访问的。
使用相对路径来解决, 一个非常重要的规则:页面所有的相对路径,在默认情况下,都会参考当前浏览器地址栏的路径 http://ip:port/工程名/ + 资源来进行跳转。所以我们可以直接这样写
a.html中访问my.css时,需要先往上两级到web,然后再往下两级到my.css。比较麻烦。
解决方案:base 标签
示例:
a.html:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>a.html</title>
</head>
<body>
<h1>这是 a.html</h1>
<a href="d1/d2/b.html">跳转到/d1/d2/b.html</a>
<br/><br/>
<a href="servlet03">转发到/d1/d2/b.html</a>
</body>
</html>
b.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>b.html</title>
<!-- 老韩解读
1. 如果没有<base href="http://localhost:10000/hspedu_servlet/">
2. 当点击 返回 a.html 超链接,将会以当前浏览器的地址为路径来确定 路径
3. 如果增加了<base href="http://localhost:10000/hspedu_servlet/">
4. 将以 base 指定的 href 的地址为路径,来确定 超链接的路径
-->
<!--<base href="http://localhost:10000/hspedu_servlet/">-->
<!--简写形式-->
<!-- 1. base 标签是哪个在解析? => 浏览器-->
<!-- 2. 浏览器在解析 第一个 / 目标,会解析成 http://localhost:8080/ -->
<!-- 3. 浏览器 href="/webpath/" => 解析为=> href="http://localhost:8080/webpath/"-->
<!-- 4. 浏览器 <a href="a.html">返回a.html</a>,参考 base => 解析 href="http://localhost:8080/webpath/a.html"-->
<base href="/WebPath/">
</head>
<body>
<h1>这是/d1/d2/b.html</h1>
<a href="../../a.html">通过向上返回两级../../a.html返回 a.html~ (注意! 这时html中不能有base标签!)</a><br/>
<a href="a.html">通过base来返回a.html, 此时href是a.html</a>
</body>
</html>
点击 <a href="servlet03">转发到/d1/d2/b.html</a>
转到servlet03上,然后通过servlet03上进行请求转发,转发到/d1/d2/b.html
servlet03.java:
@WebServlet(urlPatterns = "/servlet03")
public class Servlet03 extends HttpServlet {
/*
* 通过在服务端 请求转发 的方式转到另一个页面。
* 1. 在服务器端, 解析第一个 / 时, 会被解析为 http://ip:port/application context
* 2. /d1/d2/b.html 会被解析成 => http://ip:port/项目名/d1/d2/b.html
* */
@Override
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
System.out.println("Servlet03....");
request.getRequestDispatcher("/d1/d2/b.html").forward(request, response);
}
@Override
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
doGet(request, response);
}
}
在浏览器端解析时,没有application context(就是相当于项目名),在服务端解析时,是有application context的。
提交login登陆界面,通过直接提交或者servlet请求转发的方式到用户界面,然后用户界面可以返回到登陆界面。
login.html 登陆界面
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>登陆界面</title>
</head>
<body>
<!--
请写出 login.html 在不通过Servlet转发情况下, 如何 通过表单提交, 找到 user.html, 把所有的写法列出来
1. 完整的url http://localhost:8080/webpath/views/user/user.html
2. 使用相对路径 action="views/user/user.html" => 使用当前浏览器的 地址栏 ip:port/工程路径/ + ...
3. action="/webpath/views/user/user.html"
浏览器对第一个 / 进行解析 为 http://localhost:8080/ + webpath/views/user/user.html
同样是一个完整url
4. 这里老师提一句: 我们使用服务器渲染技术,可以动态得到 /工程路径 , 后面再说
-->
<form action="Servlet_login"> <!--action="views/user/user.html"-->
u2 <input type="text"><br/>
<button type="submit">提交</button>
</form>
</body>
</html>
Servlet_login.java
@WebServlet(urlPatterns = "/Servlet_login")
public class Servlet_login extends HttpServlet {
@Override
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
System.out.println("Servlet_login被调用。。。。");
// 使用请求转发转到到user.html
request.getRequestDispatcher("/views/user/user.html").forward(request, response);
}
@Override
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
doGet(request, response);
}
}
user.html 用户界面
<!DOCTYPE html>
<html lang="en">
<head>
<metZ`a charset="UTF-8">
<title>用户界面</title>
<base href="http://localhost:8080/WebPath/">
</head>
<body>
<h1>用户界面</h1>
<a href="login.html">点击返回登陆</a>
</body>
</html>
Web 工程的相对路径和绝对路径
● 相对路径是:
● .表示当前目录
● …表示上一级目录
● 资源名 表示当前目录/资源名
● 绝对路径: http://ip:port/工程路径/资源路径
在实际开发中,路径都使用绝对路径,而不是相对路径
在 web 中 / 斜杠 如果被浏览器解析,得到的地址是:http://ip[域名]:port/比如: < ahref=“/”>斜杠< /a>
在 web 中 / 斜杠 如果被服务器解析,得到的地址是:http://ip[域名]:port/工程路径/,你也可以理解成 /工程路径/ 下面的几种情况就是如此:
● /servelturl
● servletContext.getRealPath(“/”); ==> 是得到执行路径/工作路径
● request.getRequestDispatcher(“/”);
在 javaWeb 中 路径最后带 / 和 不带 / 含义不同, 一定要小心,比如 < a href=“/a/servlet03”>网址< /a> : servlet03 表示资源, < a href=“/a/servlet03/”>网址< /a> : servlet03 表示路径
特别说明:重定向 response.sendRediect(“/”); 这条语句虽然是在服务器执行的,但是,
服务器是把斜杠 / 发送给浏览器解析。因此得到地址 http://ip[域名]:port/ (没有项目名)
老韩小结: 在编写资源路径时: , 考虑这么几点:
(1) 这个路径 前面有没有 /
(2) 这个路径 在哪里被解析 [服务器还是浏览器] , 如果前面有 / , 并且是在 浏览器被解
析的 被解析成 http://ip:port/ , 如果在服务器端被解析 , 被解析成 /工程路径/
(3) 如果这个路径,前面没有 / , 并且在浏览器被解析,则以浏览器当前的地址栏 去掉
资源部分,作为一个相对路径. (4) 这个路径,最后有没有 / , 如果最后有/ 表示路径, 如果没有 / 表示资源
以重定向方式提交表单, 将login.html 提交到servlet, 然后通过servlet重定向到views/user/user.html
login.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>登陆界面</title>
</head>
<body>
<!--
请写出 login.html 在不通过Servlet转发情况下, 如何 通过表单提交, 找到 user.html, 把所有的写法列出来
1. 完整的url http://localhost:8080/webpath/views/user/user.html
2. 使用相对路径 action="views/user/user.html" => 使用当前浏览器的 地址栏 ip:port/工程路径/ + ...
3. action="/webpath/views/user/user.html"
浏览器对第一个 / 进行解析 为 http://localhost:8080/ + webpath/views/user/user.html
同样是一个完整url
4. 这里老师提一句: 我们使用服务器渲染技术,可以动态得到 /工程路径 , 后面再说
-->
<form action="Servlet_SendRedirct"> <!--action="views/user/user.html"--> <!--action="Servlet_Dispatch" 表示请求转发方式转到views/user/user.html-->
u2