WIPI เป็นระบบ CMS โอเพ่นซอร์สสำหรับบุคคลที่รวมฟังก์ชั่นเช่นการเผยแพร่บทความการสร้างหน้าหนังสือความรู้ ฯลฯ เทคโนโลยีที่เกี่ยวข้องมีดังนี้:
MySQL : การจัดเก็บข้อมูลnext.js : Front-End Page Frameworknest.js : เฟรมเวิร์กฝั่งเซิร์ฟเวอร์AliyunOSS : การจัดเก็บวัตถุ สำหรับฟังก์ชั่นเพิ่มเติมกรุณาเยี่ยมชมระบบเพื่อรับประสบการณ์
ก่อนอื่นให้ติดตั้ง MySQL ขอแนะนำให้ใช้ Docker สำหรับการติดตั้ง
docker image pull mysql:5.7
docker run -d --restart=always --name wipi -p 3306:3306 -e MYSQL_ROOT_PASSWORD=root mysql:5.7 จากนั้นสร้างฐานข้อมูลใน MySQL
docker container exec -it wipi bash ;
mysql -u root -p ;
CREATE DATABASE ` wipi ` DEFAULT CHARACTER SET utf8mb4 COLLATE utf8mb4_unicode_ci ;ก่อนอื่นโครงการโคลน
git clone --depth=1 https://github.com/fantasticit/wipi.git your-project-nameจากนั้นติดตั้งการพึ่งพาโครงการ
# 全局安装 pnpm
npm i -g pnpm
pnpm installpnpm run dev ที่อยู่หน้าแผนกต้อนรับ: http://localhost:3001 ที่อยู่การจัดการพื้นหลัง: http://localhost:3002 ที่อยู่อินเทอร์เฟซบริการ: http://localhost:3003
ครั้งแรกที่เริ่มต้นผู้ใช้ผู้ดูแลระบบจะถูกสร้างขึ้นโดยค่าเริ่มต้น: ผู้ดูแลระบบและรหัสผ่าน: ผู้ดูแลระบบ (สามารถแก้ไขได้ในไฟล์ .env ) [ps] หากการกำหนดค่าเซิร์ฟเวอร์ไม่สามารถเริ่มต้นได้โปรดยืนยันก่อนว่าการกำหนดค่า MySQL นั้นถูกต้องหรือไม่ ไฟล์การกำหนดค่าอยู่ใน .env
เมื่อโครงการเริ่มต้นครั้งแรกการตั้งค่าระบบจะต้องดำเนินการในพื้นหลัง เมื่อเนื้อหากลายเป็นเนื้อหาที่สมบูรณ์ยิ่งขึ้นเนื้อหาของหน้าเว็บก็จะยิ่งดีขึ้นเช่นกัน
ไฟล์ .env ถูกโหลดตามค่าเริ่มต้นและสภาพแวดล้อมการผลิตจะพยายามโหลดไฟล์. .env.prod
# 客户端运行端口
CLIENT_PORT=3001
# 客户端站点地址(假设部署到 https://xx.com, 就将 CLIENT_SITE_URL 设置为 https://xx.com)
CLIENT_SITE_URL=http://localhost:3001
# 客户端资源地址(假设部署到 https://xx.com,就将 CLIENT_ASSET_PREFIX 设置为 https://xx.com,如果将资源上传到 cdn ,那就改为 cdn 地址)
CLIENT_ASSET_PREFIX=/
# 管理后台运行端口
ADMIN_PORT=3002
# 管理后台资源地址(假设部署到 https://xx.com,就将 CLIENT_ASSET_PREFIX 设置为 https://xx.com,如果将资源上传到 cdn ,那就改为 cdn 地址)
ADMIN_ASSET_PREFIX=/
# 服务端运行端口
SERVER_PORT=3003
# 服务端完整访问路径
SERVER_API_URL=http://localhost:3003/api
# 服务端接口前缀(假设将希望通过 http://xx:com/api 来访问,那就设置为 /api;如果 http://xx:com,那就设置为 / )
SERVER_API_PREFIX=/api
# 默认管理员账户名
ADMIN_USER=admin
# 默认管理员账密码
ADMIN_PASSWD=admin
# 以下为数据库配置,请先创建好表
DB_HOST=127.0.0.1
DB_PORT=3306
DB_USER=root
DB_PASSWD=root
DB_DATABASE=wipi
# Github 第三方登录配置
# 关于 Github OAuth 可参考 https://www.ruanyifeng.com/blog/2019/04/github-oauth.html
GITHUB_CLIENT_ID=0 # Github OAuth 登录 Id
GITHUB_CLIENT_SECRET=0 # Github OAuth 登录 Secretสคริปต์สำหรับสภาพแวดล้อมการผลิตมีดังนี้:
node -v
npm -v
npm config set registry http://registry.npmjs.org
npm i -g pm2 @nestjs/cli pnpm
pnpm install
pnpm run build
pnpm run pm2
pm2 startup
pm2 save ใช้ Reverse Proxy เพื่อกำหนด nginx และตั้งค่า proxy_set_header X-Real-IP $remote_addr; เพื่อให้เซิร์ฟเวอร์สามารถรับที่อยู่ IP จริง ได้
upstream wipi_client {
server 127.0.0.1:3000 ;
keepalive 64 ;
}
# http -> https 重定向
server {
listen 80 ;
server_name 域名;
rewrite ^(. * )$ https:// $host $1 permanent ;
}
server {
listen 443 ssl ;
server_name 域名;
ssl_certificate 证书存放路径;
ssl_certificate_key 证书存放路径;
location / {
proxy_http_version 1.1 ;
proxy_set_header Upgrade $http_upgrade ;
proxy_set_header Connection " upgrade " ;
proxy_set_header Host $host ;
proxy_set_header X-Nginx-Proxy true ;
proxy_cache_bypass $http_upgrade ;
proxy_pass http://wipi_client ; #反向代理
proxy_set_header X-Real-IP $remote_addr ;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for ;
}
}