Quoridorn Server を設置

Quoridornを自宅サーバーに導入する為には、
Quoridorn-ServerとQuoridorn-Cliantの2つを設置する必要があります。
まずは、サーバー側から片付けていきましょう。
レンタルサーバーへの設置は、分かりません。参考にはなるかもしれません…たぶん。

#1 Mongdb をインストール
まずは、サーバーの動作に必要なMongodbというデータベースを入れていきます。

1-1.インストールするパッケージを認証するためのキーをインポート

sudo wget https://www.mongodb.org/static/pgp/server-4.2.asc
sudo apt-key add server-4.2.asc

1-2.APTの設定ファイルに、レポジトリ情報を追加

echo "deb https://repo.mongodb.org/apt/ubuntu xenial/mongodb-org/4.2 multiverse" | sudo tee /etc/apt/sources.list.d/mongodb-org-4.2.list

1-3.インストール

sudo apt update
sudo apt -y install mongodb-org

1-4.起動

sudo ufw allow 27017
sudo systemctl enable mongod
sudo systemctl start mongod

1-5.MongoDBに接続/切断

mongo
db.version()
show dbs
exit

1-6.インストールが上手く行かない場合
パージして入れ直します。dbやlog、pid等の設置場所、パーミッションをよく見ましょう。

sudo apt purge mongodb-org* #パージ！
sudo apt uodate
sudo apt upgrade

sudo rm /tmp/mongodb-27017.sock #ゴミ掃除
ps aux | grep mongo
kill -9 2411

sudo apt install mongodb #← この一行で何故か上手くいく
mongod --version
sudo apt install -y mongodb-org
mongod --version

sudo systemctl unmask mongodb #エラー回避
sudo systemctl enable mongod
sudo service mongod start
sudo service mongod status

参考
・ Install MongoDB Community Edition on Ubuntu
・ 「Failed to set up listener: InternalError: Failed to set up sockets」
・ error: Unit mongodb.service is masked when starting mongodb
・ MongoDB service failed to start (unrecognized service )
・ 「Failed to set up listener: InternalError: Failed to set up sockets」

#2 Nodejs, Vue CLI をインストール
次はNodejsです。npm というパッケージ管理ソフトで導入します。

2-1.インストール
まず、普通に apt でnodejs と npm をインストールしてから npm で入れ直します。

sudo apt install -y nodejs npm
mkdir /home/usr/.node_modules_global
npm install npm -g
sudo chown usr:usr -R /home/usr/.npm/_cacache

2-2.バージョン管理ツール “n” と Vue CLI
バージョン管理ツール ”n” を入れて任意の Node.js を入れます。
必ず Ver 11.x を入れてください。それ以外ではビルド出来ませんでした。(私の環境では)

npm install -g @vue/cli n
sudo mkdir /usr/local/n/versions/node
sudo n 11.10.0

2-3.古い Node.js, npm を削除。
最初に apt で入れた nodejs と npm を消します。
そして、最後にヴァージョンをチェック。

sudo apt purge -y nodejs npm
exec $SHELL -l

n list
node/10.20.1
node/11.10.0
node/11.15.0
node/12.16.2
node/13.13.0
node/14.0.0

node -v
v11.10.0

参考
・ Ubuntuに最新のNode.jsを難なくインストールする

#3 Quoridorn-Server をインストール
ようやく、サーバ本体です。
ここでは、 /home/usr/quoridorn-server/ に設置した場合の説明になります。

3-1.ソースコードをダウンロード
quoridorn-server というフォルダにダウンロードされます。

git clone https://github.com/HillTopTRPG/quoridorn-server.git
cd /quoridorn-server

3-2.ライブラリのインストール、ビルド
Mac用ライブラリ(fsevents@1.2.11)の警告がいくつか出ますが、無視します。

npm install
npm run build

3-3.Quoridornサーバの設定を編集
/home/usr/quoridorn-server/conf/server.yaml をエディタで編集します。
ファイル内の説明をよく読んで、変更していきましょう。
下記の設定は、使用ポート3000、部屋数100、部屋は放置しても消えない。です。

port: 3000
storeType: mongodb
secretCollectionSuffix: nakachan-mo-kirai-ni-nattya-damedayo
roomNum: 100
roomAutoRemove: -1
mongodbConnectionStrings: mongodb://127.0.0.1:27017/

3-4.Quoridornサーバの動作チェック
とりあえず、起動してみます。
Quoridorn Server is Ready と表示されれば成功です。やったね！
Ctrl+C で一旦停止します。

npm run node-server

3-5.Quoridornサーバをバックグラウンドで動作させる
このままだと、ターミナルを閉じるとサーバーが落ちてしまい使い勝手が悪いです。
そこで、プロセスマネージャ “pm2” を使用し、バックグラウンドで自動起動させます。

npm install -g pm2

設定ファイルを作成します。
JSONかyaml形式に対応していますが、yamlが簡単なのでオススメ。
/home/usr/quoridorn-server/pm2_config.yml

