javaweb

1 什么是javaweb

用java技術(shù)來解決相關(guān) web互聯(lián)網(wǎng)領(lǐng)域的技術(shù)棧，使用 JAVAEE 技術(shù)體系開發(fā)企業(yè)級(jí)互聯(lián)網(wǎng)項(xiàng)目。

2 javaweb技術(shù)棧

1. 客戶端-前端部分：
   HTML CSS Bootstrap JavaScript Nodejs npm vite vue3 router pinia axios json jQuery element-plus

1：HTML 負(fù)責(zé)搭建網(wǎng)頁結(jié)構(gòu)，CSS 用于美化頁面樣式，Bootstrap 是前端框架可快速構(gòu)建界面；JavaScript 為網(wǎng)頁添加交互性，jQuery 是簡化 JS 操作的庫，VU3，ElementPlus 是 Vue3 的組件庫，它們共同打造出豐富多樣的前端頁面。
2：Node.js 是服務(wù)器端運(yùn)行環(huán)境，npm 是其包管理工具，Vite 是前端構(gòu)建工具能提升開發(fā)效率；Vue3 是流行的前端框架，Vue Router 用于實(shí)現(xiàn)路由功能，Pinia 是狀態(tài)管理庫，Axios 用于前后端數(shù)據(jù)交互，JSON 是數(shù)據(jù)交換格式，它們助力構(gòu)建功能強(qiáng)大的全棧應(yīng)用。

服務(wù)端-后端部分：
HTTP xml Tomcat Servlet Request Response Cookie Sesssion Filter Listener MySQL JDBC Druid Jackson lombok jwt maven Postman

1：HTTP 是用于傳輸超文本的協(xié)議，XML 可用于存儲(chǔ)和傳輸數(shù)據(jù)；Tomcat 是 Servlet 容器，Servlet 是 Java 編寫的服務(wù)器端程序，Request 和 Response 對(duì)象分別封裝客戶端請(qǐng)求和服務(wù)器響應(yīng)信息，它們構(gòu)成了 Web 通信和服務(wù)端處理的基礎(chǔ)。
2：Cookie 和 Session 用于管理用戶狀態(tài)，F(xiàn)ilter 可對(duì)請(qǐng)求和響應(yīng)進(jìn)行過濾處理，Listener 能監(jiān)聽 Servlet 容器的各種事件；MySQL 是常用的關(guān)系型數(shù)據(jù)庫，JDBC 是 Java 操作數(shù)據(jù)庫的接口，Druid 是數(shù)據(jù)庫連接池，Jackson 用于處理 JSON 數(shù)據(jù)，Lombok 簡化 Java 代碼，JWT 用于身份驗(yàn)證和授權(quán)，這些技術(shù)保障了 Web 應(yīng)用的狀態(tài)管理、數(shù)據(jù)存儲(chǔ)與安全。
3：Maven 是 Java 項(xiàng)目的管理和構(gòu)建工具，Postman 則是強(qiáng)大的 API 開發(fā)與測(cè)試工具，它們?yōu)?Java Web 項(xiàng)目的開發(fā)、管理和測(cè)試提供了便利。

3 javaweb交互模式

客戶端 請(qǐng)求 服務(wù)端 返回 客戶端

CS模式 客戶端和服務(wù)器端進(jìn)行通信

BS模式 瀏覽器端和服務(wù)器端進(jìn)行通信

4 前后端分離

1 開發(fā)分離：后端程序員只要按照接口文檔去編寫后端代碼，無需編寫或者關(guān)系前端代碼，前后端
程序員壓力都降低。
2 部署分離：前端使用單獨(dú)的頁面動(dòng)態(tài)技術(shù)，通過VUE等框架，工程化項(xiàng)目，前端項(xiàng)目可以部署到
獨(dú)立的服務(wù)器上。

5 前端部分

