个人名片
作者简介:java领域优质创作者
个人主页:码农阿豪
工作室:新空间代码工作室(提供各种软件服务)
个人邮箱:[[email protected]]
个人微信:15279484656
个人导航网站:www.forff.top
座右铭:总有人要赢。为什么不能是我呢?
码农阿豪系列专栏导航
面试专栏:收集了java相关高频面试题,面试实战总结️
Spring5系列专栏:整理了Spring5重要知识点与实战演练,有案例可直接使用
Redis专栏:Redis从零到一学习分享,经验总结,案例实战
全栈系列专栏:海纳百川有容乃大,可能你想要的东西里面都有
在软件开发中,架构设计是决定系统性能、扩展性和维护性的核心因素之一。B/S(Browser/Server)和C/S(Client/Server)作为两种经典架构模式,各有其适用场景与局限性。本文将从技术原理、开发实践、代码示例等多维度对比这两种架构,帮助开发者在实际项目中做出合理选择。
B/S架构基于浏览器与服务器的交互模式,用户通过浏览器访问服务器资源,所有业务逻辑和数据处理集中在服务器端。典型的应用包括Web邮箱、在线文档编辑工具等。
核心特点:
C/S架构通过独立的客户端程序与服务器通信,客户端负责部分计算和界面渲染,服务器负责核心数据处理。常见于游戏、企业级桌面应用等场景。
核心特点:
B/S架构:
const express = require('express');
const app = express();
app.get('/', (req, res) => res.send('Hello B/S World!'));
app.listen(3000, () => console.log('Server running on port 3000'));
C/S架构:
# 假设客户端程序为client_app.exe
import os
os.system('client_app.exe /silent') # 静默安装客户端
B/S架构:
DOCTYPE html>
<html>
<body>
<h1>B/S跨平台页面h1>
<button onclick="alert('兼容所有浏览器!')">点击测试button>
body>
html>
C/S架构:
// 使用条件编译区分平台
#if WINDOWS
Console.WriteLine("Windows客户端启动...");
#elif LINUX
Console.WriteLine("Linux客户端启动...");
#endif
B/S架构:
// WebSocket实时通信示例
const socket = new WebSocket('ws://localhost:8080');
socket.onmessage = (event) => console.log('收到数据:', event.data);
C/S架构:
// 客户端本地计算排序
void sortData(std::vector<int>& data) {
std::sort(data.begin(), data.end());
}
B/S架构:
const sanitizeHtml = require('sanitize-html');
const clean = sanitizeHtml(userInput); // 清理用户输入
C/S架构:
// ProGuard混淆配置示例
-keep public class com.example.Main {
public static void main(java.lang.String[]);
}
// 服务器端(Node.js + Socket.IO)
const io = require('socket.io')(3000);
io.on('connection', (socket) => {
socket.on('message', (msg) => io.emit('message', msg));
});
// 客户端(HTML + JavaScript)
<script src="/socket.io/socket.io.js"></script>
<script>
const socket = io('http://localhost:3000');
socket.on('message', (msg) => console.log('收到消息:', msg));
</script>
# 服务器端(Python Socket)
import socket
s = socket.socket()
s.bind(('localhost', 12345))
s.listen(5)
conn, addr = s.accept()
conn.sendfile(open('server_file.txt', 'rb'))
# 客户端(Python)
import socket
s = socket.socket()
s.connect(('localhost', 12345))
with open('client_file.txt', 'wb') as f:
f.write(s.recv(1024))
场景 | 推荐架构 | 理由 |
---|---|---|
跨平台Web应用 | B/S | 无需安装,天然支持多终端 |
高性能本地计算(如游戏) | C/S | 客户端分担计算任务,响应更快 |
快速迭代的轻量级应用 | B/S | 维护成本低,更新即时生效 |
高安全性内部系统 | C/S | 专用协议加密,减少暴露在公网的风险 |
现代系统常采用混合模式(如Electron、PWA)结合两者优势:
// Electron主进程代码
const { app, BrowserWindow } = require('electron');
app.whenReady().then(() => {
const win = new BrowserWindow();
win.loadFile('index.html');
});
B/S与C/S架构并非对立,而是互补。开发者需根据业务需求、团队技术栈和运维成本综合决策。随着云原生和边缘计算的普及,未来架构可能进一步融合,但理解这两种经典模式仍是技术选型的基石。