电子商务网站建设第11章

《电子商务网站建设第11章》由会员分享，可在线阅读，更多相关《电子商务网站建设第11章（56页珍藏版）》请在装配图网上搜索。

1、第11章 建立和发布Web站点11.1 建立面向Web应用开发的Dreamweaver MX站点11.2 Web站点的建立与编辑11.3 站点视图的应用11.4 文件的更新操作11.5 本章摘要与重点回顾Dreamweaver MX站点在前面的章节中并没有涉及Web应用开发方面的内容，因此没有为读者完整地描述如何建立支持Web应用开发的Dreamweaver MX站点。这一节将讲解这方面的内容。11.1 建立面向Web应用开发的Dreamweaver MX中的站点包含了实体站点的内容、位置等信息，以及如何访问实体站点，如何在开发过程中发布更新到实体站点的一系列配置信息。Dreamweaver

2、MX中的站点实际上是面向内容更新的一个管理模型，或者被看成一个开发项目。Dreamweaver MX的站点管理模型由3个部分组成。了解这3个部分，是理解Dreamweaver MX站点管理的关键。下面介绍这3个部分。11.1.1 面向应用开发的站点管理模型1.本地站点可以说是Dreamweaver MX的工作目录，可以看作是实体站点上的目录结构和文件在Dreamweaver MX所在的开发工作站上的一份副本。从开发流程上说，开发者先用Dreamweaver MX在本地站点编辑、修改和存储文件，然后上传到实体站点。2.远程站点Dreamweaver MX用它来表示实体站点位置和具体内容。新建的文

3、件只有从本地站点上传后，才会在远程站点中出现。3.测试服务器测试服务器是Dreamweaver MX用来测试站点的位置和内容，Dreamweaver MX使用此服务器生成动态内容并在工作时连接到数据库。测试服务器是一个支持开发者选用的应用服务器技术的Web服务器，可以是本地计算机、测试用的服务器或生产服务器。简单的开发项目中，一般选择生产服务器（生产服务器是指最终向外界提供服务的Web服务器）作为测试服务器，即远程站点和测试服务器是同一个位置，这与Dreamweaver MX新建站点向导的默认选择是一致的。（熟悉JSP开发的读者一定清楚例外的情况，即测试服务器往往不是生产服务器。）第11章建立

