1.5.3 了解Web应用
说明
  • 本文旨在帮助非专业人员了解一般Web应用程序的基本原理,以便理解汇智魔方应用基本工作原理
  • 汇智魔方对照关系章节介绍了汇智魔方作为Web应用的相关配置情况


    • Web应用工作原理


      如图所示,Web应用工作流程如下:
      1. 客户端(浏览器)发出请求
        • 用户通过浏览器向服务器发送http请求
        • 浏览器通过URL(资源地址,即浏览器地址栏的内容,例如:http://test.mypaas.net/wm/web/userview/wizMagicSample/v/_/welcome),向服务器发送请求
        • 请求发出后,浏览器就等待服务器端返回信息
      2. 服务器端响应并处理请求
        • 服务器端应用服务器接收到请求后,根据请求的资源路径,由指定的程序响应请求
        • 当请求涉及存储或读取数据时,由应用程序对数据库进行读写操作,或对指定文件夹的文件进行读写操作
      3. 客户端(浏览器)响应请求
        • 当服务器端处理完请求后,即会向客户端返回信息
        • 客户端接收到返回的信息后,由浏览器解析相应的信息后呈现在浏览器中(此时浏览器刷新完毕)
    • 浏览器

      1. URL

          • {scheme} - 资源类型,例如:http
          • {host} - 域名或IP,例如:test.mypaas.net(通过DNS域名解析找到对应的IP,再通过IP找到服务器)
          • {Port} - 端口,例如:8080;当http端口号为80时,可以省略
          • {Port} - 资源路径,例如:wm/web/userview/VT_sms/v//form_account_view
          • "?"以后的为参数名和参数值,例如:?id=293aa928-72d7cee0-396f400f-d68a86e3,代表参数id为293aa928-72d7cee0-396f400f-d68a86e3
      2. HTML

        • HTML是构成网页的基础,是一种超文本标记语言,一般用于展示静态页面
        • HTML由成对的标签构成,例如:
          <a href="http://www.w3school.com.cn">链接</a>
          

          以上HTML在浏览器中显示“链接”字样的超链接,点击文字会跳转到页面http://www.w3school.com.cn
          <img src="http://www.w3school.com.cn/i/eg_w3school.gif" width="300" height="120"></img>
          

          以上HTML在浏览器中显示图片eg_w3school.gif,该图片由URL地址“http://www.w3school.com.cn/i/eg_w3school.gif”获取
        • 更多知识参见 W3C HTML教程
      3. CSS

        • CSS用于对HTML元素显示样式的定义
        • CSS用于解决HTML内容与表现分离的问题
        • CSS语法如下:
          selector {declaration1; declaration2; ... declarationN }
          

          例如:
          h1 {color:red; font-size:14px;}
          

          代表,将h1标签元素字体颜色置为红色,字体大小为14px
        • 更多知识参见 W3C CSS教程
      4. JavaScript

        • JavaScript简称JS,是一种客户端的脚本语言
        • JavaScript主要用于为页面添加交互行为(例如页面特效,逻辑判断,数据校验等),jQuery(简化JS编程),AJAX(异步交互,可与服务器端交互,局部刷新页面)均以JavaScript为基础
        • 在HTML页面中插入JavaScript时使用标签<script></script>
          <script>
          alert("My First JavaScript");
          </script>
          

          以上代码作用为弹出警示文字“My First JavaScript”
        • 更多知识参见 W3C JavaScript教程
      5. 页面使用CSS/JavaScript

        • 在HTML页面中使用CSS/JavaScript有两种方式:
          1. CSS/JavaScript直接写入HTML页面(即将脚本写在同一个HTML页面文件的<script></script>标签内)
          2. 在页面中引用CSS/JavaScript脚本文件,例如:
            <link rel="stylesheet" type="text/css" href="/wm/js/guiders/guiders-1.1.1.css"/>
            <script type="text/javascript" src="/wm/js/jquery/jquery-1.9.1.min.js"></script>
            

            以上代表,在当前页面引入CSS脚本guiders-1.1.1.css和JS脚本jquery-1.9.1.min.js两个脚本文件
    • 应用服务器

      • Web应用程序必须部署到Web应用服务器中才能被使用
      • Web应用服务器可以简单理解为Web程序的运行平台
      • 常用的JAVA应用服务器有:Tomcat,JBoss,WebLogic等
      • 以Tomcat为例:
        • 应用程序可打包为[program].war
        • 当程序文件[program].war部署到默认的应用程序路径“[Tomcat安装目录]/webapps/”下时,Tomcat(运行时)会将[program].war自动解压到“[Tomcat安装目录]/webapps/program”
        • 应用程序对应的URL为
          http://host:port/program

          URL中的program对应程序文件路径[Tomcat安装目录]/webapps/program
    • 应用端口

      • 应用程序的端口由应用服务器的配置文件决定
      • 以Tomcat为例,通过修改文件[Tomcat安装目录]/conf/server.xml中的端口配置,修改应用程序的端口
        <Connector port="8080" protocol="HTTP/1.1"
                       maxThreads="150" connectionTimeout="20000"
                       redirectPort="8443" />
        
    • 数据库

      • 应用程序的数据一般都保存在数据库中(大多使用关系型数据库,例如:MySql,SQL Server,Oracle等)
      • 应用程序通过特定的数据库连接程序操作,对数据库进行读写
      • 一般Java程序通过JDBC(Java DataBase Connectivity)连接数据库(需要配置数据库地址、用户名和密码三个参数)
      • 关于数据库详情请参考 1.5.2 了解数据库
    • 文件存储

      • 有时应用程序的信息需要以文件形式保存,就需要使用文件存储与读取操作
      • 应用程序通过I/O流操作,进行文件存储和读取
      • 对文件操作时需要指定文件的路径(即文件夹位置),例如:/wflow/formuploads
    • 汇智魔方对照关系

      • 应用服务器

        • 汇智魔方默认应用服务器为Tomcat,也可以根据需要替换为WebLogic,GlassFish,JBoss等
        • 通过修改Tomcat的配置文件[Tomcat安装目录]/conf/server.xml,可修改应用端口
      • 应用程序

        • 汇智魔方应用程序由两个压缩文件wm.war和wmdesigner.war组成,其中wm.war为主要程序文件。wmdesigner.war仅在使用客户端流程设计器时使用(一般仅使用基于浏览器的流程设计器)
        • Tomcat启动时会自动部署程序文件目录中的应用程序,并且通过启动文件加载一些参数,例如指定汇智魔方的工作目录路径
        • Tomcat默认的程序文件目录为webapps,war包文件在此目录下会自动解压为程序目录wm,此时汇智魔方应用程序的访问路径为http://{host}/wm,例如:http://test.mypaas.net/wm
        • 如果将wm.war更名为px.war,则webapps目录下会自动生成程序目录px,此时汇智魔方应用程序的访问路径为http://{host}/px,例如:http://test.mypaas.net/px
        • 因此,您需要升级汇智魔方时,只需替换wm.war程序文件,并删除原先已生成的wm文件夹。升级详见 2.1.1.3 系统升级
        • 在查找问题或调整配置时,您需要理解Tomcat与汇智魔方应用程序的界线
        • 在启动汇智魔方,您看到的黑窗口,其实是Tomcat的运行窗口,启动tomcat前,系统首先调用了mysql的启动文件,以确保应用程序所需的数据库已启动
      • 数据库连接

        • 汇智魔方数据库连接由wflow目录下两个文件决定:
          • app_datasource.properties - 该文件指定由哪个配置文件为当前哪个数据配置文件有效。例如:currentProfile=default,代表当前有效文件为app_datasource-default.properties
          • app_datasource-[profilename].properties - 该文件具体指定了数据库连接所需的参数,例如数据地址、用户名和密码
      • 文件存储

        • 汇智魔方默认工作文件夹为wflow
        • 上传的附件与图片均保存在wflow/app_formuploads目录下。详情参见 1.5.4 附件/图片保存
Create by Sean Fung on 2014-08-28 17:28:28.0
Last updated by Sean Fung on 2015-10-06 11:43:46.0