门户网站建设方,甘肃省住房城乡建设部网站,网站开发 手把手,招聘网站开发设计文档BCSP-玄子Java开发之Java Web编程CH01_初识动态网页
1.1 B/S架构
B/S架构#xff1a;浏览器/服务器
程序完全部署在服务器上使用浏览器访问服务器无需单独安装客户端软件
为什么要使用B/S架构
B/S与C/S比较B/S架构C/S架构软件安装浏览器需要专门的客户端应用升级维护客户…BCSP-玄子Java开发之Java Web编程CH01_初识动态网页
1.1 B/S架构
B/S架构浏览器/服务器
程序完全部署在服务器上使用浏览器访问服务器无需单独安装客户端软件
为什么要使用B/S架构
B/S与C/S比较B/S架构C/S架构软件安装浏览器需要专门的客户端应用升级维护客户端零维护客户端需要单独维护和升级平台相关与操作系统平台的关系最小化对客户端操作系统一般有限制性能安全在响应速度和安全性上需要花费更多设计成本能充分发挥客户端处理能力响应速度快
B/S架构工作原理
B/S架构采用请求/响应模式进行交互
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-SNkgh7aE-1687705182909)(./assets/image-20230601113226595.png)]
URL
Uniform Resource Locator统一资源定位符用于完整地描述互联网资源的地址
URL组成
http://localhost:8080/news/index.htmlhttp协议部分localhost:8080主机IP地址端口号news/index.html项目资源地址
HTTP协议
基于TCP协议之上的请求-响应协议
请求方式
GET
/test/index.jsp?name1value1name2value2POST
POST /test/index.jsp HTTP/1.1
Host: bdqn.cn
name1value1name2value2对比项GETPOST对数据长度的限制传送数据量较小传送数据量无限制数据可见性传输数据在URL可见传输数据在URL不可见安全性安全性低安全性高缓存能被缓存不能被缓存
HTTP状态码
浏览器向服务器发出请求后服务器会返回响应信息服务器使用请求状态码和请求消息表示响应状态
常见状态码
状态码消息描述200OK请求成功302Found所请求的页面已经转移至新的url400Bad Request服务器未能理解请求404Not Found服务器无法找到被请求的页面500Internet Server Error服务器错误
动态网页
动态网页是根据不同的输入或操作返回不同的网页内容
动态网页的优势
交互性网页会根据用户的要求动态改变和显示内容自动更新无须改变页面代码便会自动生成新的页面内容随机性不同的时间、不同的人访问同一网址时会产生不同的页面效果
创建动态网页
实现动态网页需要使用服务器脚本语言
ASPActive Server PagesPHPHypertext PreprocessorJSPJava Server PagesJSP代码
JSP代码
JSP脚本语言开发的动态网页需要在Web服务器中运行
% page contentTypetext/html;charsetUTF-8 languagejava %
htmlheadtitleWelcome/title/headbody%String sayHi Hello! JSP!;out.print(sayHi);%/body
/html[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-uHQuA0EV-1687705182911)(./assets/image-20230601113853160.png)]
Web服务器
一种服务程序 也称为Web容器用于运行特定应用程序可以操作HTTP请求包括接受请求及进行响应
常见的Web服务器
TomcatNginxApacheIISWebLogic
Tomcat
Tomcat 9 安装配置教程
下载链接
官网 https://tomcat.apache.org/
下载步骤
进入 Tomcat 官网点击左侧导航栏选择需要的版本下载。这里按照课程要求选择tomcat 9的版本 Mirrors选择安装的镜像源如果下载失败可尝试切换镜像
下方选择安装类型现在的 Windows 电脑基本都是 64 位的直接点击下载即可 解压安装
下载完成后我们会得到一个压缩包将压缩包解压到你想要安装的位置即可
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-cLZm0qFR-1687705182911)(./assets/image-20230504161502571.png)] 这里我将文件解压到C:\Program Files\apache-tomcat-9.0.74目录 配置环境变量
右击此电脑---属性---高级系统设置 点击下方环境变量
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-bkHaX5Vj-1687705182912)(./assets/image-20230504162810487.png)] 在系统环境变量中新建
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-eXRuDQoi-1687705182912)(./assets/image-20230504163346762.png)] 分别设置变量名与变量值 变量名CATALINA_HOME 变量值Tomcat 解压后的路径 例如我的C:\Program Files\apache-tomcat-9.0.74 下滑找到系统变量Path
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-cKWvHicD-1687705182912)(./assets/image-20230504163923181.png)] 添加环境变量%CATALINA_HOME%\bin 即为 Tomcat 安装路径下的 bin 目录 最后点击确定退出配置界面 [外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-lJiT80NE-1687705182913)(./assets/image-20230504164042103.png)] 校验 Tomcat
键盘按下win R键输入cmd打开命令提示符界面
再次输入startup.bat启动 Tomcat 服务 出现 Tomcat 启动窗口即表示安装成功乱码问题不用管 [外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-yrwAxzio-1687705182913)(./assets/image-20230504165043153.png)] 打开浏览器输入http://localhost:8080/ 到此 Tomcat 安装配置完毕 命令提示符界面一定不能关关了就等于关闭 Tomcat 服务肯定打不开这个页面 [外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-1XRWCq8Y-1687705182913)(./assets/image-20230504165312958.png)] 拓展
Tomcat 内置了许多案例包含源码可帮助学习
在网址栏后面加上examples即可
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-CQ4nLCHs-1687705182913)(./assets/image-20230504165542793.png)] Tomcat目录结构
目录说明/bin存放各种平台下用于启动和停止Tomcat的脚本文件/conf存放Tomcat服务器的各种配置文件/lib存放Tomcat服务器所需的各种JAR文件/logs存放Tomcat的日志文件/tempTomcat运行时用于存放临时文件/webapps当发布Web应用时默认情况下会将Web应用的文件存放于此目录中/workTomcat把由JSP生成的Servlet放于此目录下
修改Tomcat服务器端口
Tomcat默认端口8080修改conf目录下的server.xml文件找到Connector节点修改port属性值
Connector port8081 protocolHTTP/1.1connectionTimeout20000redirectPort8443 /http://localhost:8081/… 使用Tomcat 服务器部署Web应用
Web应用目录结构不同资源文件按规则存储于不同目录下
目录说明/Web应用的根目录该目录下所有文件在客户端都可以访问(JSP、HTML等)/WEB-INF存放应用使用的各种资源该目录及其子目录对客户端都是不可以访问/WEB-INF/classes存放Web项目的所有的class文件/WEB-INF/lib存放Web应用使用的JAR文件
创建、运行Web应用 创建Web应用按目录规则创建Web应用命名为MyFirstWeb 编写代码在MyFirstWeb目录创建index.html文件 部署Web应用代码将创建好的Web应用拷贝到Tomcat服务器的webapps目录中 启动Tomcat服务器 访问Web应用程序http://localhost:8080/MyFirstWeb/index.html
html
headmeta http-equivContent-Type contenttext/html; charsetutf-8 /titleMyFirstWeb/title
/head
bodyh1我的第一个Web应用/h1
/body
/html[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-IoR1q3hN-1687705182914)(./assets/image-20230623214536488.png)]
设置默认欢迎页面
通过配置文件设置Web应用的欢迎页修改应用程序WEB-INF目录下的web.xml文件
welcome-file-listwelcome-filehome.html/welcome-file!--可以设置多个欢迎页面--
/welcome-file-list访问项目根目录自动进入默认页面http://localhost:8080/MyFirstWeb 当运行Web应用时Tomcat会首先加载项目中的web.xml文件 JSP
JSP (Java Server Pages)
一种用于开发动态Web页面的服务器端技术在HTML中嵌入Java脚本代码Html Java片段由Web服务器编译和运行将生成的页面信息返回客户端 JSP页面主要包含静态内容、指令、小脚本、表达式、声明、注释等内容 % page importjava.text.SimpleDateFormat %
% page importjava.util.Date %
% page contentTypetext/html;charsetUTF-8 languagejava %
htmlheadtitle欢迎进入JSP世界/titleheadbody!--欢迎语 这是HTML注释--h1Hello! JSP !/h1%--显示当前日期 这是JSP注释--%%! String currTime; %%//使用预定格式将日期转换为字符串SimpleDateFormat formater new SimpleDateFormat(yyyy年MM月dd日);currTime formater.format(new Date());%% currTime %/body/head
htmlJSP页面元素 静态内容HTML代码等静态内容 JSP指令Directives声明页面属性、用于控制页面处理 JSP声明;Declarations声明Java变量、定义Java方法 JSP脚本ScriptletsJava代码片段 JSP表达式;Expressions用于展示服务器端的响应结果 JSP注释
JSP指令和小脚本
JSP指令Directives用于声明页面属性、用于控制页面处理
% 指令名称 属性1属性值 属性2属性值2,属性值3 %常用指令 page include taglib Page指令用于设置页面属性
% page 属性1属性值 属性2属性值1,属性值2 %常用属性
属性描述默认值language指定JSP页面使用的脚本语言javaimport引用脚本语言中使用到的类文件无contentType指定MIME类型和JSP页面响应时所采用的字符编码方式text/html;charset ISO-8859-1
JSP小脚本
% page languagejava importjava.util.*,java.text.* contentTypetext/html; charsetutf-8%JSP页面中的Java代码片段以%开头以%结束
%Java代码%%for(String blog : blogs){out.print(i : );out.print(blog);
%
br /
%}
%JSP表达式
表达式用于展示服务器端的响应结果
%Java变量或表达式%%for(String blog : blogs){
%%i %:% blog % br /
%}
%JSP声明
声明Java变量、定义Java方法
%! Declaration;[ Declaration;] …… %使用JSP声明定义方法计算不同直径圆的面积
%!double area(double r){ //计算圆形面积return Math.PI*r*r;}
%
%double r1 5; double r2 10;DecimalFormat df new DecimalFormat( 0.00 );
%半径为% r1%的圆面积为% df.format(area(r1))% br /半径为% r2%的圆面积为% df.format(area(r2))%[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-dyRQrNwi-1687705182914)(./assets/image-20230623221654890.png)]
JSP注释
HTML注释方法
!-- HTML注释--浏览器查看源码时可以看到注释内容不安全加重网络传输负担 JSP注释标记
%-- JSP注释--%浏览器查看源码时无法看到注释内容安全性较高 JSP脚本中使用注释
% //单行注释 %
% /*多行注释*/ %同Java注释 JSP 工作原理
Web容器处理JSP文件请求需要经过3个阶段
翻译阶段编译阶段执行阶段
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-4k4rFMB8-1687705182914)(./assets/image-20230623222212211.png)] 第一次请求之后Web容器可以重用已经编译好的字节码文件 如果对JSP文件进行了修改Web容器会重新对JSP文件进行翻译和编译 [外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-CD4YsXUk-1687705182914)(./assets/image-20230623222530751.png)]
IDEA 创建 Web 项目
创建项目
IDEA 2023 创建Jakarta EE项目 模板选择使用 Web 应用程序 应用程序服务器选择安装的 Tomcat [外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-FYbBb4Nq-1687705182915)(./assets/image-20230508151829171.png)] 第一次创建项目可能识别不到 Tomcat 需要手动添加 Tomcat 服务器 设置 Tomcat 主目录为 Tomcat 的安装路径 [外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-RV9ycPNe-1687705182915)(./assets/image-20230508154653311.png)] 然后下一步创建 我们课程中使用的 java 版本为 1.8 需要在左上角选择 Java EE 8 [外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-FFHja3OZ-1687705182915)(./assets/image-20230508154836330.png)] 然后点击 IDEA 右上角配置 Tomcat
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-fhxApdKY-1687705182915)(./assets/image-20230508155257957.png)] 部署Web应用
点击上面的部署把下面的路径都删掉只留下一个/或者项目名称 这个就是 Tomcat 的虚拟映射地址 [外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-YspWV2sS-1687705182916)(./assets/image-20230508161208112.png)] 然后直接运行项目显示连接成功即可
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-A1HR3XK9-1687705182916)(./assets/image-20230508161324931.png)] Web项目的目录结构
src目录
存放Java源代码
web目录 WEB-INF目录 web.xml 自动生成首页index.jsp
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-eBGdI1eo-1687705182916)(./assets/image-20230623222752706.png)] 把JSP、HTML文件组织成文件夹分类放入web目录中可以方便Web项目的维护和管理 修改 Maven 参数
IDEA 中内置了 Maven 就导致每次新建项目 IDEA 都会使用自带的 Maven 我们需要修改为我们本地的 Maven
点击 文件 新建项目设置
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-hvYARq8D-1687705182916)(./assets/image-20230508161525979.png)] 设置 Maven 参数勾选相关设置 Maven 主路径H): Maven 安装根目录 用户设置文件S)Maven conf目录里的settings.xml配置文件 本地仓库RMaven 目录下新建的mavne-repo文件夹 [外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-LK3qOK4A-1687705182916)(./assets/image-20230508161711179.png)] 运行Web应用常见错误
未启动Tomcat未正确部署Web应用URL输入错误目录不能被引用
常见错误未启动Tomcat
错误现象无法访问此网站
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-9e3H4tdL-1687705182917)(./assets/image-20230623223343839.png)] 排错方法访问localhost:8080路径检查Tomcat服务能否正确运行 常见错误未部署Web应用
错误现象404错误
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-eDrONLMA-1687705182917)(./assets/image-20230623223829844.png)]
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-y07Jdl1I-1687705182917)(./assets/image-20230623223832721.png)] 排错方法检查Web应用是否正确部署 常见错误URL输入错误
错误现象404
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-MXv8Y0EC-1687705182917)(./assets/image-20230623223930253.png)] 错误排错方法 检查URL协议、IP地址、端口号是否拼写正确 检查上下文路径是否拼写正确 检查文件名称是否拼写正确 常见错误目录不能被引用
错误现象404
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-y7803K8P-1687705182917)(./assets/image-20230623223954188.png)] 错误排错方法 由于WEB-INF文件夹下的内容无法对外发布所以 /WEB-INF/下的文件是不允许被引用的查看被引用文件是否在/WEB-INF/下将其移出