【学生さま向け】Microsoft Azure Web App と NetBeans (Maven) の FTP 連携
前回、Microsoft Azure と JDK、NetBeansのインストールをしました。今回は、デスクトップの PCで開発したアプリケーションをMicrosoft Azure上に公開する方法について説明します。
まず、Microsoft Azure の管理ポータル・サイトにログインをします。管理ポータルから「＋新規」のリンクを押下し、「Web + モバイル」を選択してください。DreamSparkプログラムで、無償で利用できるサービスの一覧が表示されます。ここで「Web App」を選択してください。
「Web App」を選択すると下記の画面が表示されます。ここで、「Webアプリ」にサービスを識別するための文字列を入力し、「サブスクリプション」に「DreamSpark」が選択されていることを確認してください。その後、「App Service プラン/場所」を押下してください。
「新規作成」を選択すると下記の画面が表示されます。ここで「App Serviceプラン」にプランの識別名を入力してください。次に「場所」を指定します。ここでは「Japan West」を選択してください。最後に「価格レベル」を押下し「1GB」を選択してください。
選択すると下記の画面が表示されます。「OK」ボタンを押下してください。
「OK」ボタンを押下すると下記の画面が表示されますので、「作成」ボタンを押下してください。
「作成」ボタンを押下するとMicrosoft Azureの管理ポータル画面で「Web Appをデプロイしています」というメッセージがしばらく表示されます。
「Web App」が問題なく作成すると下記の画面が表示されます。
ここで、画面の右ペインから「アプリケーション設定」を選択してください。選択すると下記の画面が表示されます。今回は、JavaのWebアプリケーションをJettyという実行環境(Webコンテナという)上で動作させます。「Javaバージョン」から「Java 8」を選択し、「Javaマイナーバージョン」で「最新」を選択してください。次に「Webコンテナ」から「Jetty 9.1.0v20131115」を選択してください。また将来的に、WebSocketのアプリケーションを作成するため、「Webソケット」を「オン」に設定してください。最後に画面上部の「保存」ボタンを押下してください。以上で、Microsoft Azure 上でJettyを動作させる環境が整いました。
次に、Microsoft Azureの管理ポータルから「Web App」のトップページに移動します。ここで「FTP/デプロイメント ユーザ名」に対するパスワードを設定します。「すべての設定」から「デプロイ資格情報」を選択してください。すると下記の画面が表示されます。ここで「パスワード」、「パスワードの確認」に同じパスワードを入力して最後に「保存」ボタンを押下してください。
新しいパスワードは 8 ～ 60 文字でなければなりません。また、次のうちの 2 つの文字グループの文字を含んでいる必要があります:
グループ 1: 大文字 (A ～ Z)、
グループ 2: 小文字 (a ～ z)、
グループ 3: 数字
FTP接続用のパスワード設定が完了したのち、実際にFTPを利用してMicrosoft Azureに接続できるかを確認します。管理ポータルから「プロパティ」を選択してください。選択するとプロパティの一覧が表示されますので、「FTPホスト名」の右にあるボタンを押下してください。押下するとクリップボードにFTPホスト名がコピーされます。
次に、Windows、もしくは Mac のターミナルからコマンドを実行します。Windowsの場合、「コマンドプロンプト」を起動してください。コマンドプロンプトはスタートメニューから「Command」と入力することで検索できます。下記のアイコンが表示されたらアイコンを押下してください。
「コマンドプロンプト」を起動すると下記の画面が表示されます。ここで、ftpコマンドを実行してMicrosoft Azureに接続します。
「FTPホスト名」はご自身の環境に合わせて記入してください。「コマンドプロンプト」の左上のアイコンから「編集(E)」→「貼り付け(P)」でクリップボードにコピーしたFTPホスト名をコマンドプロンプトに貼り付けることもできます。※ 貼り付けを行う際は、「ftp://」の部分を削除してホスト名だけ記述してください。
具体的には、コマンドプロンプトで下記の太字で示したコマンドを実行して接続ができるか、コマンドを実行できるかを確認してください。
|
$ ftp waws-prod-os1-001.ftp.azurewebsites.windows.net Trying 138.91.24.26… Connected to waws-prod-os1-001.drip.azurewebsites.windows.net. 220 Microsoft FTP Service Name (waws-prod-os1-001.ftp.azurewebsites.windows.net:yoterada): yosshi2007-jetty\yosshi2007-dep 331 Password required Password: [Azure ポータルで設定したパスワード] 230 User logged in. Remote system type is Windows_NT. ftp> ls 229 Entering Extended Passive Mode (|||10264|) 125 Data connection already open; Transfer starting. 10-13-15 10:49AM LogFiles 10-13-15 10:49AM site 226 Transfer complete. ftp> cd site 250 CWD command successful. ftp> ls 229 Entering Extended Passive Mode (|||10265|) 125 Data connection already open; Transfer starting. 10-13-15 10:49AM wwwroot 226 Transfer complete. ftp> cd wwwroot 250 CWD command successful. ftp> ls 229 Entering Extended Passive Mode (|||10271|) 125 Data connection already open; Transfer starting. 10-13-15 10:49AM 202392 hostingstart.html 226 Transfer complete. ftp> quit |
上記で、Microsoft Azure 上でJetty環境を構築し、FTPで接続できるようになりました。
次に、ローカルのデスクトップ環境でJavaのWebアプリケーションを開発し、開発したアプリケーションをMicrosoft Azureに配備(デプロイ)します。まず、ローカルの環境でNetBeansを起動してください。
NetBeans を起動したのち、新しいプロジェクトを作成します。下記の画面のようにNetBeansのメニューから「ファイル(F)」を選択し「新規プロジェクト(W)…」を押下してください。
選択すると下記の新規ポロジェクトを作成するためのウィザード画面が表示されます。ここで「カテゴリ(C) :」から「Maven」を選択し、「プロジェクト(P):」から「Webアプリケーション」を選択して「次 >」ボタンを押下してください。
ボタンを押下すると下記の画面が表示されます。ここで「プロジェクト名(N):」に「Azure-Jetty9-WebSocket-Chat」と入力し「次 >」ボタンを押下してください。
ボタンを押下すると下記の画面が表示されます。ここでは、ローカル・デスクトップ環境の実行環境とJava EEバージョンを指定します。今回は、何も変更せずに「終了(F)」ボタンを押下してください。
ボタンを押下するとしばらくして下記のような画面が表示されます。
NetBeansをインストールした直後に、Mavenプロジェクトを作成した場合、セントラル・レポジトリより大量のファイルを入手する必要があります。依存するファイルをすべて入手するために、下記の画面のようにプロジェクトを右クリックし「依存性でビルド」を実行してください。
「出力 — プロジェクトの作成」の部分に緑色の文字で「BUILD SUCCESS」と表示されれば成功です。
次に、本WebアプリケーションをJetty上で動作させるための設定を行います。「Webページ」のディレクトリを右クリックし「新規」を選択したのち「フォルダ…」を押下してください。
「フォルダ」を押下すると下記の画面が表示されます。ここで「フォルダ名(N):」に「WEB-INF」と入力し「終了(F)」ボタンを押下してください。
次に作成した「WEB-INF」フォルダを右クリックし「新規」を選択したのち、「その他…」を押下してください。
「その他…」を押下すると下記の画面が表示されます。ここで「カテゴリ(C):」から「XML」を選択し「ファイル・タイプ(F):」から「XMLドキュメント」を選び「次 >」ボタンを押下してください。
「次 >」ボタンを押下すると下記の画面が表示されます。ここで「ファイル名(N):」に「jetty-web」を記入し「次 >」ボタンを押下してください。
「次 >」ボタンを押下すると下記の画面が表示されます。「終了(F)」ボタンを押下してください。
「終了(F)」ボタンを押下するとXMLファイルが自動的に作成されます。作成されたXMLファイルの内容を一旦すべて削除し、下記を記載してください。
<?xml version="1.0" encoding="ISO-8859-1"?>
<!DOCTYPE Configure PUBLIC "-//Jetty//Configure//EN" "http://www.eclipse.org/jetty/configure_9_0.dtd">
<Configure class="org.eclipse.jetty.webapp.WebAppContext">
<Set name="contextPath">/Azure-Jetty9-WebSocket-Chat</Set>
</Configure>
次に、統合開発環境からFTPでMicrosoft Azureにファイルを転送するための設定を行います。
今回、Mavenというビルドツールを利用しています。Mavenは必要な情報やローカルのレポジトリを利用者のホームディレクトリ上で管理します (.m2ディレクトリ)。たとえば、Windows 環境の場合、「ローカルディスク」→「ユーザ」→「ユーザ名」→「.m2」にあります。
Mac OS/X環境の場合、「Machintosh HD」→「ユーザ」→「ユーザ名」→「.m2」にあります。
この「.m2」ディレクトリに移動したのち「FTPホスト」に対する接続設定をおこないます。「settings.xml」というファイルを下記の手順で作成してください。「.m2」ディレクトリに移動し、マウスを右クリックし「新規作成(X)」→「テキスト ドキュメント」を選択してください。
「テキスト ドキュメント」のファイル名を、まずは「settings.txt」として保存し、下記の内容を記載してください。
記入内容の例(***** は Microsoft Azureで設定したパスワード)
<settings>
<servers>
<server>
<id>ftp-repository</id>
<username>yosshi2007-jetty\yosshi2007-dep</username>
<password>********</password>
</server>
</servers>
</settings>
テキストの編集が終わったのち、別名でファイルを保存します。メニューより「ファイル」→「名前をつけて保存(A)…」を押下してください。
「名前を付けて保存(A)…」を押下すると下記の画面が表示されます。ここで、まず「ファイルの種類(T):」を「すべてのファイル」に変更してください。そして次に、「ファイル名(N):」に「settings.xml」と記載し「保存(S)」ボタンを押下してください。
「settings.xml」を作成したら、テキストファイルは不要ですので削除しておきます。「settings.txt」を右クリックし「削除(D)」を押下してください。
ここまでの設定を正しく完了すると「.m2」ディレクトリには「repository」ディレクトリと「settings.xml」ファイルの２つが存在しています。
FTPへの接続設定が終わったのち、NetBeansの画面に戻ってください。「settings.xml」ファイルが正しく作成されている場合、NetBeansの環境からも「settings.xml」ファイルが参照できるようになります。
上記でFTPホストへの接続用の設定が完了です。
次に、Mavenプロジェクトの構成を行います。プロジェクトの構成をおこなうためMavenではPOM(Project Object Model) を設定します。今回NetBeansでMavenプロジェクトとしてプロジェクトを作成しましたので、すでに「プロジェクト・ファイル」の配下に設定用のファイル「pom.xml」ファイルが存在しています。このファイルを修正してください。
今回、プロジェクトをコンパイルしてビルドした後、自動的にFTPホストに対して成果物を転送するように設定します。pom.xml に追加する XML のコードは下記でハイライトした２箇所です。特に、ftp://waws-prod-os1-001.ftp.azurewebsites.windows.netと記載している箇所は注意してください。ここに記載する内容は、Microsoft Azureのポータルで記載されたFTPホスト名を指定します。
<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">
<modelVersion>4.0.0</modelVersion>
<groupId>com.mycompany</groupId>
<artifactId>Azure-Jetty9-WebSocket-Chat</artifactId>
<version>1.0-SNAPSHOT</version>
<packaging>war</packaging>
<name>Azure-Jetty9-WebSocket-Chat</name>
<properties>
<endorsed.dir>${project.build.directory}/endorsed</endorsed.dir>
<project.build.sourceEncoding>UTF-8</project.build.sourceEncoding>
</properties>
<dependencies>
<dependency>
<groupId>javax</groupId>
<artifactId>javaee-web-api</artifactId>
<version>7.0</version>
<scope>provided</scope>
</dependency>
</dependencies>
<build>
<extensions>
<extension>
<groupId>org.apache.maven.wagon</groupId>
<artifactId>wagon-ftp</artifactId>
<version>1.0-beta-3</version>
</extension>
</extensions>
<plugins>
<plugin>
<groupId>org.mortbay.jetty</groupId>
<artifactId>jetty-maven-plugin</artifactId>
<version>9.1.0.v20131115</version>
</plugin>
<plugin>
<groupId>org.codehaus.mojo</groupId>
<artifactId>wagon-maven-plugin</artifactId>
<version>1.0-beta-3</version>
<executions>
<execution>
<id>upload-war</id>
<phase>install</phase>
<goals>
<goal>upload</goal>
</goals>
<configuration>
<fromDir>${basedir}/target</fromDir>
<includes>${project.build.finalName}.war</includes>
<url>
ftp://waws-prod-os1-001.ftp.azurewebsites.windows.net
</url>
<toDir>/site/wwwroot/webapps/</toDir>
<serverId>ftp-repository</serverId>
</configuration>
</execution>
</executions>
</plugin>
<plugin>
<groupId>org.apache.maven.plugins</groupId>
<artifactId>maven-compiler-plugin</artifactId>
<version>3.1</version>
<configuration>
<source>1.7</source>
<target>1.7</target>
<compilerArguments>
<endorseddirs>${endorsed.dir}</endorseddirs>
</compilerArguments>
<failOnMissingWebXml>false</failOnMissingWebXml>
</configuration>
</plugin>
<plugin>
<groupId>org.apache.maven.plugins</groupId>
<artifactId>maven-war-plugin</artifactId>
<version>2.3</version>
<configuration>
<failOnMissingWebXml>false</failOnMissingWebXml>
</configuration>
</plugin>
<plugin>
<groupId>org.apache.maven.plugins</groupId>
<artifactId>maven-dependency-plugin</artifactId>
<version>2.6</version>
<executions>
<execution>
<phase>validate</phase>
<goals>
<goal>copy</goal>
</goals>
<configuration>
<outputDirectory>${endorsed.dir}</outputDirectory>
<silent>true</silent>
<artifactItems>
<artifactItem>
<groupId>javax</groupId>
<artifactId>javaee-endorsed-api</artifactId>
<version>7.0</version>
<type>jar</type>
</artifactItem>
</artifactItems>
</configuration>
</execution>
</executions>
</plugin>
</plugins>
</build>
</project>
「pom.xml」ファイルを修正したのち、NetBeansのプロジェクトを確認すると下記のような画面が表示されています。MavenのプロジェクトからFTPコマンドを実行するためのライブラリ(wagonのプラグイン)が不足しているため、プラグインのライブラリを利用できるようにMavenのセントラル・レポジトリから必要なファイルを入手してください。ライブラリを入手するために、プロジェクトを右クリックしたのち「依存性でビルド」を押下してください。
「依存性でビルド」を実行すると必要なファイルを自動的にネットワーク経由で入手しビルドを実行します。また、ビルドが完了すると指定したFTPホストに対して自動的にファイルを転送します。すべての作業が成功すると緑色の文字で「BUILD SUCCESS」と表示されます。
以上で、NetBeansのプロジェクトのビルドからFTPホストへのファイル転送までが完了です。実際に作成したプロジェクトがサーバ上で利用できるようになっているか確認しましょう。
Microsoft Azure のポータル画面から、「http://」ではじまるURLのリンクを押下してください。
リンクを押下するとブラウザが起動し自動的に下記の画面が表示されます。下記のように表示されていれば成功です。
次に、作成した Web アプリケーションのアドレス(コンテキスト・ルート)に対して接続してください。
アクセスするURLの例
http://azure-hostname.azurewebsites.net/Azure-Jetty9-WebSocket-Chat/
アクセスするとデプロイしたアプリケーションのトップページが表示されます。
次に、NetBeansに戻り、index.htmlファイルを押下したのち、<h1>Hello World !</h1>と記載されている箇所を<h1>こんにちは 世界!</h1>と修正してください。
ファイルを修正したのち、プロジェクトを右クリックし「ビルド」を押下してください。
「ビルド」を選択すると自動的にビルドが実行されFTPホストに対してファイル転送がおこなわれます。正常にビルドが完了すると緑色の文字で「BUILD SUCCES」が表示されます。
「BUILD SUCCESS」が表示されたのち、ブラウザで再読み込みをしてください。下記のように修正した内容が反映されていれば成功です。
今回は、Microsoft Azureと統合開発環境で作成したアプリケーションを連携するための設定を行いました。上記の設定が完了すると、ビルドを実行するたびに自動的にWebアプリケーションを更新できるようになります。
Entry filed under: 未分類.
寺田 佳央 - Yoshio Terada 