4、和发布Web站点电子商务网站建设教程在新建Dreamweaver MX站点时，并不一定要一次把上述3个部分都定义好。设置了本地站点后，就可以开始使用 Dreamweaver MX进行开发了。在测试和部署内容之前，并不需要定义远程站点和测试服务器。本地站点和远程站点使得能够在本地磁盘和 Web 服务器之间传输文件，将新创作的页面发布到Web服务器。对于简单的开发环境，往往把远程站点和测试服务器选作一台服务器，因此在这种情况下，可以把远程站点和测试服务器看作是相同的(本章后面可以看到这样的例子）。阶段化开发方法（staging）是指在软件开发过程中，开发阶段、测试阶段和部署阶段明确分开，开发环境、

5、测试环境与生产环境明确分开，严格控制，防止不必要的互相影响的实施方法。对正式对外服务的电子商务站点来说，其中提供服务的任何一个Web应用程序如果存在bug，将直接影响到对客户的服务水平和质量，而且可能造成客户或者公司的直接或者间接的经济损失，包括可能的站点停机排错。11.1.2 站点管理模型的阶段化开发方法因此，测试环境与生产环境分开是完全必要的。这样就可以对测试的结果进行有组织的评估，确定符合要求的才可以部署到生产环境，正式投入使用。测试阶段所存在的问题就不会轻易流入生产环境，保证了生产环境的稳定。同样，测试环境也需要保持它的稳定性。测试环境是一个生产环境的未稳定的副本，包含生产环境中的各个

6、互相作用的组成部分，复杂度与之相当。一个完整的开发过程，包含一个开发团队，其中各个小组完成不同的部分，如果谁完成了一部分工作都立即扔进测试环境的话，测试就缺乏组织，排错找“虫”就会变得异常困难。谁也不知道正在诊断排除的错误，是不是和别的模块有关，甚至不知道排错过程中，别人有没有又引入了其他错误。因此，开发环境和测试环境分开也是完全必要的。这样，开发好的模块投入测试也变成一种有组织的行为，更加易于控制。Dreamweaver MX的站点管理模型，正对应了staging的3个阶段：本地站点对应了开发环境；测试服务器对应了测试环境；远程站点对应了生产环境。完整的站点管理流程如图11-1所示。图11-

7、1Dreamweaver MX的站点管理模型（1）开发者先用Dreamweaver MX在本地站点编辑、修改和存储文件。（2）需要测试的内容上传到测试服务器，使用测试服务器测试这些内容。（3）测试完成获得认可的内容上传到远程站点。要点提示:不要认为这3个环境就是3台不同的机器，任意两个环境都可以同时存在于同一台机器中，甚至这3个环境都可以在一台机器上。测试服务器与远程站点可以在同一台服务器上，对应于不同的两套站点组合（Web站点加FTP站点的组合），分别用不同的站点主目录。开发环境也可以在上述服务器上，其本地站点又对应于另外一个主目录。团队开发控制是指在多人协作完成同一开发项目时如何控制源代码

8、的共享和编辑冲突。如果不加控制，那么当有两个开发者试图编辑同一个源文件的时候，就会发生编辑冲突，最后文件改成什么样子，就看谁最后保存了。Dreamweaver MX用取出和存回这一概念来解决团队开发中的这类问题。如果读者用过Visual Source Safe或CVS之类的协作开发工具，就会对存回（check in）和取出（check out）机制比较熟悉。在启用了存回和取出机制后，会出现下述情况：11.1.3 站点管理模型的团队开发控制思路（1）当一个开发者想要修改某一文件时，他必须先将它取出，相当于向Dreamweaver MX开发环境作了登记（“嘿，Dreamweaver MX，我登记修

9、改这个文件。”）；（2）取出一个文件以后，开发者才有权上传修改后的版本；（3）当他修改完文件，上传完毕，认为暂时不需要再修改时，他可以选择存回该文件（“嘿，Dreamweaver MX，我改完了。”）；（4）开发者不能修改被其他开发者取出的文件，只能读取该文件当前的内容；（5）只有等别的开发者存回了这个文件，开发者才能取出这个文件。通过这种存回取出机制，保证了同一时间只能有一个开发者能够修改某个特定的文件（他已经取出了这个文件），也保证了其他开发者能够看到最新的版本（只要修改者上传了最新的版本）。11.2.1 建立面向Web应用开发的站点用Dreamweaver MX建立面向Web应用开发的站

10、点的操作步骤如下。（1）在Dreamweaver MX的浮动面板中，单击【文件】浮动面板的展开按钮，打开【文件】面板。（2）在【站点】选项卡中，单击【站点】下拉式按钮，在快捷菜单中选择【新建站点】命令。（3）这时会出现如图11-2所示的站点定义向导，在【您打算为您的站点起什么名字？】文本框中输入站点的名字，例如My Site，然后单击【下一步】按钮。11.2 Web站点的建立与编辑图11-2站点定义向导之一（4）接下来是关于站点支持何种应用服务器技术的问题，如图11-3所示。除非想建立一个完全静态的网站，一般来说，都要选择【是，我想使用服务器技术】选项，在下拉列表框中选择想使用的服务器技术，例

11、如ASP VBScript。要点提示：在开发一个Web应用程序时，选定一种服务器技术比较好，而不要混用多种技术。如果读者对应用服务器技术有比较深入的研究，那么就会知道，在管理会话级、应用技术级数据共享方面，各种技术都有自己的一套方法，混用多种技术会在共享数据时遇到麻烦，当然也给应用开发和维护工作增大了工作量。图11-3站点定义向导之二（5）定义开发的流程，默认的选择是【在本地进行编辑，然后上传到远程测试服务器】，这是比较稳妥和便于管理的做法，如图11-4所示选择默认的选项，并且在【您将把文件存储在计算机上的什么位置？】文本框中输入本地编辑时文件存储的位置。（6）选择通过何种方式更新测试服务器上

12、的文件，如图11-5所示。在【您如何连接到测试服务器】下拉列表框中选择的方式不同，对话框下方的文本框中待填的内容也会不同，可以选择的方式为【FTP】、【本地网络】和【RDS】。建议选用【FTP】的方式，因为这是最标准的Internet协议。若选用【本地网络】方式，此方式只在Windows网络中才有，即Windows共享目录。若选用【RDS】方式，此方式用于开发Cold Fusion应用程序。图11-4站点定义向导之三（7）当选择【FTP】方式更新文件时，需要完成下述设置。在第二个文本框中输入测试服务器的IP地址，如果有主机名，最好输入主机名。在第三个文本框中输入测试服务器中存放文件的文件夹名，

13、不输入此项内容，表示使用FTP用户主目录作为存储文件夹。在下面的两个文本框中，分别输入FTP用户名和密码。注意：这个用户必须有对其主目录的完全权限，否则无法更新文件，如果选择【保存】选项，那么Dreamweaver MX会记住用户名和密码。这个向导还提供了方便的工具来测试定义的正确性，只要单击【测试连接】按钮，如果正常，就可以看到如图11-6所示的信息，否则就应检查网络是否工作正常，FTP服务器是否配置正确，用户名和密码是否输错，等等。（8）单击【下一步】按钮，可以看到如图11-7所示的对话框。这一步要求输入用什么URL来访问测试服务器的主页，以便测试。应按10.1.3节所说的步骤定义的实体W

14、eb站点的URL，输入该实体Web站点的URL。图11-5站点定义向导之四图11-7站点定义向导之五（9）这一步同样提供了方便的【测试URL】按钮。正常情况下，测试成功会看到如图11-8所示的信息。如果不成功，可以打开浏览器，输入该URL直接访问主页，检查究竟是什么HTTP错误。如果是无权浏览目录之类的信息，可能因为这个Web站点刚定义好，连主页面还没有。（10）单击【下一步】按钮进入协同开发选项的设置窗口，如图11-9所示。如果是一个团队分工开发同一个网站，则需要启用存回和取出，如果只是单兵作战，则不必启用存回和取出。（11）单击【下一步】按钮，向导会列出所有步骤中的选择情况的总结，单击【完

15、成】按钮确认并结束新站点定义，如图11-10所示。（12）这时，在【站点】选项卡中可以看到刚刚定义好的My Site站点，如图11-10所示。图11-9站点定义向导之六图11-10站点定义向导之七要点提示：这个例子使用Dreamweaver MX站点定义向导默认的站点定义方法，这样定义出来的站点与站点管理模型如何对应呢？实际上，用【在本地进行编辑，然后上传到远程测试服务器】这一选项定义的结果是远程站点与测试服务器的角色重合。对于简单的电子商务站点，复杂度不高，如图11-11所示。如果需要定义出完全符合站点管理模型的阶段化方法的站点，那么站点定义向导不能实现这一要求，【在本地进行编辑，然后上传到

16、远程测试服务器】这一选项已经是向导能够定义出的最复杂的方式了。更复杂的定义需要通过手工编辑站点定义来完成。图11-11远程站点与测试服务器合二为一的模型对于已经建立的站点，可以编辑它的属性，或补充建立站点时未定义的部分属性。编辑一个站点的操作步骤如下。（1）单击【文件】浮动面板的展开按钮，打开【文件】面板，如图11-12所示。在【站点】选项卡中，单击【站点】下拉式按钮，在快捷菜单中选择【编辑站点】命令。（2）在如图11-13所示的对话框中，选择需要编辑的站点，单击【编辑】按钮开始编辑。11.2.2 编辑面向Web应用的站点图11-12【文件】面板图11-13【编辑站点】对话框（3）在如图11-

17、14所示的编辑站点属性对话框中，可以选择【基本】选项卡，仍然用向导来完成定义。（4）还可选择【高级】选项卡中的【分类】定义，核心的定义在左边【分类】列表中的前三项，对应站点模型中的三个阶段。图11-14编辑站点属性对话框要点提示：从【分类】列表中可以看出，【远程信息】和【测试服务器】完全可以是两个不同的服务器。完全符合站点管理模型的定义，如图11-14、图11-15、图11-16所示。假定整个环境包括一台开发用的PC机和一台服务器，PC机的IP地址为10.10.1.10，服务器有两个IP地址：10.10.1.2用于生产环境，10.10.1.3用于测试环境。服务器上对应于10.10.1.2定义了

18、一套Web站点和FTP站点，其站点主目录为C:My Site，FTP的上传用户为Administrator；对应于10.10.1.3定义了另一套Web站点和FTP站点，其站点主目录为C:My Site Test，FTP的上传用户为Tester。本地站点：如图11-14所示，本地根文件夹指开发机上的目录，IP地址从这里并不能看到。远程站点：如图11-15所示，站点主目录在这里不能看到，在服务器上的FTP或Web站点定义里可以看到。远程站点不需要定义URL，因为它不用于测试。测试服务器：如图11-16所示。站点主目录在这里不能看到，在服务器上的FTP或Web站点定义里可以看到。图11-15远程站点

19、的参数设置图11-16测试服务器的参数设置站点视图可帮助站点开发者清楚地了解当前站点的结构和更新状况。站点视图根据文件的存储位置和逻辑结构分为4种：【本地视图】、【远程视图】、【测试服务器】和【地图视图】。【本地视图】显示本地站点的目录和文件结构，以及目录和文件的更新状况，如图11-17所示。【远程视图】显示远程站点的目录和文件结构，以及目录和文件的更新状况。对同一个站点，如图11-17所示，其【远程视图】中显示的远程站点的内容和结构与图11-18中所示的本地站点的内容和结构并不同步。这在开发过程中是很正常的。11.3 站点视图的应用图11-17本地站点的目录和文件结构图11-18远程站点的目

20、录和文件结构【测试服务器】显示测试服务器的目录结构和文件，如图11-19所示。【地图视图】根据文档相互链接的方式显示站点的地图。基于链接的视图给开发者更加清楚的文件与文件之间关系的参考，或者说这个视图给出了站点的逻辑结构，而不是存储结构，这是用户访问时看到的站点结构，如图11-20所示。不管哪一种视图，Dreamweaver MX都使用以下符号来表示文件的更新状况。（1）绿色选中标记表示开发者已取出该文件。（2）红色选中标记表示其他开发者已取出该文件。（3）锁形符号表示该文件对开发者自己是只读的，也就是还未被开发者自己取出。注意：各人看到的符号是不一样的，如果一个开发者取出某个文件，看到的是绿

21、色的选中标记，而其他开发者看到的就是红色选中标记。符号只对本人有意义。关于文件更新，11-4节进行更详细地描述。图11-19测试服务器的目录结构和文件图11-20站点结构文件的更新操作主要有四种：【上传】（put）、【获取】(get)、【取出】（check out）和【存回】(check in)。【站点】选项卡的工具条中，表示【获取】，表示【上传】，表示【取出】，表示【存回】。11.4 文件的更新操作1.文件的上传操作【上传】是指把修改过的文件从本地站点更新到远程站点或测试服务器，即本地覆盖远程。Dreamweaver MX所复制的文件是开发者在【站点视图】中选择的文件。如果【本地视图】处于活

22、动状态，则选定的本地文件将复制到远程站点；如果【远程视图】处于活动状态，则选定与本地站点对应的文件复制到远程站点；如果【测试服务器】处于活动状态，则选定的本地文件将复制到测试服务器。2.文件的获取操作【获取】是指把服务器上存储的文件读取到本地站点，可以是恢复以前存储的版本，即远程覆盖本地。Dreamweaver MX所复制的文件是开发者在站点视图中选择的文件。如果【远程视图】或【测试服务器】处于活动状态，则可将选定的远程或测试服务器文件复制到本地站点；如果【本地视图】处于活动状态，则 Dreamweaver MX会将选定的本地文件对应的远程版本复制到本地站点。只有在定义站点时，选择了【启用文件

23、存回和取出】选项，【存回】和【取出】才有意义。3.文件的取出操作【取出】是指读取服务器上存储的文件到本地站点，并且锁定服务器上的该文件，不允许其他人更新，以防止多人同时更新同一个文件造成的更新冲突。对已取出的文件，其他开发者只能读取。4.文件的存回操作【存回】是指开发者认为暂时修改完某个已经取出的文件，认为一段时间内不需要再改，而把当前已经修改过的文件从本地站点更新到【远程站点】或【测试服务器】，并且解除对服务器上的该文件锁定。这样就允许别人取出该文件并修改。在传送文件开始前，可能会出现一个对话框，询问您是否要放置相关文件。选择【是】即可。Dreamweaver MX会自动判断哪些文件是相关文

24、件，需要同时传送。注意：以上所说的文件更新操作并不只限用于文件，还可以用于整个文件夹，当选定文件夹进行操作时，会复制整个文件夹。另外，选择文件或目录时，可以按住Ctrl键选定多个要更新的内容。除了用上述操作完成手工的更新之外，还可以用批量的方式自动同步本地站点和远程站点的内容。同步操作通过选择【站点】选项卡的【站点】下拉式按钮中的【同步】命令来激活。【同步文件】对话框如图11-21所示。对话框中的选项的意思不言自明，这里不再赘述。也可单击【预览】按钮，看一看本次同步操作到底包含哪些具体的操作。检查无误后，按【确定】按钮开始实施同步。图11-21【同步文件】对话框如前面章节所述，开发Dreamweaver MX网站的第一步是建立一个Dreamweaver MX站点。对于电子商务网站来说，因为Web应用程序是必不可少的，所以应该在一开始就用本章所说的方法来建立支持应用服务器技术的新站点。本章介绍了开发Web应用程序的准备工作，站点管理模型的3个部分(即本地站点、远程站点和测试服务器)，站点的编辑方法，站点视图的应用以及站点文件的更新等内容。11.5 本章摘要与重点回顾演讲完毕，谢谢观看！