クイックスタート

HAP Server のインストール

※すでにインストール済みの場合は本手順を省略してください。

Web サービスは HAP Server マイクロサービス群の一部であり、単独での利用はできません。二次開発の前に、HAP Server（v2.8.0 以上）のデプロイが必要です。詳細はクイックインストールガイドをご参照ください。

開発

環境準備

推奨環境：メモリ 4GB 以上搭載の開発端末へ Node.js 12.18.3 以上をインストールしてください。

開発ツール

推奨： Visual Studio Code

プロジェクトのクローン

git clone git@github.com:mingdaocom/pd-openweb.git

依存パッケージのインストール

コマンド yarn（推奨）または npm install を実行してください。

API サーバーアドレスの設定

package.json の start コマンド内 API_SERVER の値を編集してください。API_SERVER には最初の手順でデプロイした HAP システムのアクセスアドレスを指定します。開発時には API リクエストがこのアドレスへプロキシされます。

例：

"start": "cross-env API_SERVER=http://172.17.30.60:8880 node --max-old-space-size=8192 ./node_modules/gulp/bin/gulp.js dev:main"

プロジェクトの起動

npm start

リリース

package.json にはあらかじめ2つのコマンド release および publish が設定されています。API_SERVER および WEBPACK_PUBLIC_PATH は必要に応じて編集可能です。

"release": "cross-env NODE_ENV=production node --max-old-space-size=8192 ./node_modules/gulp/bin/gulp.js release",
"publish": "cross-env NODE_ENV=production API_SERVER=/wwwapi/ WEBPACK_PUBLIC_PATH=/dist/pack/ node --max-old-space-size=8192 ./node_modules/gulp/bin/gulp.js publish"

release ：フロントエンドコードのコンパイル
publish ：公開に必要なテンプレートおよびファイルの処理
- API_SERVER ：API アドレス
- WEBPACK_PUBLIC_PATH ：ページスクリプト参照パスのプリフィックス。デフォルトは /dist/pack/ です。CDN で高速化する場合は ${CDN_HOST}/dist/pack/ の形式で編集します。

npm run release と npm run publish を順番に実行してください。リリース完了後、ビルドされたファイルは全てルートディレクトリ内の build フォルダに出力されます。

デプロイ

イメージをビルドする前に docker/nginx.conf の編集が必要です。rewrite で始まるすべての記述のターゲットアドレスに、システムのアクセスアドレスを追加してください（http/https のデフォルトポート 80/443 には追加不要ですが、サブパスがある場合は追加してください）。例：rewrite (?i)^/app/my http://172.17.30.60:8880/ mobile/appHome redirect;

フロントエンドプロジェクトの Docker 展開が必要な場合は、docker フォルダ内の Dockerfile を利用して直接イメージビルドが可能です。以下は Linux Jenkins を用いたビルド手順例です。

# Node.js 12.18.3 以上の環境が必要です
# PATH=/usr/local/node-12.18.3/bin:$PATH
# コミットログ送信
git log -n 1
# クリーンアップ
git clean -fdx -e node_modules -e packages
rm -f yarn.lock
# 依存パッケージインストール
npm install
# ビルド
npm run release
# 公開
npm run publish
# 使用するイメージリポジトリに応じてアドレスを編集
REGISTRY_PATH=hub.doamon.com/hap/web
# タグ
BUILD_DATE=$(date +%Y%m%d_%H%M)
IMAGE_NAME=$REGISTRY_PATH:$BUILD_DATE
# イメージビルド
docker build --no-cache -t $IMAGE_NAME -f ./docker/Dockerfile .
# イメージリポジトリへプッシュ
docker push $IMAGE_NAME

イメージのプッシュが完了したら、デプロイサーバーでイメージをプルし起動できます。例：docker run -d --rm -p 80:80 hub.doamon.com/hap/web:20210801_1111

インテグレーション

フロントエンドプロジェクトのデプロイ後、フロントサイトのサービスアドレスを HAP マイクロサービスアプリケーションコンテナに設定する必要があります。以下のように、該当マイクロサービスアプリケーションの docker-compose.yaml を編集し、環境変数 ENV_WEB_ENDPOINTS（複数指定時は半角カンマ区切り）を追加してください。設定後はサービス再起動が必要です。

services:
  app:
    environment:
      ENV_WEB_ENDPOINTS: "172.17.30.60:80,172.17.30.60:81"

HAP Server のインストール​

開発​

リリース​

デプロイ​

インテグレーション​

HAP Server のインストール

開発

リリース

デプロイ

インテグレーション