1.1 基于B/S 结构的 Web 应用

本文涉及的产品
云原生数据库 PolarDB PostgreSQL 版,标准版 2核4GB 50GB
云原生数据库 PolarDB MySQL 版,通用型 2核4GB 50GB
简介: 1.1 基于B/S 结构的 Web 应用

1.1 基于B/S 结构的 Web 应用


     C/S架构也可以看作胖客户端架构。因为客户端需要实现绝大多数的业务逻辑和界面展示。在这种架构中,作为客户端的部分需要承受很大的压力,因为显示逻辑和事务处理都包含在其中,通过与数据库的交互(通常是SQL或存储过程的实现)来达到持久化数据,以此满足实际项目的需要。


     C/S架构的优点是安全性较好,而突出的缺点是开发和维护成本都比B/S高,而且客户端负载重。在2000年以前,C/S 架构占据了网络程序开发领域的主流。


     B/S架构是随着Internet技术的兴起,对C/S架构的一种变化或者改进的结构。在这种结构下,用户工作界面是通过WWW浏览器来实现的,极少部分事务逻辑在前端(Browser)实现,主要事务逻辑在服务器端(Server) 实现。


1.2 JDK安装与配置


     jdk 下载最新版本的JDK,这里是JDK8 jdk-8u371-windows-i586.exe),按默认安装路径进行JDK安装即可。


      设置环境变量如下:



1.3 服务器Tomcat下载与安装


TomCat下载 下载最新版本的Tomcat,这里下载的是tomcat-8.0.45的解压缩版本(apache-tomcat-8.0.45-windows-x86.zip),解压缩后,tomcat 根目录可改名为tomcat8,把tomcat8文件夹复制至D盘下(其他磁盘亦可)。


      tomcat8目录层次如图1-1所示,注意,目录名不能有中文和空格。目录介绍如下。


     (1) bin目录:二进制执行文件。其中最常用的文件是startup.bat, 如果是Linux或Mac系统,则启动文件为startup.sh.


     (2) conf 目录:配置目录。其中最核心的文件是server.xml,可以在其中修改端口号等。

默认端口号是8080,也就是说,此端口号不能被其他应用程序所占用。


     (3) lib目录: 库文件。lib目录为Tomcat运行时需要的JAR包所在的目录。


     (4) logs 目录:日志。


     (5) temp目录:临时产生的文件,即缓存。


     (6) webapps目录: Web 应用程序。Web应用放置到此目录下,浏览器可以直接访问。


     (7) work 目录:编译以后的class文件。


     在命令行窗口中进入D:\tomcat8\bin 目录,运行startup,启动Tomcat服务器。打开浏览器,在浏览器地址栏中输入http://ocalhost:8080,则进入如图1-2 所示页面,说明Tomcat安装成功。如果想关闭Tomcat服务器,在命令行窗口的D:\tomcat8\bin路径下输入shutdown,即可关闭Tomcat服务器。




1.4 Eclipse安装与使用


1.4.1 Eclipse 下载及创建Dynamic Web Project


      用户可以在http://www.eclipse.org/downloads/下载最新版本的Eelipse,注意是Java EE版。此处,使用的Eclipse版本为eclipse-jee-oxygen-3a-win32-x86_64.zip,详见本书教学资源包tools文件夹,解压缩后,双击eclipse.exe,选择工作区路径,如图1-3所示,便可打开Eclipse。



     在Eclipse中选择“File- →New→Proje+…“选项,在弹出的“New Project” 对话框中选择Web中的"Dynamic Web Project"节点,如图1-4所示。在弹出的“New Dynamic Web Project”对话框中,输入工程名“MyWeb”,如图1-5所示,得到MyWeb工程目录结构,如图1-6所示。





1.4.2 Eclipse 中的编码问题


在Windows 环境下,编译器默认编码方式并不是UTF-8,因为Eclipse插件不同,编码方式可能是GBK或其他。为了开发方便,一般将其设置为UTF-8,这样能更好地解决乱码问题,设置方式如下。


