作为一名 Java 开发工程师 ，你一定在实际开发中遇到过需要构建网页应用、后台管理系统、电商平台、企业级 Web 服务 等场景。这时，B/S 架构（Browser/Server） 就成为你必须掌握的核心架构模式之一。
B/S 架构是一种浏览器-服务器架构模式 ，客户端通过浏览器发起 HTTP 请求，服务器处理请求并返回 HTML 页面或 JSON 数据。Java 提供了完整的 Web 开发体系（如 Servlet、JSP、Spring Boot、Tomcat 等），可以轻松实现 B/S 架构的 Web 系统。
本文将带你全面掌握：
- 什么是 B/S 架构？
- B/S 与 C/S 架构的区别
- Java Web 开发的核心技术栈（Servlet、JSP、Spring Boot）
- HTTP 协议基础与请求/响应模型
- MVC 架构在 B/S 中的应用
- 实战：搭建 Spring Boot Web 应用、RESTful API 接口、前后端分离项目
- 常见误区与最佳实践
并通过丰富的代码示例和真实项目场景讲解，帮助你写出更高效、更安全、结构更清晰的 B/S 架构代码。
🧱 一、什么是 B/S 架构？
✅ B/S 架构（Browser/Server Architecture）定义：
B/S 架构是一种浏览器-服务器架构模式，客户端通过浏览器发起 HTTP 请求，服务器处理请求并返回 HTML 页面或 JSON 数据。
✅ B/S 架构特点：
| 特点 |
描述 |
| 客户端统一 |
所有客户端都是浏览器 |
| 无需安装客户端 |
用户只需访问 URL 即可使用 |
| 依赖 HTTP 协议 |
通信基于 HTTP/HTTPS 协议 |
| 前后端分离趋势 |
前端使用 Vue、React，后端提供 API |
| 部署维护简单 |
所有更新都在服务器端完成 |
| 可跨平台访问 |
支持 PC、移动端、平板等多平台 |
| 安全性依赖 HTTPS、Token 等机制 |
保障通信安全 |
🔍 二、B/S 与 C/S 架构的区别
| 对比项 |
B/S 架构 |
C/S 架构 |
| 客户端类型 |
浏览器 |
桌面程序、移动端 |
| 通信协议 |
HTTP/HTTPS |
TCP/UDP、自定义协议 |
| 安装部署 |
无需安装客户端 |
需要安装客户端 |
| 维护成本 |
低（只需更新服务端） |
稍高（需更新客户端） |
| 网络依赖 |
强 |
一般较低 |
| 安全性 |
依赖 HTTPS、Token、Session |
可定制加密、认证机制 |
| 适用场景 |
网站、管理系统、电商平台等 |
游戏、企业软件、远程控制等 |
🧠 三、Java 实现 B/S 架构的核心技术栈
✅ 1. Java Web 开发基础
| 技术 |
说明 |
| Servlet |
Java 编写的服务器端程序，处理 HTTP 请求 |
| JSP |
Java Server Pages，用于动态生成 HTML 页面 |
| Filter |
过滤器，用于拦截请求，如登录验证 |
| Listener |
监听器，监听 Web 应用生命周期事件 |
| Session/Cookie |
用户会话管理机制 |
✅ 2. Spring Boot（现代 Java Web 开发主流框架）
| 技术 |
说明 |
| Spring MVC |
MVC 架构，处理 Web 请求 |
| Spring Boot |
快速构建 Web 应用，自动配置 |
| Spring Data JPA |
ORM 框架，简化数据库操作 |
| Spring Security |
权限控制、登录认证 |
| Spring WebFlux |
支持响应式编程和非阻塞 I/O |
✅ 3. 常用 Web 容器 / 服务器
| 容器 |
说明 |
| Tomcat |
轻量级 Web 容器，适合中小型项目 |
| Jetty |
更轻量，适合嵌入式部署 |
| Undertow |
高性能非阻塞容器，适合微服务 |
| JBoss/WildFly |
企业级 Java EE 容器 |
🧪 四、HTTP 协议基础与请求/响应模型
✅ HTTP 请求结构：
复制代码
GET /index.html HTTP/1.1
Host: www.example.com
User-Agent: Mozilla/5.0
Accept: text/html
✅ HTTP 响应结构：
复制代码
HTTP/1.1 200 OK
Content-Type: text/html
Content-Length: 1234
<html>...</html>
✅ 常见 HTTP 方法：
| 方法 |
描述 |
| GET |
获取资源（幂等） |
| POST |
提交数据（非幂等） |
| PUT |
更新资源（幂等） |
| DELETE |
删除资源（幂等） |
| PATCH |
局部更新资源 |
✅ 常见状态码：
| 状态码 |
含义 |
| 200 |
成功 |
| 302 |
重定向 |
| 400 |
请求错误 |
| 401 |
未授权 |
| 403 |
禁止访问 |
| 404 |
资源不存在 |
| 500 |
服务器内部错误 |
🧩 五、MVC 架构在 B/S 中的应用
✅ MVC 模式组成：
| 层级 |
说明 |
| Model（模型） |
数据对象，如 User、Product |
| View（视图） |
页面展示，如 HTML、Thymeleaf 模板 |
| Controller（控制器） |
处理请求，调用模型并返回视图 |
✅ 示例代码（Spring Boot）：
复制代码
@RestController
public class UserController {
@GetMapping("/users")
public List<User> getAllUsers() {
return userService.findAll();
}
}
🧪 六、B/S 架构实战应用场景
场景1：Spring Boot 构建 RESTful API
复制代码
@RestController
@RequestMapping("/api/users")
public class UserRestController {
@Autowired
private UserService userService;
@GetMapping("/{id}")
public ResponseEntity<User> getUserById(@PathVariable Long id) {
return ResponseEntity.ok(userService.findById(id));
}
@PostMapping
public ResponseEntity<User> createUser(@RequestBody User user) {
return ResponseEntity.status(HttpStatus.CREATED).body(userService.save(user));
}
}
场景2：前后端分离项目（Vue + Spring Boot）
复制代码
// Vue 前端调用示例
axios.get('/api/users')
.then(response => {
this.users = response.data;
});
// Spring Boot 后端返回 JSON 数据
@RestController
@RequestMapping("/api/users")
public class UserRestController {
// ...
}
场景3：用户登录认证（Spring Security）
复制代码
@Configuration
@EnableWebSecurity
public class SecurityConfig {
@Bean
public SecurityFilterChain filterChain(HttpSecurity http) throws Exception {
http
.authorizeRequests()
.antMatchers("/public/**").permitAll()
.anyRequest().authenticated()
.and()
.formLogin()
.loginPage("/login")
.defaultSuccessUrl("/home")
.permitAll()
.and()
.logout()
.permitAll();
return http.build();
}
}
🧱 七、B/S 架构最佳实践
| 实践 |
描述 |
| 使用 Spring Boot 快速启动项目 |
提升开发效率 |
| 使用 RESTful API 设计规范 |
提高接口可读性和一致性 |
| 使用前后端分离架构 |
前端用 Vue/React，后端提供 JSON 接口 |
| 使用 Token（如 JWT）进行认证 |
替代传统的 Session 管理 |
| 使用数据库连接池（如 HikariCP） |
提高数据库访问效率 |
| 使用日志记录请求与响应 |
方便排查问题 |
| 使用异常处理机制 |
统一返回错误信息，如 @ControllerAdvice |
| 使用 Swagger 生成 API 文档 |
提高接口可维护性 |
| 使用缓存（如 Redis）提升性能 |
减少数据库压力 |
| 使用 HTTPS 保障通信安全 |
防止数据泄露 |
🚫 八、常见误区与注意事项
| 误区 |
正确做法 |
| 不使用 RESTful 风格 |
应统一使用 /api/users 这类结构 |
| 不处理异常 |
应使用 @ControllerAdvice 全局处理异常 |
| 不使用 Token 认证 |
应使用 JWT 或 OAuth2 实现无状态认证 |
| 不使用日志记录 |
应记录请求日志、错误日志 |
| 不使用连接池 |
应使用 HikariCP 提高数据库性能 |
| 不使用缓存 |
应使用 Redis 缓存高频访问数据 |
| 不使用 Swagger |
应生成 API 文档便于前后端协作 |
| 不使用 HTTPS |
生产环境必须启用 HTTPS |
| 不使用跨域处理 |
前后端分离时应配置 CORS |
| 不使用 DTO 转换 |
应避免直接暴露数据库实体类 |
📊 九、总结：Java B/S 架构核心知识点一览表
| 内容 |
说明 |
| B/S 架构定义 |
浏览器-服务器通信模型 |
| 架构特点 |
浏览器访问、无需安装客户端、依赖 HTTP |
| Java 技术栈 |
Servlet、JSP、Spring Boot、Tomcat |
| HTTP 协议 |
请求/响应模型、状态码、方法 |
| MVC 架构 |
Model、View、Controller 分层开发 |
| 实际应用 |
管理系统、电商平台、RESTful API |
| 最佳实践 |
RESTful API、前后端分离、Token 认证 |
| 注意事项 |
日志记录、异常处理、HTTPS、缓存使用 |
📎 十、附录：Java B/S 架构常用技巧速查表
| 技巧 |
示例 |
| 创建 Spring Boot 项目 |
使用 Spring Initializr 或 IDEA 插件 |
| 定义 RESTful API |
使用 @RestController + @RequestMapping |
| 使用 Swagger 生成文档 |
使用 springdoc-openapi 或 Swagger UI |
| 使用 Token 认证 |
使用 JWT 或 Spring Security OAuth2 |
| 使用日志记录 |
使用 @Slf4j + log.info() |
| 使用数据库连接池 |
使用 HikariCP |
| 使用缓存 |
使用 Spring Data Redis |
| 使用跨域配置 |
使用 @CrossOrigin 或全局配置 |
| 使用 DTO 转换 |
使用 MapStruct 或手动封装 |
| 使用 HTTPS |
配置 SSL 证书、启用 HTTPS |
欢迎点赞、收藏、转发，也欢迎留言交流你在实际项目中遇到的 B/S 架构相关问题。我们下期再见 👋
📌 关注我，获取更多Java核心技术深度解析！