day18-web工程路徑
web工程路徑
配置tomcat運行快捷鍵
tomcat啟動的默認快捷鍵時shift+f10，可以自定義配置：file-setting-keymap-搜索run，找到右邊寫有shift+f10的選項，右擊選擇add keyboard shortcut
直接按下自定義快捷鍵，會自動識別
如果自定義快捷鍵已經被映射了，選擇leave，不破壞原有的快捷鍵
- 工程路徑問題
我們之前寫表單的提交路徑都是寫的完整路徑，比較麻煩，有沒有一種方式，讓我們提交表單或者超鏈接的時候，顯得更加簡單呢？
1.工程路徑的解決方案
1.1方案一：相對路徑
說明：頁面所有的相對路徑，在默認情況下，都會參考當前瀏覽器地址欄的目錄（如：//ip:port/工程名/）加上請求的資源名來進行跳轉。即頁面內所有使用相對路徑的靜態資源和發出的請求都是以當前頁面的URL目錄為參考基準的。
所以我們可以這樣寫：
相對路徑缺點分析：
有時，我們當前頁面要請求的資源不在當前瀏覽器地址欄的URL目錄下，那麼要定位到該資源就需要使用類似於../../../ 這樣的形式去返回尋找資源。這樣做會使文件之間的關係變得複雜且難以理解。
例如：如果我們的tomcat的web文件夾下有如下目錄和文件：
a.html文件要引入my.css的參考路徑為../../css/mycss/my.css
使用相對路徑時，瀏覽器會在這個參考路徑前面加上當前地址欄的目錄來跳轉。
這樣子就會顯得非常繁瑣，文件之間的關係變得複雜。我們希望有一種方式可以通過自定義指定URL目錄（如ip:port/項目名/xyz/），來定位資源。
解決方案是：如果需要指定頁面相對路徑參考的路徑，可以使用base標籤來指定
base標籤可以設置當前頁面中所有相對路徑工作時，參照哪個路徑來進行跳轉
1.2方案二：base標籤
- base標籤基本介紹
-
base標籤是HTML語言中的基準網址標記，它是一個單標籤，位於網頁頭部文件的head標籤內
-
一個頁面最多只能使用一個base元素，用來提供一個指定的默認目標，是一種表達路徑和連接網址的標記
-
常見的URL路徑形式分別有絕對路徑和相對路徑，如果base標籤指定了目標，瀏覽器將通過這個目標來解析當前文檔中所有的相對路徑，包括的標籤有（a，img，link，form）
base標籤作用就是自定義參考標準的URL目錄，不再跟當前URL有關，對頁面內所有使用了相對路徑的靜態資源路徑和請求路徑都有效
-
也就是說，瀏覽器解析時會在路徑前加上base給的目錄，頁面中的相對路徑加上目錄後就會轉換成絕對路徑
-
使用了base標籤應帶上href標籤和target標籤
- base應用實例
現在有兩個文件，分別是a.html和b.html。a.html文件在web目錄下，b.html在web/d1/d2下
在a.html中引用b.html時，若使用相對路徑，參考路徑應為：d1/d2/b.html。原因是：當前URL地址欄的目錄是//localhost:8080/webpath/，加上相對路徑之後就可以定位到b.html文件
此時由於沒有使用base標籤，瀏覽器默認會在參考路徑前加上的是當前頁面的URL目錄
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>a.html</title>
</head>
<body>
<h1>這是a.html</h1>
<!--相對路徑
1.href="d1/d2/b.html" 這個相對路徑 等價於//localhost:8080/項目名/d1/d2/b.html
-->
<a href="d1/d2/b.html">跳轉到/d1/d2/b.html</a>
</body>
</html>
在b.html文件中引用a.html，若只是使用相對路徑，參考路徑應為：../../a.html。
但是如果我們使用base標籤，瀏覽器在參考路徑前加上的就是指定的URL目錄
這時若在base中指定URL目錄為//localhost:8080/webpath/，那麼參考路徑應為a.html。
ps: base標籤的寫法也可以簡化
<html lang="en">
<head>
<meta charset="UTF-8">
<title>b.html</title>
<!--使用base標籤解決
1.base href="//localhost:8080/webpath/"
表示的含義是當前頁面訪問的所有資源都是以這個路徑為參照的
（即訪問的所有資源寫的路徑前面都會加上這個路徑，再去請求資源）
-->
<!--<base href="//localhost:8080/webpath/">-->
<!--上面的寫法可以簡化為如下：-->
<base href="/webpath/">
<!--說明如下：
1.base標籤是瀏覽器去解析的
2.瀏覽器在解析第一個斜杠/的時候，會解析成//localhost:8080/
3.base href="/webpath/" =解析=> base href="//localhost:8080/webpath/"
4.而瀏覽器在解析 <a href="a.html">返回a.html~</a> 時，會參考base，最後是：
href="//localhost:8080/webpath/a.html
-->
</head>
<body>
<h1>這是/d1/d2/b.html</h1>
<!--
1.要返回a.html 使用相對路徑，//localhost:8080/webpath/d1/d2/
2. ../../a.html => //localhost:8080/webpath/a.html
3.相對路徑會讓這個項目相互調用的關係變得複雜
4.使用base標籤來解決
-->
<a href="a.html">返回a.html~</a>
</body>
</html>
.gif)
2.伺服器轉發定位資源
在實際開發中，往往不是直接訪問一個資源，而是在服務端進行轉發或者重定向來訪問資源
例子
使用上面的a.html和b.html文件。在a.html點擊超鏈接時，瀏覽器請求servlet03資源，由伺服器內部進行轉發來訪問b.html。
a.html:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>a.html</title>
</head>
<body>
<h1>這是a.html</h1>
<!--演示轉發定位b.html
1. href="servlet03"==瀏覽器解析==>//localhost:8080/webpath/servlet03
2.
-->
<a href="servlet03">由Servlet03 轉發到/d1/d2/b.html</a>
</body>
</html>
servlet03:
請求轉發的過程是發生在伺服器內部的，因此解析轉發的參考路徑的是伺服器。
package com.li.servlet;
import javax.servlet.*;
import javax.servlet.http.*;
import java.io.IOException;
public class Servlet03 extends HttpServlet {
@Override
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
doPost(request, response);
}
@Override
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
//這裡我們希望通過轉發來定位到b.html
/**
* 解讀：
* 1.伺服器端在解析第一個/時，會被解析成//ip:post/項目名
* （因為轉發是發生在服務端的，所以也可以理解為斜杠「/」 被解析成 「/項目名(工程路徑)」 ）
* 2. /d1/d2/b.html ==解析成=> //ip:post/項目名/d1/d2/b.html
*/
System.out.println("Servlet03進行轉發..");
request.getRequestDispatcher("/d1/d2/b.html").forward(request, response);
//如果沒有帶第一個斜杠 d1/d2/b.html，也可以轉發成功。
// 因為在伺服器進行轉發的時候，沒有/ 就按照默認的方式參考定位 //ip:post/項目名/
//但是建議帶上/
}
}
b.html不變。
後台輸出：