1. 改变整个工作空间的编码格式


     分别进行Eclipse->Window->Preferences->General->Workspace->Other->UTF-8->0K操作,如图1-7所示(汉化版: Eclipse->窗口-> 首选项>常规>工作空间->其他->UTF-8->确定操作)。



2. 项目范围的编码格式设置


     分别进行Project->Properties->General->Resource->Inherited from container(UTF-8)->OK操作,如图1-8所示。



3. 某类型文件的编码格式设置


     分别进行Eclipse >Window->Preferences- >General->Content Types->在右侧找到要修改的文件的类型(Java 等) ->在下面的Default encoding输入框中输入UTF-8->Update->OK操作。


      (汉化版:分别进行Eclipse->窗口->首选项>常规>内容类型->在右侧选择要修改的文件的类型->下面省略编码输入~>更新操作。)


      譬如,Java 文件的编码格式设置:选择“Window->Preferences…选项,弹出首选项对话框,在左侧导航树中找到General->Content Types,在右侧Context Types树中展开Text,选择“Java Source File”节点,在下面的“Default encoding"输入框中输入“UTF-8",单击“Update”按钮,即可设置Java文件编码为UTF-8,如图1-9所示。



     又如,JSP文件的编码格式设置:选择“Window->Preferences… .选项,弹出首选项对话框,在左侧导航树中找到Web->JSP Files, 在右侧的“ Encoding”下拉列表中选择“ISO10646/Unicode(UTF-8)",依次单击“Apply"和“OK"按钮,即可设置JSP文件编码为UTF-8,如图1-10所示。



4. 单个文件编码格式设置


     在包资源管理器中右击文件,选择属性选项,改变文本文件编码格式为UTF-8。(注意:改变编码格式前应做备份,另外,可以用编码格式批量转换工具处理.)


1.4.3 将Tomcat和Eclipse相关联


  1. 配置Server的Runtime Environments,添加Apache Tomcat v8.0

打开Eclipse, 选择“Window→Preferences"选项,再选择左侧Server 下的“RuntimeEnvironments”节点,如图1-11所示。



     单击“A…"按钮,添加Apache Tomcat v8.0,再配置其安装路径,单击“Finish” 按钮即可,如图1-12所示。




  1. 创建Server


     在Eclipse中,通过选择“Window→Show View→Servers”选项,进入“Servers"选项卡,如图1-13所示。



     单击图1-13中的超链接,弹出创建Server对话框,如图1-14所示,选择“Tomcat v8.0Server”;单击“Next"按钮后,再单击“Finish"按钮即可。此时进入如图1-15所示的界面,”得到已创建的"Tomcat v8.0 Server at localhost"。




1.4.4 Eclipse 自动部署项目到 Tomcat 的 webapps 目录


1. 对Server Locations和Server Options进行配置


     双击“Tomcat v8.0 Server at localhost",或在其上右击,在打开的快捷菜单中选择“Open”选项。在进入的界面中,对Server Locations和Server Options进行配置,如图1-16所示,保存设置即可。



     Server Locations的配置中有三处需做修改。


     (1)选中“Use Tomcat installation ( takes control of Tomcat installation)”单选按钮。


     (2)选中“Use Tomcat installation ( takes control of Tomcat installation)”单选按钮后, ServerPath自动修改为Tomcat8实际安装位置。


    (3)在“Deploy path”处修改为“Tomcat根目录\webapps"。在Server Options的配置中,选中如图1-16所示的“Server Options"选项组中的第2项和第3项复选框即可。


2. 创建JSP


     右击MyWeb工程中的WebContent文件夹,在弹出的快捷菜单中选择“New→JSP File",创建testjsp页面,在testjsp页面的部分输入: This is a test!.


