Web软件与B/S架构

元信息

• 目标：建立 Web 软件的形态体感——部署在服务器、运行在浏览器、更新即时可见；理解 B/S 架构对 C/S 的标准化改造及其优劣取舍
• 关键概念：B/S架构、C/S架构、中间层、Web服务器、HTTP协议、渲染
• 关联阶段：cp1
• 常见误区：把 B/S 与 C/S 当作并列的两种架构（B/S 实为 C/S 的特殊形式）；把浏览器的权限限制当作缺陷（它是刻意的安全模型）

体验

wordpress的安装与使用 XAMPP 教程

几种软件的运行依赖

单机软件notepad	网络软件tightvnc	Web软件wordpress<br/>
notepad.exe	服务端tvnserver.exe<br/>客户端tvnviewr.exe	服务端：apache、wordpress（php应用）<br/>客户端：chrome、wordpress（html/css/javascript应用）<br/>

浏览器/服务器(Browser/Server) 架构

浏览器/服务器(Browser/Server) ，简称B/S架构，是C/S架构的一种特殊形式，特点就是将部分C/S通用功能进行了标准化，并提供了基本的实现，相当于在C/S架构之间插入了一个公共中间层

B/S架构的优势：使用者角度

• 开放、互联、共享：Web软件所使用的html/css/javacsript等技术都采用开放、公有、开源的规范，广泛兼容各种硬件平台、操作系统，比如Web的特色功能：链接和跳转
• 安全：所有的Web软件都运行于浏览器之中，而浏览器有严格的权限限制，不可以访问磁盘、内存等
• 易用：无需安装，持续升级，即开即用

B/S架构的优势：开发者角度

• 开发效率高
  • 前端：Web浏览器之前，省去了网络连接、操作系统兼容、HTTP解析等等工作，采用简单的前端脚本语言即可开发网络应用
  • 后端：Web服务器之 后，同样省去了网络连接、操作系统兼容、HTTP解析等等工作，采用简单的后端脚本语言即可开发网络应用
• 扩展性好：所有协议都是开放、公有、开源，易于接入、定制和扩展

B/S架构的劣势

• 运行性能差：由于浏览器、服务器等中间层需要广泛兼容各个平台和系统，导致运行性能不高
• 功能集受限：由于浏览器的安全模型，不能直接访问硬件及系统资源，部分功能无法实现

B/S架构的基本工作流程

• Web服务器：如apache、nginx、iis等。 接收浏览器的HTTP请求，将系统资源发送给客户端。系统资源包括磁盘文件、后端脚本或应用、系统调用等等
• HTTP协议： 是WEB服务器与浏览器之间进行数据交换和任务协同的一组数据格式和交互规范，是一个公共协议。
• Web浏览器： 如chrome、firefox、edge等。将用户操作转化为HTTP请求，发送给服务端，接收响应，对返回的页面数据进行解析、执行和渲染

什么是渲染？ 譬如编辑 index.html中的内容为'<h1>Hello World</h1>', 很容易发现浏览器里显示的只有'hello world'，没有'<h1>'等字符，但显示的文本字体明显变大了