• 選擇前端框架：可以選用 Vue.js、React.js 或 Angular 等流行的前端框架。這些框架能夠幫助開發(fā)者高效地構(gòu)建用戶界面，實(shí)現(xiàn)組件化開發(fā)和數(shù)據(jù)綁定。例如，使用 Vue.js 時(shí)，可利用其組件化特性將頁面拆分成多個(gè)小的組件，便于維護(hù)和復(fù)用。
• 前端項(xiàng)目搭建：借助前端構(gòu)建工具（如 Vue CLI、Create React App 等）來快速搭建項(xiàng)目結(jié)構(gòu)。這些工具會(huì)自動(dòng)生成項(xiàng)目的基本目錄結(jié)構(gòu)和配置文件，開發(fā)者可以在此基礎(chǔ)上進(jìn)行開發(fā)。
• 前端開發(fā)：運(yùn)用 HTML、CSS 和 JavaScript 進(jìn)行頁面設(shè)計(jì)和交互邏輯的實(shí)現(xiàn)。前端開發(fā)者專注于用戶界面的呈現(xiàn)和交互效果，通過調(diào)用后端提供的 API 獲取數(shù)據(jù)并展示在頁面上。

6 后端部分

• 選擇后端框架：常見的 Java 后端框架有 Spring Boot、Spring MVC 等。Spring Boot 能夠簡化 Spring 應(yīng)用的開發(fā)和配置，快速搭建獨(dú)立的、生產(chǎn)級(jí)別的 Java 應(yīng)用。
• 后端項(xiàng)目搭建：使用 Maven 或 Gradle 等項(xiàng)目管理工具來管理項(xiàng)目的依賴和構(gòu)建。在項(xiàng)目中添加所需的依賴，如 Spring Boot Starter Web 等，以支持 Web 開發(fā)。
• 后端開發(fā)：編寫后端接口，處理業(yè)務(wù)邏輯和數(shù)據(jù)持久化。后端開發(fā)者使用 Java 語言和數(shù)據(jù)庫（如 MySQL、Oracle 等）來實(shí)現(xiàn)業(yè)務(wù)功能，并將數(shù)據(jù)以 JSON 或 XML 等格式返回給前端。

7 前后端交互

• API 設(shè)計(jì)：前后端開發(fā)者共同設(shè)計(jì) API 接口，明確接口的 URL、請(qǐng)求方法（GET、POST、PUT、DELETE 等）、請(qǐng)求參數(shù)和響應(yīng)格式。API 設(shè)計(jì)應(yīng)遵循 RESTful 風(fēng)格，使接口具有良好的可讀性和可維護(hù)性。

• 數(shù)據(jù)交互：前端通過 AJAX（Asynchronous JavaScript and XML）或 Fetch API 等技術(shù)異步調(diào)用后端 API，獲取數(shù)據(jù)并更新頁面。后端接收到請(qǐng)求后，處理業(yè)務(wù)邏輯并返回相應(yīng)的數(shù)據(jù)。例如，前端使用 Axios 庫發(fā)送 HTTP 請(qǐng)求：

• 跨域問題處理：由于前后端項(xiàng)目通常運(yùn)行在不同的域名或端口上，會(huì)出現(xiàn)跨域問題。可以在后端配置跨域請(qǐng)求的支持，如在 Spring Boot 中使用 @CrossOrigin 注解或配置跨域過濾器：

8 部署與測(cè)試

• 前端部署：將前端項(xiàng)目打包成靜態(tài)文件（如 HTML、CSS、JavaScript 等），并部署到靜態(tài)文件服務(wù)器（如 Nginx、Apache 等）上。
• 后端部署：將后端項(xiàng)目打包成可執(zhí)行的 JAR 或 WAR 文件，部署到應(yīng)用服務(wù)器（如 Tomcat、Jetty 等）上。
• 測(cè)試：進(jìn)行前后端的集成測(cè)試，確保前后端交互正常，業(yè)務(wù)功能能夠正確實(shí)現(xiàn)。可以使用 Postman 等工具對(duì)后端 API 進(jìn)行測(cè)試，使用瀏覽器或前端測(cè)試工具對(duì)前端頁面進(jìn)行測(cè)試。