3. 将Web项目自动部署到Tomcat服务器的Webapps目录中


     右击MyWeb工程的test.jisp文件,在弹出的快捷菜单中选择“Run As-→Run on Server”选项即可。此时,MyWeb工程会自动部署到Tomcat服务器的Webapps目录中,如图1-17所示。另外一*种将Web项目自动部署到Tomcat服务器的webapps目录中的方法如下。先关闭前面运行的服务器。可通过单击“Servers" 标签页的红色的“Stop the server”按钮,来停止Tomcat服务器,如图1-18所示。



    右击"Tomcat v8.0 Server at localhost",在弹出的快捷菜单中选择“Add and Remove…"选项,此时便弹出“Add and Remove"对话框,如图1-19所示。在这个对话框中配置部署发布到Tomcat服务器上的Web应用。



     譬如,MyWeb工程发生了更改,test.jsp 页面的部分多了以下内容:


<br>生更改,再次部署发布到服务器!<hr>


     我们可删除(Remove) 此对话框右侧列表框中旧的MyWeb配置,再从对话框左侧列表框中重新添加(Add),单击"Finish”按钮后重新启动Tomcat服务器(可通过单击“Servers"标签页的绿色的“Start the server”按钮来重新启动Tomcat服务器,在图1-18中也可以看到)。启动外部的浏览器,这里使用的是火狐,访问http://ocalhost:8080/M/yWeb/testjsp,.便进入如图1-20所示的页面。




1.5 MySQL 安装配置与使用


略~


1.6 PostgreSQL安装与使用


略~


1.6.1 PostgreSQL 下载与安装


略~


1.6.2 使用 pgAdmin III连接 PostgreSQL


略~


1.6.3 使用pgAdmin III创建数据库


略~


1.7 Navicat Premium安装与使用


略~


1.8 本章小结


     本章主要介绍了以下内容:基于B/S架构的Web应用、JDK安装与配置、服务器Tomcat下载与安装、Eclipse安装与使用、MySQL安装配置与使用、PostgreSQL安装与使用、NavicatPremium安装与使用。


    C/S架构和B/S架构是当今世界网络程序开发体系结构的两大主流。


    C/S架构是一种典型的两层架构,即客户端/服务器端架构,其客户端包含-一个或多个在用户的电脑.上运行的程序;而服务器端有两种,- -种是数据库服务器端,客户端通过数据库连接访问服务器端的数据,另一种是Socket服务器端,服务器端的程序通过Socket与客户端的程序通信。


     B/S架构是随着Internet 技术的兴起,对C/S架构的一种变化或者改进的结构。在这种结构下,用户工作界面是通过WWW浏览器来实现的,极少部分事务逻辑在前端(Browser)实现,主要事务逻辑在服务器端(Server) 实现。


基于B/S架构的Web应用,通常由客户端浏览器、Web服务器和数据库服务器三部分组成。用户通过客户端浏览器向服务器端发送请求;服务器收到请求后,需要对用户发送过来的数据进行业务逻辑处理,多数还伴随对数据库的存取操作;最后,服务器将处理结果返回给客户端浏览器。


