極客書

GWT - Deploy Application

本教程將向您介紹如何創建一個應用程式「war」文件，以及如何在Apache Tomcat Websever根目錄中部署該文件。

如果您理解這個簡單的示例，那麼您還可以按照相同的步驟部署複雜的GWT應用程式。

讓我們使用Eclipse IDE和GWT插件，並按照以下步驟創建GWT應用程式−

Step Description
1 Create a project with a name HelloWorld under a package com.tutorialspoint as explained in the GWT - Create Application chapter.
2 Modify HelloWorld.gwt.xml, HelloWorld.css, HelloWorld.html and HelloWorld.java as explained below. Keep rest of the files unchanged.
3 Compile and run the application to make sure business logic is working as per the requirements.
4 Finally, zip the content of the war folder of the application in the form of war file and deploy it in Apache Tomcat Webserver.
5 Launch your web application using appropriate URL as explained below in the last step.

下面是修改後的模塊描述符的內容。

<?xml version = "1.0" encoding = "UTF-8"?>
<module rename-to = 'helloworld'>
   <!-- Inherit the core Web Toolkit stuff.                        -->
   <inherits name = 'com.google.gwt.user.User'/>

   <!-- Inherit the default GWT style sheet.                       -->
   <inherits name = 'com.google.gwt.user.theme.clean.Clean'/>

   <!-- Specify the app entry point class.                         -->
   <entry-point class = 'com.tutorialspoint.client.HelloWorld'/>

   <!-- Specify the paths for translatable code                    -->
   <source path = 'client'/>
   <source path = 'shared'/>

</module>

下面是修改後的樣式表文件war/HelloWorld.css的內容。

body {
   text-align: center;
   font-family: verdana, sans-serif;
}

h1 {
   font-size: 2em;
   font-weight: bold;
   color: #777777;
   margin: 40px 0px 70px;
   text-align: center;
}

下面是修改後的HTML宿主文件war/HelloWorld.HTML的內容。

<html>
   <head>
      <title>Hello World</title>
      <link rel = "stylesheet" href = "HelloWorld.css"/>
      <script language = "javascript" src = "helloworld/helloworld.nocache.js">
      </script>
   </head>

   <body>
      <h1>Hello World</h1>
      <div id = "gwtContainer"></div>
   </body>
</html>


package com.tutorialspoint.client;

import com.google.gwt.core.client.EntryPoint;
import com.google.gwt.user.client.ui.HTML;
import com.google.gwt.user.client.ui.RootPanel;

public class HelloWorld implements EntryPoint {
   public void onModuleLoad() {
      HTML html = new HTML("<p>Welcome to GWT application</p>");
      
      RootPanel.get("gwtContainer").add(html);
   }
}

在這裡，我們創建了基本的widgest HTML，並將其添加到具有id=「gwtContainer」的div標記中。在接下來的章節中，我們將研究不同的GWT小部件。

完成所有更改後，讓我們以開發模式編譯並運行應用程式，就像我們在「gwt-創建應用程式」一章中所做的那樣。如果你的申請一切順利，這將產生以下結果;

GWT Application Result2

Create WAR File

現在我們的應用程式運行良好，我們準備將其導出爲war文件。

請遵循以下步驟&負;

  • 進入項目的wardirectoryC:\ workspace\HelloWorld\war

  • 選擇war目錄中可用的所有文件和文件夾。

  • 壓縮名爲HelloWorld.Zip的文件中的所有選定文件和文件夾。

  • 將HelloWorld.zip重命名爲HelloWorld.war。

Deploy WAR file

  • 停止tomcat伺服器。

  • 將HelloWorld.war文件複製到tomcat installation directory>webapps文件夾

  • 啓動tomcat伺服器。

  • 在webapps目錄中，應該有一個文件夾helloworld已創建。

  • 現在HelloWorld.war已經成功地部署在Tomcat Webserver根目錄中。

Run Application

在web瀏覽器中輸入url:http://localhost:8080/HelloWorld以啓動應用程式

伺服器名（localhost）和埠（8080）可能因tomcat配置而異。