WEB工程路径

LiAng2023年11月15日大约 8 分钟约 1553 字

问题

创建 index.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>base 标签</title>
</head>
<body>
<h1>注册用户~~</h1>
<!--
    1. 可以看到，我们原来的访问一个web资源的路径非常的麻烦
    2. 目前我们访问的是 ok的资源
    3. 我们可以使用相对路径来解决
    4. http://localhost:8080/webpath/ok => ok
    5. 如果你action="ok" 等价 http://localhost:8080/webpath/ok
-->
<form action="http://localhost:8080/webpath/ok" method="post">
    u:　<input type="text" name="username"/><br><br>
    <input type="submit" value="注册用户"/>
</form>
<h1>讨论区~</h1>
<form action="http://localhost:8080/webpath/ok" method="post">
    讨论内容:　<textarea cols="50" rows="5"></textarea><br><br>
    <input type="submit" value="发布讨论"/>
</form>
<h1>回复区~</h1>
<form action="http://localhost:8080/webpath/ok" method="post">
    回复内容:　<textarea cols="50" rows="5"></textarea><br><br>
    <input type="submit" value="回复"/>
</form>
</body>
</html>

解决方案

相对路径

使用相对路径来解决，一个非常重要的规则：页面所有的相对路径，在默认情况下，都会参考当前浏览器地址栏的路径 http://ip:port/工程名/ + 资源来进行跳转。所以我们可以这样写：

<form action="ok" method="post">

base标签

基本介绍

base 标签是 HTML 语言中的基准网址标记，它是一个单标签，位于网页头部文件的 head 标签内。
一个页面最多只能使用一个 base 元素，用来提供一个指定的默认目标，是一种表达路径和连接网址的标记。
常见的 url 路径形式分别有相对路径与绝对路径，如果 base 标签指定了目标，浏览器将通过这个目标来解析当前文档中的所有相对路径，包括的标签有（a、img、link、form）。
也就是说，浏览器解析时会在路径前加上 base 给的目标，而页面中的相对路径也都转换成了绝对路径。使用了 base 标签就应带上 href 属性和 target 属性。

应用实例

创建 web\a.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>a.html</title>
</head>
<body>
<h1>这是a.html~~~~~</h1>
<!-- 相对路径
    href="d1/d2/b.html" 等价于 http://localhost:8080/项目名/d1/d2/b.html
-->
<a href="d1/d2/b.html">跳转到/d1/d2/b.html</a>
<br/><br/>
<!--
1. 在实际开发中，往往不是直接访问一个资源的而是在服务端进行转发或者重定向来访问资源
2. 演示转发定位 b.html
3. href="servlet03" http://localhost:8080/webpath/servlet03
-->
<a href="servlet03">转发到/d1/d2/b.html</a>
</body>
</html>

创建 web\d1\d2\b.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>b.html</title>
    <!--
        1. 如果没有<base href="http://localhost:8080/hspedu_servlet/">
        2. 当点击 返回a.html 超链接，将会以当前浏览器的地址为路径来确定 路径
        3. 如果增加了<base href="http://localhost:8080/hspedu_servlet/">
        4. 将以 base 指定的href的地址为路径，来确定 超链接的路径
    -->
    <!--<base href="http://localhost:10000/hspedu_servlet/">-->
    <!--简写形式-->
    <!--使用base 标签搞定
    1. 下面写的 base href="http://localhost:8080/webpath/"
    2. 表示的含义就是当前这个页面的访问所有资源都是以 http://localhost:8080/webpath/ 参照
    -->
    <!--<base href="http://localhost:8080/webpath/">-->
    <!--上面的写法可以简化一把-->
    <!--
        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>
<!--
    1. 返回a.html => 使用前面的相对路径http://localhost:8080/webpath/d1/d2/
    2. ../../a.html => http://localhost:8080/webpath/a.html
    3. 相对路径会让这个项目相互调用的关系变得复杂
    4. 使用base 标签搞定
-->
<!--<a href="../../a.html">返回a.html~</a>-->
<a href="a.html">返回a.html~</a>
</body>
</html>

创建 Serlvet03.java

package com.lzw.servlet;

import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;

/**
 * @author LiAng
 */
public class Servlet03 extends HttpServlet {
    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        //这里我们希望通过转发来定位b.html
        //1.在服务器端 解析第一个 / 时，会被解析成 http://ip:port/项目名
        //2. "/d1/d2/b.html" =>  被解析成 http://ip:port/项目名/d1/d2/b.html
        request.getRequestDispatcher("/d1/d2/b.html").forward(request, response);
        //3. 在服务器进行转发时，没有/就按照默认的方式参考定位 http://ip:port/项目名
        //建议使用上面的
        //request.getRequestDispatcher("d1/d2/b.html").forward(request, response);
    }

    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        doPost(request, response);
    }
}

注意事项和细节

Web 工程的相对路径和绝对路径

（1）相对路径：.表示当前目录，..表示上一级目录，资源名表示当前目录/资源名

（2）绝对路径：http://ip:port/工程路径/资源路径

在实际开发中，路径都使用绝对路径，而不是相对路径。
在 web 中 / 斜杠如果被浏览器解析，得到的地址是：http://ip[域名]:port/
比如: <a href="/">斜杠</a>
在 web 中 / 斜杠如果被服务器解析，得到的地址是：http://ip[域名]:port/工程路径/，你也可以理解成 /工程路径/ 下面的几种情况就是如此

(1) <url-pattern>/servelturl</url-pattern>
(2) servletContext.getRealPath("/"); ==> 是得到执行路径/工作路径
(3) 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) 这个路径最后有没有 / , 如果最后有/ 表示路径，如果没有 / 表示资源。