相关实践学习
使用PolarDB和ECS搭建门户网站
本场景主要介绍基于PolarDB和ECS实现搭建门户网站。
阿里云数据库产品家族及特性
阿里云智能数据库产品团队一直致力于不断健全产品体系,提升产品性能,打磨产品功能,从而帮助客户实现更加极致的弹性能力、具备更强的扩展能力、并利用云设施进一步降低企业成本。以云原生+分布式为核心技术抓手,打造以自研的在线事务型(OLTP)数据库Polar DB和在线分析型(OLAP)数据库Analytic DB为代表的新一代企业级云原生数据库产品体系, 结合NoSQL数据库、数据库生态工具、云原生智能化数据库管控平台,为阿里巴巴经济体以及各个行业的企业客户和开发者提供从公共云到混合云再到私有云的完整解决方案,提供基于云基础设施进行数据从处理、到存储、再到计算与分析的一体化解决方案。本节课带你了解阿里云数据库产品家族及特性。
目录
相关文章
|
1月前
|
前端开发 JavaScript 安全
前端性能调优:HTTP/2与HTTPS在Web加速中的应用
【10月更文挑战第27天】本文介绍了HTTP/2和HTTPS在前端性能调优中的应用。通过多路复用、服务器推送和头部压缩等特性,HTTP/2显著提升了Web性能。同时,HTTPS确保了数据传输的安全性。文章提供了示例代码,展示了如何使用Node.js创建一个HTTP/2服务器。
49 3
|
1月前
|
移动开发 开发者 HTML5
构建响应式Web界面:Flexbox与Grid的实战应用
【10月更文挑战第22天】随着互联网的普及,用户对Web界面的要求越来越高,不仅需要美观,还要具备良好的响应性和兼容性。为了满足这些需求,Web开发者需要掌握一些高级的布局技术。Flexbox和Grid是现代Web布局的两大法宝,它们分别由CSS3和HTML5引入,能够帮助开发者构建出更加灵活和易于维护的响应式Web界面。本文将深入探讨Flexbox和Grid的实战应用,并通过具体实例来展示它们在构建响应式Web界面中的强大能力。
40 3
|
2月前
|
存储 安全 关系型数据库
后端技术:构建高效稳定的现代Web应用
【10月更文挑战第5天】后端技术:构建高效稳定的现代Web应用
67 1
|
13天前
|
前端开发 JavaScript UED
在数字化时代,Web 应用性能优化尤为重要。本文探讨了CSS与HTML在提升Web性能中的关键作用及未来趋势
在数字化时代,Web 应用性能优化尤为重要。本文探讨了CSS与HTML在提升Web性能中的关键作用及未来趋势,包括样式表优化、DOM操作减少、图像优化等技术,并分析了电商网站的具体案例,强调了技术演进对Web性能的深远影响。
21 5
|
23天前
|
缓存 安全 网络安全
HTTP/2与HTTPS在Web加速中的应用
HTTP/2与HTTPS在Web加速中的应用
|
25天前
|
SQL 安全 前端开发
PHP与现代Web开发:构建高效的网络应用
【10月更文挑战第37天】在数字化时代,PHP作为一门强大的服务器端脚本语言,持续影响着Web开发的面貌。本文将深入探讨PHP在现代Web开发中的角色,包括其核心优势、面临的挑战以及如何利用PHP构建高效、安全的网络应用。通过具体代码示例和最佳实践的分享,旨在为开发者提供实用指南,帮助他们在不断变化的技术环境中保持竞争力。
|
1月前
|
前端开发 安全 应用服务中间件
前端性能调优:HTTP/2与HTTPS在Web加速中的应用
【10月更文挑战第26天】随着互联网的快速发展,前端性能调优成为开发者的重要任务。本文探讨了HTTP/2与HTTPS在前端性能优化中的应用,介绍了二进制分帧、多路复用和服务器推送等特性,并通过Nginx配置示例展示了如何启用HTTP/2和HTTPS,以提升Web应用的性能和安全性。
33 3
|
1月前
|
前端开发 JavaScript API
前端框架新探索:Svelte在构建高性能Web应用中的优势
【10月更文挑战第26天】近年来,前端技术飞速发展,Svelte凭借独特的编译时优化和简洁的API设计,成为构建高性能Web应用的优选。本文介绍Svelte的特点和优势,包括编译而非虚拟DOM、组件化开发、状态管理及响应式更新机制,并通过示例代码展示其使用方法。
46 2
|
1月前
|
测试技术 持续交付 PHP
PHP在Web开发中的应用与最佳实践###
【10月更文挑战第25天】 本文将深入探讨PHP在现代Web开发中的应用及其优势,并分享一些最佳实践来帮助开发者更有效地使用PHP。无论是初学者还是有经验的开发者,都能从中受益。 ###
59 1
|
1月前
|
负载均衡 监控 算法
论负载均衡技术在Web系统中的应用
【11月更文挑战第4天】在当今高并发的互联网环境中,负载均衡技术已经成为提升Web系统性能不可或缺的一环。通过有效地将请求分发到多个服务器上,负载均衡不仅能够提高系统的响应速度和处理能力,还能增强系统的可扩展性和稳定性。本文将结合我参与的一个实际软件项目,从项目概述、负载均衡算法原理以及实际应用三个方面,深入探讨负载均衡技术在Web系统中的应用。
58 2