name:      quoridorn-server　 　　　　　　＃アプリ名前
script:    ./dist/server.js　　　　　　　 ＃スクリプトファイルパス
cwd:       /home/usr/quoridorn-server/　 ＃作業フォルダ
exec_mode: fork　　　　　　　　　　　 　　 ＃cluster modeはパフォーマンス低下？
NODE_ENV:  production　　　　　　　 　  　＃環境
PORT:      3000　　　　　　　　　　　　　　＃使用ポート

自動起動出来るように登録します。
環境によって違うので、記事そのままをコピペしても動かない場合があります。

＃とりあえず動かしてみる
pm2 start '/home/usr/quoridorn-server/pm2_config.yml'

＃以下のコマンドを実行すると、コピペして実行してねと言われる。
pm2 startup

＃私の場合、以下をコピペして実行。環境によって違います。
sudo env PATH=$PATH:/usr/local/bin /home/usr/.node_modules_global/lib/node_modules/pm2/bin/pm2 startup systemd -u usr --hp /home/usr

＃登録
pm2 save

実際に動作しているか確認します。

pm2 list
pm2 show quoridorn-server
pm2 monit

参考
・ [Node.js] PM2を用いて本番環境でNodeJSアプリを動かす
・ pm2でNode.js実行環境を整備する
・ node.jsを10->12に更新したときに起きたエラーと対処内容

Quoridorn Mark2 を設置

#4.Quoridorn-Mark2をインストール
サーバー側の準備が出来たので、やっとクライアント側であるMark2の設置です。
なお、Nginxは導入済み、動作済みのものとして書いていきます。

4-1.環境を確認
ポートが開放されていないと動作しないので、確認しましょう。
下記は、SSL、IPv6、Websocket(udp)対応の事例です。

nginx -v
nginx version: nginx/1.17.9

npm -v
6.14.4

node -v
v11.10.0

mongod -version
db version v4.2.5

openssl version
OpenSSL 1.1.0h

sudo ufw status
To                 Action    From
--                 ------    ---
80                 ALLOW     Anywhere
443                ALLOW     Anywhere                  
3000               ALLOW     Anywhere        ＃3000はQuoridorn用
443/udp            ALLOW     Anywhere                 
27017              ALLOW     Anywhere        ＃27017はMongoDB用
80 (v6)            ALLOW     Anywhere (v6)   ＃↓ここからIPv6用    
443 (v6)           ALLOW     Anywhere (v6)             
3000 (v6)          ALLOW     Anywhere (v6)             
443/udp (v6)       ALLOW     Anywhere (v6)             
27017 (v6)         ALLOW     Anywhere (v6)   

4-2.ソースコードをダウンロード
/home/usr/ にダウンロード。quoridorn-mark2 が自動で作られます。
フォルダ名を変えたい場合は、末尾に任意のフォルダ名を追記しましょう。

git clone https://github.com/HillTopTRPG/quoridorn-mark2.git

4-3.必要なライブラリをインストール
エラーが出たら、package-lock.json と node_modules を削除。再 install & build しましょう。

cd home/usr/quoridorn-mark2
npm init     ＃npmで管理するよと宣言
npm install  ＃必要なライブラリを取得

4-4.設置場所を指定
.env をエディタで編集して設置パスを指定します。
空欄にすると、 home/usr/quoridorn-mark2/dist/ が設置場所になります。
ここでは空欄を入れています。
/home/usr/quoridorn-mark2/.env

VUE_APP_BASE_URL=

4-5.ビルド

npm run build

4-6.環境設定を編集
ネットワーク周りの設定をしていきます。
skywayApikeyは、事前に取得したkeyを入力します。取得方法はこちらを参照のこと。
/home/usr/quoridorn-mark2/dist/static/conf/connect.yaml

quoridornServer:   "wss://kancolle.idol.world"        ＃wss://your.site
socketTimeout:     50000
bcdiceServer:      "https://bcdice.onlinesession.app" ＃そのまま
skywayApiKey:      "nakatyaN-kawaii-Idol-Korekaramo-4649Ne"
skywayConnectType: "Mesh"

#5.Nginx の設定
NginxからNode.jsへリバースプロキシする設定を加えます。
/etc/nginx/quoridorn-mk2.conf

upstream socket_io {
    ip_hash;
    server 127.0.0.1:3000;
}
server {
    listen       80;
    listen       [::]:80;
    server_name  kancolle.idol.world;
    return 301 $host$request_uri;
}
server {
    listen       443 ssl http2 ;
    listen       [::]:443 ssl http2;
    server_name  kancolle.idol.world;

    ssl_protocols TLSv1.2 TLSv1.3;
....
    location / {
         root    /home/usr/quoridorn-mark2/dist/;
    }
    location /socket_io/ {
        proxy_pass http://socket_io;
        proxy_http_version 1.1;
        proxy_set_header Upgrade    $http_upgrade;
        proxy_set_header Connection "upgrade";
        proxy_set_header Host       $host;
        }
}

Nginxを再起動。ブラウザで確認します。

sudo nginx -t
sudo service nginx restart

関連リンク
公式　：Quoridorn-mark2
設置例：コリドーン 英国メイドサーバー(test)