ゲーム プログラミング

Microsoft AzureでNode.jsゲームをデプロイ – web.configを忘れるな

投稿日:

Node.js+Three.jsでフォートナイトのような建築FPSゲームを自作しております。Paasサービスは手軽で太っ腹なHerokuを利用していますがサーバーがアメリカにあるため通信ラグに悩まされております。
そこでメジャーなサービスであり、日本のサーバーがしようできる「Microsoft Azure」を使ってみました。クレジットカード番号の登録が必要で少し不安になりますが、無料プランの無料枠を使い切ってから従量課金への移行を選択しない限り課金される心配はないようです。

登録からデプロイまでの流れ

メジャーなサービスなので登録からデプロイまでの手順はしっかりとしたガイドラインがあるのでスムーズにいきました。ただし、非常に多くの選択肢があるので情報量が多すぎて迷う事があるかもしれません。

私は以下のような手順でデプロイしました。
・Azureに登録(マイクロソフトアカウントを使用)
・無料プランで利用開始
・Webアプリ(Node.js)を選択
・デプロイ方法はfilezilla経由(FTP)

GitHubやCLIなども用意されていますが、ホームページ感覚でデプロイできるのでFTPを使用しました。なおFFFTPでデータをアップしようとしましたが、私はうまくいかなかったのでfilezillaをインストールして使用したところ簡単にデプロイできました。

web.configにアプリ起動に関する情報がある

すんなりいけば登録から自作ゲームのデプロイまで1時間もかからないかもしれません。しかし私は一か所つまずいてしまい半日ほどかかってしまいました。filezillaですべてのファイルのアップロードに成功しましたが、アプリURLを何度リロードしてもhostingstart.htmlの内容しか表示されません。どうやらゲーム起動ができていないようです。

Herokuの場合は「Procfile」という拡張子なしのファイルをルートディレクトリに置き、ファイルに

web: node server.js

と書けばOKでした。これでサーバーサイドのJavascriptファイルが実行されます。
アプリ起動のコマンドを記載する場所に関する情報は公式のガイドラインに見当たりませんでした。ここから数時間、ひたすらGoogle検索です。そしてデプロイに成功した人の記事でやっと情報を見つけました。

Azureでは「web.config」というファイル内にアプリ起動に関する情報を含めるようです。しかし、フォーマットが分かりません。どうやら一度、チュートリアルで例題アプリのデプロイを行い、その際にルートディレクトリに自動生成されるweb.configファイルをコピーして利用必要があるようです。

私は例題をやるのが面倒だったのでどなたかがブログに挙げているweb.configのソース(GitHubなどにもあるようです)をコピーして、サーバーサイドJSファイル名を自分のもの「server.js」に書き換えました。

以下、コードです。
weg.config

<?xml version="1.0" encoding="utf-8"?>
<!--
     This configuration file is required if iisnode is used to run node processes behind
     IIS or IIS Express.  For more information, visit:

     https://github.com/tjanczuk/iisnode/blob/master/src/samples/configuration/web.config
-->

<configuration>
  <system.webServer>
    <!-- Visit http://blogs.msdn.com/b/windowsazure/archive/2013/11/14/introduction-to-websockets-on-windows-azure-web-sites.aspx for more information on WebSocket support -->
    <webSocket enabled="false" />
    <handlers>
      <!-- Indicates that the server.js file is a node.js site to be handled by the iisnode module -->
      <add name="iisnode" path="server.js" verb="*" modules="iisnode"/>
    </handlers>
    <rewrite>
      <rules>
        <!-- Do not interfere with requests for node-inspector debugging -->
        <rule name="NodeInspector" patternSyntax="ECMAScript" stopProcessing="true">
          <match url="^server.js\/debug[\/]?" />
        </rule>

        <!-- First we consider whether the incoming URL matches a physical file in the /public folder -->
        <rule name="StaticContent">
          <action type="Rewrite" url="public{REQUEST_URI}"/>
        </rule>

        <!-- All other URLs are mapped to the node.js site entry point -->
        <rule name="DynamicContent">
          <conditions>
            <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="True"/>
          </conditions>
          <action type="Rewrite" url="server.js"/>
        </rule>
      </rules>
    </rewrite>

    <!-- 'bin' directory has no special meaning in node.js and apps can be placed in it -->
    <security>
      <requestFiltering>
        <hiddenSegments>
          <remove segment="bin"/>
        </hiddenSegments>
      </requestFiltering>
    </security>

    <!-- Make sure error responses are left untouched -->
    <httpErrors existingResponse="PassThrough" />

    <!--
      You can control how Node is hosted within IIS using the following options:
        * watchedFiles: semi-colon separated list of files that will be watched for changes to restart the server
        * node_env: will be propagated to node as NODE_ENV environment variable
        * debuggingEnabled - controls whether the built-in debugger is enabled

      See https://github.com/tjanczuk/iisnode/blob/master/src/samples/configuration/web.config for a full list of options
    -->
    <!--<iisnode watchedFiles="web.config;*.js"/>-->
  </system.webServer>
</configuration>

web.configファイルをルートディレクトリにアップしたところ、無事にゲームが起動しました。
実際にプレイした動画です。

以上です。

-ゲーム, プログラミング

執筆者:

関連記事

Macでフォートナイトが起動できない場合の対処 – MacBook Pro

目次 チャプター2シーズン4Macでチャプター2シーズン4をプレイする方法チャプター2シーズン3Epic Game Launcherが起動できない場合の対処法諦めてゲーミングWindowsPCを購入 …

ライフゲームをブラウザで遊ぶ / Conway’s Game of Life

ブラウザで遊べるライフゲーム(Conway’s Game of Life)を作成してみました。緑の自セルを配置して赤い敵セルを消してみましょう。基本的なパターンの動きを確認するも良し。パタ …

エピックのアップル提訴問題 じゃあフォートナイトフォン作っちゃいなよ

8月13日、フォートナイトの開発元の米エピックゲームズがスマホアプリ課金システムなどが独占に当たるとして米アップルと米グーグルを提訴したそうです。現在、多数のフォートナイトプレイヤーYouTuberの …

Webブラウザ版フォートナイト?を自作してみた(その2)|Node.js + Three.js

1年半前くらいに簡易版フォートナイトをNode.jsとJavascriptで自作して放置していましたが、もう少し本家に近づけようと思いコードを改善し始めました。以前よりフォートナイトプレイの腕が上がっ …

Fortnite won’t launch. How to fix it? [Mac OSX/MacBook pro]

[Last verification: 2020/07/19 v13.20 ][Solution]Just update the Mac OSX to 10.15 (Catalina).With 10 …

スポンサーリンク