使用MYSQL创建简单网络应用程序Word下载.docx
《使用MYSQL创建简单网络应用程序Word下载.docx》由会员分享，可在线阅读，更多相关《使用MYSQL创建简单网络应用程序Word下载.docx（36页珍藏版）》请在冰豆网上搜索。
3
注意：
∙使用NetBeansIDE的Java下载包，可以安装GlassFish服务器。
您需要GlassFish服务器才能学完本教程。
∙Java平台与MySQL数据库协议之间的通信所需的
MySQLConnector/JJDBC驱动程序包含在NetBeansIDE中。
∙如果需要将项目与工作解决方案进行比较，可以下载样例应用程序。
规划结构
简单的Web应用程序可以使用两层体系结构进行设计，其中客户端可以直接与服务器通信。
在本教程中，JavaWeb应用程序使用Java数据库连接API直接与MySQL数据库通信。
实际上，正是
MySQLConnector/JJDBC驱动程序实现了应用服务器（GlassFish服务器）识别的Java代码与任何SQL（数据库服务器（MySQL）识别的语言）内容之间的通信。
您在本教程中构建的应用程序需要创建两个JSP页。
在每个页面中，您将使用HTML和CSS来实现简单接口，并应用JSTL技术来执行直接查询数据库以及将检索到的数据插入这两个页面的逻辑。
两个数据库表（Subject
Counselor）包含在MySQL数据库
MyNewDatabase（该数据库是通过学完连接MySQL数据库教程创建的）中。
以下面的两层方案为例。
欢迎页面（index.jsp）向用户展示了简单的HTML表单。
当浏览器请求
index.jsp
时，该页面内的JSTL代码会启动对
的查询。
它会从
Subject
数据库表中检索数据，然后先将该数据插入到页面中，再将页面发送至浏览器。
当用户在欢迎页面的HTML表单中提交其选择时，该提交会启动对响应页（response.jsp）的请求。
同样，该页面内的JSTL代码会启动对
这次，它会同时从Subject
Counselor
表中检索数据，并将该数据插入到页面中，以便允许用户在页面返回到浏览器时查看基于其选择的数据。
为了实现上述方案，您将为一个假想的组织IFPWAFCAD（即InternationalFormerProfessionalWrestlers'
AssociationforCounselingandDevelopment，国际前职业摔跤咨询与发展协会）开发一个简单的应用程序。
index.jsp
response.jsp
创建新项目
首先，在IDE中创建一个新的JavaWeb项目：
1.从主菜单中，选择“文件”>
“新建项目”（Ctrl-Shift-N组合键；
在Mac上为&
#8984-Shift-N组合键）。
选择"
JavaWeb"
类别，然后选择“Web应用程序”。
使用“新建项目”向导，可以在标准IDE项目中创建空的Web应用程序。
标准项目使用IDE生成的Ant生成脚本来编译、部署和运行应用程序。
2.单击“下一步”。
3.在“项目名称”中，输入
IFPWAFCAD。
同时，指定项目在计算机上的位置。
（缺省情况下，IDE会将项目置于home目录下的NetBeansProjects
文件夹中。
）
4.单击“下一步”。
5.在步骤3“服务器和设置”中，指定GlassFish服务器作为用于运行应用程序的服务器。
如果您安装了
NetBeansIDE
的Java版本，则GlassFish服务器会显示在“服务器”下拉字段中。
由于GlassFish服务器包含在下载中，因此会在IDE中自动进行注册。
如果要对此项目使用其他服务器，请单击位于“服务器”下拉字段旁边的“添加”按钮，然后在IDE中注册其他服务器。
但是，使用GlassFish服务器之外的服务器不在本教程的讲述范围之内。
6.在“JavaEE版本”字段中，选择"
JavaEE5"
。
JavaEE6Web项目不需要使用
web.xml
部署描述符，且NetBeans项目模板不在JavaEE6项目中包含
文件。
但是，本教程介绍了如何在部署描述符中声明数据源，此操作不依赖于任何特定于JavaEE6的功能，因此可以将项目版本设置为JavaEE5。
您同样可以将项目版本设置为JavaEE6，然后创建
部署描述符。
（从“新建文件”向导中选择"
Web"
类别，然后选择“标准部署描述符”。
7.单击“完成”。
IDE将为整个应用程序创建一个项目模板，并在编辑器中打开一个空的JSP页（index.jsp）。
充当应用程序的欢迎页面。
新项目是根据Sun
JavaBluePrints
准则构建的。
首先，准备欢迎页（index.jsp）和响应页（response.jsp）。
欢迎页实现用于捕获用户数据的HTML表单。
这两个页面都实现HTML表，从而以结构化的方式显示数据。
在此部分，您也可以创建样式表，以便增强两个页面的外观。
∙设置欢迎页
∙创建响应页
∙创建样式表
设置欢迎页
确保
在编辑器中处于打开状态。
如果该页面尚未打开，请从“项目”窗口的"
IFPWAFCAD"
>
“Web页”双击
index.jsp。
1.在编辑器中，将
<
title>
标记之间的文本更改为：
IFPWAFCADHomepage。
2.将
h1>
"
WelcometoIFPWAFCAD,theInternationalFormerProfessionalWrestlers'
AssociationforCounselingandDevelopment!
3.通过从主菜单中选择“窗口”>
“组件面板”（Ctrl-Shift-8组合键；
#8984-Shift-8组合键）打开IDE的组件面板。
将指针悬停在"
HTML"
类别中的“表”图标上，并注意为该项显示的缺省代码片段。
您可以根据自己的喜好配置“组件面板”-在“组件面板”中单击鼠标右键并选择“显示大图标”和“隐藏项名称”可使其显示上图所示的内容。
4.将光标指针放在紧靠
标记后面的位置。
（该位置即是您要实现新的HTML表的位置。
）然后，在“组件面板”中双击“表”图标。
5.在显示的“插入表”对话框中，指定以下值，然后单击“确定”。
o行数：
2
o列数：
1
o边框大小：
此时会生成HTML表代码并已添加到您的页面中。
6.将以下内容添加到表标题和第一个表行的单元格中（新内容以粗体显示）：
7.<
tableborder="
0"
>
8.<
thead>
9.<
tr>
10.<
th>
IFPWAFCADoffersexpertcounselinginawiderangeoffields.<
/th>
11.<
/tr>
12.<
/thead>
13.<
tbody>
14.<
15.<
td>
ToviewthecontactdetailsofanIFPWAFCADcertifiedformer
16.professionalwrestlerinyourarea,selectasubjectbelow:
17.<
/td>
<
18.在底部的表行中，插入一个HTML表单。
为此，请将光标放在第二对
标记之间，然后双击“组件面板”中的HTML表单（
）图标。
在“插入表单”对话框的“操作”文本字段中，键入
response.jsp，然后单击“确定”。
19.在
form>
标记之间键入以下内容（新内容以粗体显示）：
20.<
21.<
22.<
formaction="
response.jsp"
23.<
strong>
Selectasubject:
/strong>
24.<
/form>
25.<
使用IDE的代码完成支持同样可以访问“组件面板”中列出的所有项。
要在编辑器中工作时使用代码完成，可以按Ctrl-空格键。
下面的两个步骤演示了如何使用代码完成添加下拉列表和提交按钮。
26.在编辑器中，按Enter键在刚添加的内容后面添加一个空行，然后按Ctrl-空格键以调用IDE的代码完成支持。
选择“下拉列表”。
27.在所显示的“插入下拉列表”对话框的“名称”文本字段中键入
subject_id，然后单击“确定”。
请注意，下拉列表的代码片段会添加到表单中。
下拉列表的选项数目当前并不重要。
稍后，我们将在本教程中添加动态生成选项（基于从Subject数据库表收集的数据）的JSTL标记。
28.将提交按钮项（
）添加到紧靠刚添加的下拉列表后面的位置。
可以使用“组件面板”执行此操作，也可以调用编辑器的代码完成（如上一步中所述）。
在“插入按钮”对话框的“标签”和“名称”字段中均输入
submit，然后单击“确定”。
29.要设置代码的格式，请在编辑器中单击鼠标右键，然后选择“格式化”（Alt-Shift-F组合键；
在Mac上为Ctrl-Shift-F组合键）。
系统会为您的代码自动设置格式，并且类似于以下内容：
30.<
body>
31.<
h2>
Welcometo<
IFPWAFCAD<
theInternationalFormer
32.ProfessionalWrestlers'
33.<
/h2>
34.
35.<
36.<
37.<
38.<
39.<
40.<
41.<
42.<
43.<
44.professionalwrestlerinyourarea,selectasubjectbelow:
45.<
46.<
47.<
48.<
49.<
50.<
51.<
selectname="
subject_id"
52.<
option>
/option>
53.<
/select>
54.<
inputtype="
submit"
value="
name="
/>
55.<
56.<
57.<
58.<
/tbody>
59.<
/table>
/body>
要在浏览器中查看此页面，请在编辑器中单击鼠标右键，然后选择“运行文件”（Shift-F6组合键；
在Mac上为Fn-Shift-F6组合键）。
在您执行此操作时，JSP页面会自动进行编译并部署到您的服务器中。
IDE会打开缺省浏览器以便从页面的部署位置显示该页面。
创建响应页
为了准备
response.jsp
的界面，您必须首先在项目中创建文件。
请注意，此页面中显示的大部分内容都是使用JSP技术自动生成的。
因此，在以下步骤中添加占位符，稍后将替换为JSP代码。
1.在“项目”窗口中右键单击IFPWAFCAD项目节点，然后选择“新建”>
“JSP”。
“新建JSP文件”对话框打开。
2.在JSP“文件名”字段中，输入
response。
请注意，当前为“位置”字段选择了“Web页”，这表示将在项目的
web
目录中创建该文件。
此目录同样是
欢迎页驻留的位置。
3.接受任何其他缺省设置，然后单击“完成”。
新的
页面模板生成，并在编辑器中打开。
新的JSP节点还会在“项目”窗口的“Web页”下显示。
4.在编辑器中，将标题更改为：
IFPWAFCAD-{placeholder}。
5.删除
标记之间的
HelloWorld!
/h1>
一行，然后复制下面的HTML表并将其粘贴到页面主体中：
6.<
7.<
thcolspan="
2"
{placeholder}<
Description:
spanstyle="
font-size:
smaller;
font-style:
italic;
/span>
16.<
18.<
Counselor:
19.<
{placeholder}
20.<
br>
22.membersince:
{placeholder}<
26.<
ContactDetails:
27.<
email:
28.<
ahref="
mailto:
{placeholder}"
/a>
29.<
phone:
30.<
32.<
此时编译该页面，将其部署到GlassFish服务器，并在缺省浏览器中将其打开。
创建样式表
创建简单的样式表，以便增强Web界面的显示。
本教程假定您了解样式规则的作用方式，以及它们影响
中相应HTML元素的方式。
1.通过在IDE的主工具栏中按“新建文件”（
）按钮，打开“新建文件”向导。
类别，然后选择“层叠样式表”并单击“下一步”。
2.键入
style
作为CSS文件名，并单击“完成”。
IDE会创建一个空CSS文件，并将其放置在
所在的同一个项目位置。
请注意，style.css
的节点现在显示在“项目”窗口的项目中，并且该文件在编辑器中打开。
3.在编辑器中，将以下内容添加到
style.css
文件中：
4.body{
5.font-family:
Verdana,Arial,sans-serif;
6.font-size:
smaller;
7.padding:
50px;
8.color:
#555;
9.}
10.
11.h1{
12.text-align:
left;
13.letter-spacing:
6px;
14.font-size:
1.4em;
15.color:
#be7429;
16.font-weight:
normal;
17.width:
450px;
18.}
19.
20.table{
21.width:
580px;
22.padding:
10px;
23.background-color:
#c5e7e0;
24.}
25.
26.th{
27.text-align:
28.border-bottom:
1pxsolid;
29.}
30.
31.td{
32.padding:
33.}
35.a:
link{
36.color:
37.font-weight:
38.text-decoration:
none;
39.}
40.
41.a:
link:
hover{
42.color:
43.font-weight:
44.text-decoration:
underline;
}
45.将样式表链接到
response.jsp。
在这两个页面中，将以下行添加到
head>
标记之间：
linkrel="
stylesheet"
type="
text/css"
href="
style.css"
要在编辑器中打开的文件之间快速导航，请按Ctrl-Tab组合键，然后选择所需的文件。
NetBeansCSS支持
在IDE中使用CSS时，可以利用CSS样式生成器和CSS预览。
这些工具可以在创建样式规则和查看与样式属性结合使用的元素时，提供广泛的支持。
例如，将光标置于
的
h1
规则中，然后打开“CSS预览”（“窗口”>
“其他”>
“CSS预览”）：
CSS预览会演示元素在浏览器中的呈现方式。
另请注意，预览会在您对规则进行更改时自动刷新，从而在IDE中提供样式元素的实时文本表示。
在服务器与数据库之间实现通信的最有效方式是设置数据库连接池。
为每个客户端请求创建新连接会非常耗时，对于连续接收大量请求的应用程序尤其如此。
为了改变这种情况，会在连接池中创建和维护大量的连接。
任何需要访问应用程序数据层的传入请求将使用池中已创建的连接。
同样，当请求完成时，连接不会关闭，但是会返回到连接池。
为服务器准备数据源和连接池后，您需要指示应用程序使用数据源。
这通常通过在应用程序的
部署描述符中创建一个条目来完成。
最后，您需要确保服务器可以访问数据库驱动程序（MySQLConnector/JJDBC驱动程序）。
重要说明：
从现在起，您需要确保已设置名为
的MySQL数据库实例，并且该实例包含
中提供的样例数据。
如果您尚未执行此任务，或者在执行此任务时需要帮助，请参见连接MySQL数据库，然后再继续操作。
此外，您的数据库需要受口令保护才能在本教程中创建数据源和使用GlassFish服务器。
如果您使用的是缺省MySQL
root
帐户和空口令，则可以通过命令行提示符设置口令。
本教程使用
nbuser
作为示例口令。
要将口令设置为
nbuser，请在命令行提示符下导航至MySQL安装的
bin
目录，然后输入以下内容：
shell>
mysql-uroot
mysql>
UPDATEmysql.userSETPassword=PASSWORD（'
nbuser'
->
WHEREUser='
root'
;
FLUSHPRIVILEGES;
有关详细信息，请参见正式的MySQL参考手册：
《确保初始MySQL帐户安全》。
1.设置JDBC数据源和连接池
2.从应用程序引用数据源
3.将数据库驱动程序的JAR文件添加到服务器
设置JDBC数据源和连接池
GlassFishServerOpenSourceEdition包含数据库连接池（DatabaseConnectionPooling,DBCP）库，该库为作为开发者的您提供了透明的连接池功能。
要利用该功能，需要为应用程序可以用于连接池的服务器配置
JDBC（JavaDatabaseConnectivity，Java数据库连接）数据
升级会员 