Mix Space は、シンプルでありながら複雑さのない個人ブログシステムです。それは速く、現代的です。それを使用して、自分自身の個人スペースを構築し、生活を記録し、知識を共有することができます。
ステップ 0: はじめに#
実際には、Mix-Space を切り替える前に、個人のメインブログシステムとして Hexo を使用していました。しかし、Hexo は軽量で高速で完全に静的ですが、設定が統一されておらず、記事の作成が少し面倒であるという問題に常に悩まされていました。検討した結果、新しいブログシステムを探すことにしました。
最初の選択肢は VanBlog でした。バックエンドは便利で、フロントエンドは基本的に静的で、フロントエンドとバックエンドが分離しているデザインはとても良さそうに見えましたが、実際に使ってみると、私の使用に影響を与えるさまざまな小さな問題があることがわかりました。例えば:
- コメントシステムには組み込みの Waline が使用されていますが、その設定は完全ではなく、内部の iFrame が管理ページに関するいくつかの不明な問題を引き起こすことがよくあります。
- リンクと寄付情報に使用される変数テーブルの編集可能性が低い
- ページがやや古く、一部のページ(例:リンク)のレスポンシブ性が一般的ではない
これは、開発段階にあるためかもしれませんが、私は自分に合ったブログシステムを再び探すことにしました。
そして、Shiro を見つけました(実際、以前に少し見たことがありましたが、当時は Hexo を使用することもできると思ったので、詳しく調べませんでした)。Shiro とそのバックエンドである Mix-Space を詳しく調べた結果、私の要件に合っているようです。
また、Shiro を Vercel や Netlify などの Serverless プラットフォームにデプロイすることもでき、一定の速度を保証しながらサーバーの負荷を軽減できるので、とても良い感じですね?
ステップ 1: バックエンドのデプロイ#
タイトルの通り、私は 1Panel というサーバー管理パネルを使用しています。これはオープンソースで高速なサーバー管理パネルであり、私の使用習慣に合っているため、宝塔と比較しても優れています。また、オープンソースであるため、監視やバックドアの問題を心配する必要もありませんし、コンテナ化の機能もサーバーアプリケーションの実行をより安全にします。
1Panel では、一般的にアプリケーションは Docker コンテナ化デプロイを推奨しており、管理とインストール / アンインストールが容易です。
私は Mix-Space の公式の Docker Compose デプロイ方法を使用しましたが、私の要件に合うように少し変更を加えました。
使用した Docker Compose ファイルは以下のようになります。1Panel の使用に合わせて変更されていることに注意してください。
version: '3.8'
services:
app:
container_name: Mx-Space
image: innei/mx-server:5
command: bash ./docker-run.sh
environment:
- TZ=Asia/Shanghai
- NODE_ENV=production
- ALLOWED_ORIGINS
- JWT_SECRET
- ENCRYPT_KEY
- ENCRYPT_ENABLE
volumes:
- ./data/mx-space:/root/.mx-space
ports:
- '127.0.0.1:2333:2333'
depends_on:
- mongo
- redis
links:
- mongo
- redis
networks:
- 1panel-network
restart: always
healthcheck:
test: ['CMD', 'curl', '-f', 'http://127.0.0.1:2333/api/v2/ping']
interval: 1m30s
timeout: 30s
retries: 5
start_period: 30s
mongo:
container_name: mongo
image: mongo
volumes:
- ./data/db:/data/db
ports:
- "127.0.0.1:27017:27017"
networks:
- 1panel-network
restart: always
redis:
container_name: redis
image: docker.dragonflydb.io/dragonflydb/dragonfly
networks:
- 1panel-network
ulimits:
memlock: -1
ports:
- "127.0.0.1:6379:6379"
volumes:
- ./data/redis:/data
networks:
1panel-network:
external: true
私が Mix-Space 公式の Compose ファイルに対して行った変更は次のとおりです:
- Docker ネットワークを 1Panel の
1panel-network
Docker ネットワークに変更し、リバースプロキシと 1Panel の他のサービスとの連携がより簡単になりました。 - Core バックエンドのアドレスを
0.0.0.0:2333
から127.0.0.1:2333
に変更し、サーバー内部でのみブロードキャストされるようにしました。より安全です。 - Redis データベースサービスを DragonflyDB に置き換えました。これは Redis と互換性のあるデータベースサービスで、公式ドキュメントによると、読み書きの効率は Redis の 20 倍であり、並行性も高いです。もしこれが好きではない場合は、Mix-Space の公式ドキュメントを参照して標準の Redis サービスに自分で置き換えることもできます。
サービスの起動#
サービスの起動は簡単です。Docker と Docker Compose サービスを別途インストールする必要はありません。なぜなら、1Panel パネルのインストール時にこれらのサービスが事前にインストールされているからです。Mix-Space 公式ドキュメントに書かれているように、新しいディレクトリを作成します:
cd && mkdir -p mx-space/core && cd $_
# 私が変更したdocker-compose.ymlファイルを取得する
wget https://fastly.jsdelivr.net/gh/yzsong06/File@main/Mix-Space/docker-compose.yml
.env
ファイル#
# JWTシークレット:16文字以上32文字以下の文字列を入力する必要があります。これはユーザーのJWTを暗号化するために使用されます。自分のシークレットキーを保存し、他の人に漏らさないようにしてください。
JWT_SECRET=
# 許可されたオリジン:許可されたオリジンを入力する必要があります。通常、フロントエンドのドメインです。複数のドメインを許可する場合は、英語のカンマで区切ります。
ALLOWED_ORIGINS=
# 暗号化を有効にするかどうか:暗号化を有効にする場合は、falseをtrueに変更します。暗号化を有効にすると、以下の暗号化キーを入力する必要があります。
ENCRYPT_ENABLE=
# 暗号化キー:これが何であるかわからない場合は、この機能を有効にすることはお勧めしません。具体的な内容については、https://mx-space.js.org/usage/security.htmlを参照してください。
ENCRYPT_KEY=
# 暗号化を有効にする場合、キーの長さは64ビットでなければならないことに注意してください。これは不可逆ですので、自分のキーを保存してください。したがって、暗号化を使用することは非常にお勧めしません。
次に、docker-compose.yml
を配置したディレクトリ(通常はサーバーの /root/mx-space/core)に移動し、.env
ファイルを作成し、上記のパラメータを貼り付け、必要に応じて値を変更します。イコールの後ろに値を直接書くだけで、スペースは不要です。
次に、ターミナルに戻り、次のコマンドを入力します(以下のコマンドを実行するときは、サーバーのルートディレクトリにいることに注意してください。以下のコマンドを分割して実行することもできます):
cd mx-space/core && docker compose up -d
これにより、Docker コンテナが作成され、作成が完了するのを待ってからサービスが自動的に起動します。これでバックエンドの設定が完了しました。
ステップ 2: リバースプロキシの設定#
必須の設定ではありませんが、個人的なテストではリバースプロキシプログラムを設定しなくても正常に動作しました。
1Panel でのリバースプロキシの設定は、宝塔とほぼ同じです。ビジュアルな管理パネルがあるので、非常に便利です。
1Panel のウェブサイト
に移動し(事前に Openresty をインストールする必要があります)、新しいウェブサイト
を選択し、リバースプロキシ
を選択します。ドメインにはバックエンドのドメインを入力し、リバースプロキシアドレスには127.0.0.1:2333
を入力し、新しいウェブサイト
を選択すると、リバースプロキシサービスが起動します。この時点で、もう少し設定を行って、より良い動作をするようにします。
対応するウェブサイトサービスの設定
に移動し、設定ファイル
を見つけ、Mix-Space 公式ドキュメントに記載されているように、リバースプロキシの設定を追加します。すでに Server ヘッダーがあるはずなので、以下の内容を追加します:
location /socket.io {
proxy_pass http://127.0.0.1:2333/socket.io;
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header REMOTE-HOST $remote_addr;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection "upgrade";
proxy_buffering off;
proxy_http_version 1.1;
add_header Cache-Control no-cache;
}
location / {
proxy_pass http://127.0.0.1:2333;
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header REMOTE-HOST $remote_addr;
add_header X-Cache $upstream_cache_status;
}
完了したら、保存して再読み込み
を選択し、パネル上でHttps
を設定した後、バックエンドのドメイン({ドメイン}/proxy/qaqdmin)にアクセスすると、管理パネルが表示されます。
ステップ 3: テーマの設定#
ここでは、フロントエンドのテーマの設定方法については詳しく説明しません。詳細については、公式ドキュメントを参照してください。