Mix Space Deployment

Intro#

Please use a system with at least 1C1G, as there may be issues during front-end compilation with only 1G of memory.

It is recommended to use modern Linux operating systems such as Ubuntu. Using operating systems like CentOS 7 may result in deployment failure due to the inability to install a high enough version of Node.js.

Backend Deployment#

Reference: https://mx-space.js.org/docs/docker

Install Docker#

If your server is in China, it is recommended to use Alibaba Cloud's image acceleration. The installation command is as follows:

curl -fsSL https://get.docker.com | bash -s docker --mirror Aliyun

If you are outside of China, you can directly use the official script for installation:

curl -fsSL https://get.docker.com | bash -s docker

If you have successfully installed Docker and Docker-Compose, you can check the versions with the following commands:

docker -v
docker compose version

Deployment#

Pull the configuration file

cd && mkdir -p $HOME/mx-space/core && cd $_ # Pull the docker-compose.yml file
wget https://fastly.jsdelivr.net/gh/mx-space/core@master/docker-compose.yml

Create environment variables

vi .env

After entering the following content, press the ESC key, then enter :wq to save and exit

JWT_SECRET= #JWT Secret: You need to enter a string with a length of at least 16 characters and no more than 32 characters as the JWT secret key for encrypting user JWT. Be sure to keep your key secure and do not disclose it to others.
ALLOWED_ORIGINS= #Allowed Origins: You need to enter the allowed domain name, usually the domain name of the front-end. If multiple domain names are allowed to access, separate them with commas.
ENCRYPT_ENABLE= #If you want to enable encryption, change false to true. After enabling encryption, you need to enter the encryption key below.
ENCRYPT_KEY= #If you don't know what this is, it is not recommended to enable this feature. For more information, please refer to https://mx-space.js.org/usage/security.html

Start the backend

docker compose up -d

Frontend Deployment#

Reference: https://mx-space.js.org/themes/shiro

Preparations#

Deploy and start the backend
Register a Clerk account and obtain the public and private keys: Reference
Install node.js and pnpm

Deployment#

Clone the repository (using Shiro as an example)

git clone https://github.com/Innei/Shiro $HOME/mx-space/Shiro && cd $HOME/mx-space/Shiro

Generate environment variables

vi .env

After entering the following content, press the ESC key, then enter :wq to save and exit

NEXT_PUBLIC_API_URL=https://yourdomain/api/v2 
NEXT_PUBLIC_GATEWAY_URL=https://yourdomain
NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY=pk_test_XXXX
CLERK_SECRET_KEY=sk_test_XXXX

Install dependencies and start

sudo pnpm i
sudo pnpm build
npx next start -p 2323

If the frontend starts successfully, you can use pm2 for deployment

npm install -g pm2
pm2 start #
pm2 restart 0 #Use this command to redeploy after recompiling, where 0 is the task number

Nginx Reverse Proxy#

Point the domain name to the server.
Apply for a certificate according to the method in this article.
Set up the reverse proxy:
```
vi /etc/nginx/nginx.conf
```
Modify the domain name and certificate path in the example below, and add it to the configuration file:

Click to get the example

server {
    listen 80;
    listen 443 ssl http2 ; 
    ## Bind the domain name
    server_name www.example.com; 
    index index.html; 
    proxy_set_header Host $host; 
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; 
    proxy_set_header X-Forwarded-Host $server_name; 
    proxy_set_header Upgrade $http_upgrade; 
    proxy_set_header Connection "upgrade"; 
    error_log /www/sites/www.example.com/log/error.log;
    access_log /www/sites/www.example.com/log/access.log; 
    location /socket.io {
        proxy_set_header Upgrade $http_upgrade; 
        proxy_set_header Connection "Upgrade"; 
        proxy_set_header Host $host; 
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; 
        proxy_set_header X-Forwarded-Proto $scheme; 
        proxy_pass http://127.0.0.1:2333/socket.io; 
    }
    location /api/v2 {
        proxy_pass http://127.0.0.1:2333/api/v2; 
    }
    location /render {
        proxy_pass http://127.0.0.1:2333/render; 
    }
    location / {
        proxy_pass http://127.0.0.1:2323; 
    }
    location /qaqdmin {
        proxy_pass http://127.0.0.1:2333/proxy/qaqdmin;
    }

    location ~* \/(feed|sitemap|atom.xml) {
        proxy_pass http://127.0.0.1:2333/$1; 
    }
    ssl_certificate /www/sites/www.example.com/ssl/fullchain.pem; 
    ssl_certificate_key /www/sites/www.example.com/ssl/privkey.pem; 
    ssl_protocols TLSv1.3 TLSv1.2 TLSv1.1 TLSv1; 
    ssl_ciphers 'ECDHE-ECDSA-CHACHA20-POLY1305:ECDHE-ECDSA-AES128-GCM-SHA256:ECDHE-ECDSA-AES256-GCM-SHA384:ECDHE-ECDSA-AES128-SHA256:ECDHE-ECDSA-AES128-SHA:ECDHE-ECDSA-AES256-SHA384:ECDHE-ECDSA-AES256-SHA:ECDHE-RSA-AES128-GCM-SHA256:ECDHE-RSA-AES256-GCM-SHA384:DHE-RSA-AES128-GCM-SHA256:DHE-DSS-AES128-GCM-SHA256:kEDH+AESGCM:ECDHE-RSA-AES128-SHA256:ECDHE-RSA-AES128-SHA:ECDHE-RSA-AES256-SHA384:ECDHE-RSA-AES256-SHA:DHE-RSA-AES128-SHA256:DHE-RSA-AES128-SHA:DHE-DSS-AES128-SHA256:DHE-RSA-AES256-SHA256:DHE-DSS-AES256-SHA:DHE-RSA-AES256-SHA:AES128-GCM-SHA256:AES256-GCM-SHA384:AES128-SHA256:AES256-SHA256:AES128-SHA:AES256-SHA:AES:CAMELLIA:!aNULL:!eNULL:!EXPORT:!DES:!RC4:!3DES:!MD5:!PSK'; 
    ssl_prefer_server_ciphers on; 
    ssl_session_cache shared:SSL:10m; 
    ssl_session_timeout 10m; 
    error_page 497 https://$host$request_uri; 
    limit_conn perserver 300; 
    limit_conn perip 25; 
    limit_rate 512k; 
}

Update#

Backend Update (Docker Deployment)#

Go to the folder where core is located, then

cd $HOME/mx-space/core
docker compose pull && docker compose up -d

Frontend Update#

cd $HOME/mx-space/Shiro
git pull
sudo pnpm i
sudo pnpm build
pm2 restart 0

Troubleshooting#

Resolve User Conflict in Comments#

Reference: Clerk Login and Mix Space Backend Binding

Get the PEM: https://clerk.com/docs/backend-requests/handling/manual-jwt
Get the ID: After logging in with clerk in Shiro, capture the request through the console

Get ID

Add Search#

Reference: https://mx-space.js.org/usage/search

Register: https://dashboard.algolia.com/users/sign_up
New Application -> Create Application -> Create Index, remember the Create Index
API Keys -> Application ID & Admin API Key
Enter the Index, Application ID, and Admin API Key in the backend

This article is synchronized and updated to xLog by Mix Space
The original link is https://xxu.do/posts/geek/Mix-Space