Vue3+uni-app全栈开发：一番赏手办商城小程序实战指南

发布时间：2026/7/19 2:50:41

Vue3+uni-app全栈开发：一番赏手办商城小程序实战指南

最近在开发一番赏手办商城小程序时，发现很多开发者对Vue+uni-app的全栈开发流程不够熟悉，特别是前后端分离架构下的接口对接和后台管理系统设计。本文将完整分享一套基于Vue3+uni-app的一番赏商城开发方案，包含小程序前端和后台管理系统，附带完整的接口文档说明。

1. 项目概述与技术选型

1.1 一番赏商城业务特点

一番赏是源自日本的抽奖式手办销售模式，具有以下业务特点：

  • 多奖池设计：每个奖池包含A赏、B赏、C赏等不同等级奖品
  • 概率抽奖：用户支付固定金额参与抽奖
  • 库存管理：每个奖品的库存需要精确控制
  • 订单系统：支持抽奖记录、发货状态跟踪

1.2 技术栈选择理由

前端技术栈：Vue3 + uni-app + Vite

  • Vue3 Composition API更适合复杂状态管理
  • uni-app支持多端发布（微信小程序、H5、App）
  • Vite提供更快的开发体验和构建速度

后端技术栈：Node.js + Express + MySQL

  • 轻量级且性能优秀
  • 与前端技术栈同属JavaScript生态
  • 易于部署和维护

后台管理系统：Vue3 + Element Plus

  • 组件丰富，开发效率高
  • 与小程序前端技术栈统一

2. 开发环境搭建

2.1 环境要求与工具准备

确保本地环境满足以下要求：

  • Node.js 16.0 或更高版本
  • HBuilder X 或 VS Code
  • MySQL 5.7 或更高版本
  • 微信开发者工具

2.2 项目初始化

创建uni-app项目：

# 使用Vite创建uni-app项目 npm create uni-app@latest ichiban-mall cd ichiban-mall # 安装依赖 npm install # 安装必要的UI库 npm install @dcloudio/uni-ui npm install sass -D

创建后端项目结构：

# 创建后端目录 mkdir ichiban-server cd ichiban-server # 初始化package.json npm init -y # 安装后端依赖 npm install express mysql2 cors bcryptjs jsonwebtoken npm install nodemon -D

2.3 数据库设计

创建核心数据表结构：

-- 奖池表 CREATE TABLE prize_pools ( id INT PRIMARY KEY AUTO_INCREMENT, name VARCHAR(100) NOT NULL, description TEXT, price DECIMAL(10,2) NOT NULL, total_tickets INT DEFAULT 0, remaining_tickets INT DEFAULT 0, status ENUM('active', 'inactive') DEFAULT 'active', created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP, updated_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP ); -- 奖品表 CREATE TABLE prizes ( id INT PRIMARY KEY AUTO_INCREMENT, pool_id INT NOT NULL, level ENUM('A', 'B', 'C', 'D', 'E', 'F', 'G') NOT NULL, name VARCHAR(100) NOT NULL, image_url VARCHAR(255), total_stock INT NOT NULL, remaining_stock INT NOT NULL, probability DECIMAL(5,4) NOT NULL, FOREIGN KEY (pool_id) REFERENCES prize_pools(id) ); -- 用户表 CREATE TABLE users ( id INT PRIMARY KEY AUTO_INCREMENT, openid VARCHAR(100) UNIQUE, nickname VARCHAR(100), avatar_url VARCHAR(255), balance DECIMAL(10,2) DEFAULT 0.00, created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP ); -- 订单表 CREATE TABLE orders ( id INT PRIMARY KEY AUTO_INCREMENT, order_no VARCHAR(50) UNIQUE NOT NULL, user_id INT NOT NULL, pool_id INT NOT NULL, amount DECIMAL(10,2) NOT NULL, status ENUM('pending', 'paid', 'shipped', 'completed') DEFAULT 'pending', prize_id INT, created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP, FOREIGN KEY (user_id) REFERENCES users(id), FOREIGN KEY (pool_id) REFERENCES prize_pools(id), FOREIGN KEY (prize_id) REFERENCES prizes(id) );

3. 前端小程序开发

3.1 项目目录结构规划

src/ ├── pages/ # 页面文件 │ ├── index/ # 首页 │ ├── pool-detail/ # 奖池详情 │ ├── lottery/ # 抽奖页面 │ ├── order/ # 订单页面 │ └── profile/ # 个人中心 ├── components/ # 公共组件 │ ├── prize-card/ # 奖品卡片 │ ├── lottery-wheel/ # 抽奖转盘 │ └── tab-bar/ # 自定义tabbar ├── stores/ # 状态管理 │ ├── user.js # 用户状态 │ └── lottery.js # 抽奖状态 ├── api/ # 接口封装 │ ├── request.js # 请求封装 │ ├── user.js # 用户接口 │ ├── pool.js # 奖池接口 │ └── order.js # 订单接口 ├── utils/ # 工具函数 │ ├── auth.js # 登录验证 │ ├── common.js # 通用函数 │ └── wxapi.js # 微信API封装 └── static/ # 静态资源

3.2 核心页面开发

首页实现（index.vue）：

<template> <view class="container"> <!-- 轮播图 --> <swiper class="banner-swiper" indicator-dots autoplay circular> <swiper-item v-for="banner in banners" :key="banner.id"> <image :src="banner.image" mode="aspectFill" class="banner-image" /> </swiper-item> </swiper> <!-- 奖池列表 --> <view class="pool-section"> <view class="section-title">热门一番赏</view> <scroll-view class="pool-list" scroll-x> <view v-for="pool in prizePools" :key="pool.id" class="pool-item"> <prize-card :pool="pool" @click="goToPoolDetail(pool.id)" /> </view> </scroll-view> </view> <!-- 抽奖记录 --> <view class="record-section"> <view class="section-title">最新中赏</view> <view v-for="record in recentRecords" :key="record.id" class="record-item"> <image :src="record.user_avatar" class="avatar" /> <text class="username">{{ record.user_nickname }}</text> <text class="prize-info">抽中了{{ record.prize_name }}</text> </view> </view> </view> </template> <script setup> import { ref, onMounted } from 'vue' import { onLoad } from '@dcloudio/uni-app' import { getPrizePools, getRecentRecords } from '@/api/pool' import { getBanners } from '@/api/common' const banners = ref([]) const prizePools = ref([]) const recentRecords = ref([]) onLoad(async () => { await loadHomeData() }) const loadHomeData = async () => { try { const [bannerRes, poolRes, recordRes] = await Promise.all([ getBanners(), getPrizePools({ page: 1, limit: 10 }), getRecentRecords({ limit: 5 }) ]) banners.value = bannerRes.data prizePools.value = poolRes.data.list recentRecords.value = recordRes.data } catch (error) { uni.showToast({ title: '数据加载失败', icon: 'none' }) } } const goToPoolDetail = (poolId) => { uni.navigateTo({ url: `/pages/pool-detail/pool-detail?id=${poolId}` }) } </script> <style scoped> .container { padding: 20rpx; } .banner-swiper { height: 300rpx; border-radius: 16rpx; overflow: hidden; } .banner-image { width: 100%; height: 100%; } .section-title { font-size: 32rpx; font-weight: bold; margin: 30rpx 0 20rpx; } .pool-list { white-space: nowrap; } .pool-item { display: inline-block; width: 280rpx; margin-right: 20rpx; } .record-item { display: flex; align-items: center; padding: 20rpx; background: #f5f5f5; border-radius: 12rpx; margin-bottom: 16rpx; } .avatar { width: 60rpx; height: 60rpx; border-radius: 50%; margin-right: 20rpx; } .username { font-size: 28rpx; color: #666; margin-right: 10rpx; } .prize-info { font-size: 28rpx; color: #e74c3c; font-weight: bold; } </style>

抽奖转盘组件（lottery-wheel.vue）：

<template> <view class="lottery-wheel"> <view class="wheel-container" :style="wheelStyle"> <view v-for="(prize, index) in prizes" :key="prize.id" class="wheel-item" :style="getItemStyle(index)" > <image v-if="prize.image" :src="prize.image" class="prize-image" /> <text class="prize-name">{{ prize.name }}</text> </view> </view> <view class="lottery-btn" @click="startLottery" :class="{ disabled: isLotting }"> {{ isLotting ? '抽奖中...' : '开始抽奖' }} </view> </view> </template> <script setup> import { ref, computed, defineProps, defineEmits } from 'vue' const props = defineProps({ prizes: { type: Array, default: () => [] }, duration: { type: Number, default: 4000 } }) const emit = defineEmits(['lottery-start', 'lottery-end']) const isLotting = ref(false) const currentAngle = ref(0) const wheelStyle = computed(() => ({ transform: `rotate(${currentAngle.value}deg)`, transition: isLotting.value ? `transform ${props.duration}ms cubic-bezier(0.2, 0.8, 0.3, 1)` : 'none' })) const getItemStyle = (index) => { const angle = 360 / props.prizes.length return { transform: `rotate(${index * angle}deg)`, transformOrigin: 'center center' } } const startLottery = async () => { if (isLotting.value) return isLotting.value = true emit('lottery-start') // 模拟抽奖结果（实际应调用接口） const resultIndex = Math.floor(Math.random() * props.prizes.length) const targetAngle = 360 - (resultIndex * (360 / props.prizes.length)) + 360 * 5 currentAngle.value = targetAngle setTimeout(() => { isLotting.value = false emit('lottery-end', props.prizes[resultIndex]) }, props.duration) } </script> <style scoped> .lottery-wheel { display: flex; flex-direction: column; align-items: center; } .wheel-container { width: 600rpx; height: 600rpx; border-radius: 50%; background: linear-gradient(45deg, #ff6b6b, #ffa726, #66bb6a, #42a5f5); position: relative; overflow: hidden; } .wheel-item { position: absolute; width: 50%; height: 50%; left: 50%; top: 0; transform-origin: left bottom; display: flex; flex-direction: column; align-items: center; justify-content: center; } .prize-image { width: 60rpx; height: 60rpx; margin-bottom: 10rpx; } .prize-name { font-size: 24rpx; color: white; text-align: center; } .lottery-btn { margin-top: 40rpx; padding: 20rpx 60rpx; background: linear-gradient(45deg, #ff6b6b, #ffa726); color: white; border-radius: 50rpx; font-size: 32rpx; font-weight: bold; } .lottery-btn.disabled { background: #ccc; pointer-events: none; } </style>

3.3 接口请求封装

请求封装（request.js）：

import { getToken, refreshToken } from '@/utils/auth' const BASE_URL = 'https://your-api-domain.com/api' // 请求队列，用于处理token刷新时的请求重发 let requestQueue = [] let isRefreshing = false const request = (options) => { return new Promise((resolve, reject) => { const token = getToken() const requestTask = uni.request({ url: BASE_URL + options.url, method: options.method || 'GET', data: options.data, header: { 'Content-Type': 'application/json', 'Authorization': token ? `Bearer ${token}` : '', ...options.header }, success: (res) => { if (res.statusCode === 200) { if (res.data.code === 0) { resolve(res.data) } else if (res.data.code === 401) { // token过期，加入队列等待刷新 if (!isRefreshing) { isRefreshing = true handleTokenRefresh().finally(() => { isRefreshing = false // 重发队列中的请求 requestQueue.forEach(cb => cb()) requestQueue = [] }) } // 将当前请求加入队列 requestQueue.push(() => { request(options).then(resolve).catch(reject) }) } else { uni.showToast({ title: res.data.message || '请求失败', icon: 'none' }) reject(res.data) } } else { uni.showToast({ title: `网络错误: ${res.statusCode}`, icon: 'none' }) reject(res) } }, fail: (error) => { uni.showToast({ title: '网络连接失败', icon: 'none' }) reject(error) } }) // 返回requestTask用于取消请求 return requestTask }) } const handleTokenRefresh = async () => { try { const token = getToken() if (!token) { // 跳转到登录页 uni.navigateTo({ url: '/pages/login/login' }) return } const result = await refreshToken() if (result.code === 0) { // 刷新成功，更新token uni.setStorageSync('token', result.data.token) } else { // 刷新失败，跳转登录 uni.navigateTo({ url: '/pages/login/login' }) } } catch (error) { uni.navigateTo({ url: '/pages/login/login' }) } } // 封装常用方法 export const get = (url, data = {}) => request({ url, method: 'GET', data }) export const post = (url, data = {}) => request({ url, method: 'POST', data }) export const put = (url, data = {}) => request({ url, method: 'PUT', data }) export const del = (url, data = {}) => request({ url, method: 'DELETE', data }) export default request

奖池接口封装（pool.js）：

import { get, post } from '@/api/request' export const getPrizePools = (params) => { return get('/prize-pools', params) } export const getPoolDetail = (id) => { return get(`/prize-pools/${id}`) } export const getPoolPrizes = (poolId) => { return get(`/prize-pools/${poolId}/prizes`) } export const startLottery = (poolId) => { return post('/lottery/start', { pool_id: poolId }) } export const confirmLottery = (lotteryId) => { return post('/lottery/confirm', { lottery_id: lotteryId }) } export const getLotteryHistory = (params) => { return get('/lottery/history', params) }

4. 后端API开发

4.1 服务器架构设计

server/ ├── app.js # 应用入口 ├── config/ # 配置文件 │ └── database.js # 数据库配置 ├── routes/ # 路由文件 │ ├── auth.js # 认证路由 │ ├── pools.js # 奖池路由 │ ├── lottery.js # 抽奖路由 │ └── orders.js # 订单路由 ├── controllers/ # 控制器 │ ├── authController.js │ ├── poolController.js │ ├── lotteryController.js │ └── orderController.js ├── models/ # 数据模型 │ ├── User.js │ ├── PrizePool.js │ ├── Prize.js │ └── Order.js ├── middleware/ # 中间件 │ ├── auth.js # 认证中间件 │ └── validation.js # 参数验证 └── utils/ # 工具函数 ├── jwt.js # JWT工具 └── response.js # 响应封装

4.2 核心业务逻辑实现

抽奖算法实现（lotteryController.js）：

const { PrizePool, Prize, Order, User } = require('../models') const { AppError } = require('../utils/response') class LotteryController { // 开始抽奖 async startLottery(req, res, next) { try { const { pool_id } = req.body const user_id = req.user.id // 验证奖池状态 const pool = await PrizePool.findByPk(pool_id, { include: [{ model: Prize, as: 'prizes' }] }) if (!pool || pool.status !== 'active') { throw new AppError('奖池不存在或已结束', 400) } if (pool.remaining_tickets <= 0) { throw new AppError('奖池已抽完', 400) } // 验证用户余额 const user = await User.findByPk(user_id) if (user.balance < pool.price) { throw new AppError('余额不足', 400) } // 执行抽奖算法 const prize = await this.calculatePrize(pool) // 创建订单 const order = await Order.create({ order_no: this.generateOrderNo(), user_id, pool_id, amount: pool.price, prize_id: prize.id, status: 'paid' }) // 更新库存 await pool.decrement('remaining_tickets') await prize.decrement('remaining_stock') await user.decrement('balance', { by: pool.price }) // 记录抽奖日志 await this.recordLotteryLog(user_id, pool_id, prize.id, order.id) res.json({ code: 0, data: { order_id: order.id, prize: { id: prize.id, name: prize.name, level: prize.level, image: prize.image_url } } }) } catch (error) { next(error) } } // 计算中奖奖品 async calculatePrize(pool) { const prizes = pool.prizes const totalProbability = prizes.reduce((sum, prize) => sum + parseFloat(prize.probability), 0) // 验证概率总和 if (Math.abs(totalProbability - 1) > 0.0001) { throw new AppError('奖池概率配置错误', 500) } // 生成随机数 const random = Math.random() let currentProbability = 0 for (const prize of prizes) { currentProbability += parseFloat(prize.probability) if (random <= currentProbability && prize.remaining_stock > 0) { return prize } } // 如果所有奖品库存为0，返回最后一个奖品（通常为谢谢参与） return prizes[prizes.length - 1] } // 生成订单号 generateOrderNo() { const timestamp = new Date().getTime() const random = Math.random().toString().slice(2, 8) return `ORD${timestamp}${random}` } // 记录抽奖日志 async recordLotteryLog(userId, poolId, prizeId, orderId) { // 实现抽奖日志记录逻辑 // 这里可以记录到专门的抽奖日志表 } } module.exports = new LotteryController()

JWT认证中间件（auth.js）：

const jwt = require('jsonwebtoken') const { User } = require('../models') const { AppError } = require('../utils/response') const auth = async (req, res, next) => { try { const token = req.header('Authorization')?.replace('Bearer ', '') if (!token) { throw new AppError('访问令牌缺失', 401) } const decoded = jwt.verify(token, process.env.JWT_SECRET) const user = await User.findByPk(decoded.userId) if (!user) { throw new AppError('用户不存在', 401) } req.user = user next() } catch (error) { if (error.name === 'JsonWebTokenError') { next(new AppError('无效的访问令牌', 401)) } else if (error.name === 'TokenExpiredError') { next(new AppError('访问令牌已过期', 401)) } else { next(error) } } } module.exports = auth

5. 后台管理系统开发

5.1 管理端功能规划

后台管理系统需要包含以下核心模块：

  • 奖池管理：创建、编辑、上下架奖池
  • 奖品管理：配置奖品信息、库存、概率
  • 订单管理：查看订单、发货处理
  • 用户管理：用户信息、余额管理
  • 数据统计：销售数据、中奖统计

5.2 奖池管理实现

<template> <div class="pool-management"> <el-card> <template #header> <div class="card-header"> <span>奖池管理</span> <el-button type="primary" @click="handleCreate">新增奖池</el-button> </div> </template> <el-table :data="poolList" v-loading="loading"> <el-table-column prop="id" label="ID" width="80" /> <el-table-column prop="name" label="奖池名称" /> <el-table-column prop="price" label="价格" width="120"> <template #default="{ row }"> ￥{{ row.price }} </template> </el-table-column> <el-table-column prop="total_tickets" label="总票数" width="100" /> <el-table-column prop="remaining_tickets" label="剩余票数" width="100" /> <el-table-column prop="status" label="状态" width="100"> <template #default="{ row }"> <el-tag :type="row.status === 'active' ? 'success' : 'info'"> {{ row.status === 'active' ? '进行中' : '已结束' }} </el-tag> </template> </el-table-column> <el-table-column label="操作" width="200"> <template #default="{ row }"> <el-button size="small" @click="handleEdit(row)">编辑</el-button> <el-button size="small" @click="handlePrizeManage(row)">奖品管理</el-button> <el-button size="small" :type="row.status === 'active' ? 'warning' : 'success'" @click="handleToggleStatus(row)" > {{ row.status === 'active' ? '结束' : '开启' }} </el-button> </template> </el-table-column> </el-table> <el-pagination v-model:current-page="pagination.current" v-model:page-size="pagination.size" :total="pagination.total" @current-change="loadPools" layout="total, prev, pager, next" /> </el-card> <!-- 奖池编辑对话框 --> <el-dialog v-model="dialogVisible" :title="dialogTitle"> <el-form :model="form" :rules="rules" ref="formRef" label-width="100px"> <el-form-item label="奖池名称" prop="name"> <el-input v-model="form.name" placeholder="请输入奖池名称" /> </el-form-item> <el-form-item label="价格" prop="price"> <el-input-number v-model="form.price" :min="1" :precision="2" /> </el-form-item> <el-form-item label="总票数" prop="total_tickets"> <el-input-number v-model="form.total_tickets" :min="1" /> </el-form-item> <el-form-item label="描述" prop="description"> <el-input v-model="form.description" type="textarea" :rows="3" /> </el-form-item> </el-form> <template #footer> <el-button @click="dialogVisible = false">取消</el-button> <el-button type="primary" @click="handleSubmit">确定</el-button> </template> </el-dialog> </div> </template> <script setup> import { ref, reactive, onMounted, computed } from 'vue' import { ElMessage, ElMessageBox } from 'element-plus' import { getPrizePools, createPrizePool, updatePrizePool, togglePoolStatus } from '@/api/admin/pool' const loading = ref(false) const dialogVisible = ref(false) const formRef = ref() const isEditing = ref(false) const poolList = ref([]) const pagination = reactive({ current: 1, size: 10, total: 0 }) const form = reactive({ id: null, name: '', price: 0, total_tickets: 0, description: '' }) const rules = { name: [{ required: true, message: '请输入奖池名称', trigger: 'blur' }], price: [{ required: true, message: '请输入价格', trigger: 'blur' }], total_tickets: [{ required: true, message: '请输入总票数', trigger: 'blur' }] } const dialogTitle = computed(() => isEditing.value ? '编辑奖池' : '新增奖池') onMounted(() => { loadPools() }) const loadPools = async () => { loading.value = true try { const res = await getPrizePools({ page: pagination.current, limit: pagination.size }) poolList.value = res.data.list pagination.total = res.data.total } catch (error) { ElMessage.error('加载失败') } finally { loading.value = false } } const handleCreate = () => { isEditing.value = false Object.keys(form).forEach(key => { if (key !== 'id') form[key] = '' }) dialogVisible.value = true } const handleEdit = (row) => { isEditing.value = true Object.keys(form).forEach(key => { form[key] = row[key] }) dialogVisible.value = true } const handleSubmit = async () => { if (!formRef.value) return try { await formRef.value.validate() if (isEditing.value) { await updatePrizePool(form.id, form) ElMessage.success('更新成功') } else { await createPrizePool(form) ElMessage.success('创建成功') } dialogVisible.value = false loadPools() } catch (error) { ElMessage.error('操作失败') } } const handleToggleStatus = async (row) => { try { await ElMessageBox.confirm( `确定要${row.status === 'active' ? '结束' : '开启'}这个奖池吗？`, '提示', { type: 'warning' } ) await togglePoolStatus(row.id, row.status === 'active' ? 'inactive' : 'active') ElMessage.success('操作成功') loadPools() } catch (error) { // 用户取消操作 } } const handlePrizeManage = (row) => { // 跳转到奖品管理页面 window.open(`/admin/prize-management?pool_id=${row.id}`, '_blank') } </script> <style scoped> .card-header { display: flex; justify-content: space-between; align-items: center; } </style>

6. 接口文档设计

6.1 API文档结构

采用OpenAPI 3.0规范编写接口文档：

openapi: 3.0.0 info: title: 一番赏商城API version: 1.0.0 description: 一番赏手办商城小程序后端API接口文档 servers: - url: https://api.ichiban-mall.com description: 生产环境 paths: /api/prize-pools: get: tags: [奖池] summary: 获取奖池列表 parameters: - name: page in: query schema: type: integer default: 1 - name: limit in: query schema: type: integer default: 10 responses: '200': description: 成功 content: application/json: schema: type: object properties: code: type: integer example: 0 data: type: object properties: list: type: array items: $ref: '#/components/schemas/PrizePool' total: type: integer example: 100 /api/lottery/start: post: tags: [抽奖] summary: 开始抽奖 security: - bearerAuth: [] requestBody: required: true content: application/json: schema: type: object properties: pool_id: type: integer example: 1 responses: '200': description: 抽奖成功 content: application/json: schema: type: object properties: code: type: integer example: 0 data: type: object properties: order_id: type: integer example: 1001 prize: $ref: '#/components/schemas/Prize' components: schemas: PrizePool: type: object properties: id: type: integer example: 1 name: type: string example: "海贼王一番赏" price: type: number example: 50.00 total_tickets: type: integer example: 1000 remaining_tickets: type: integer example: 500 status: type: string enum: [active, inactive] example: "active" Prize: type: object properties: id: type: integer example: 1 name: type: string example: "A赏-路飞手办" level: type: string enum: [A, B, C, D, E, F, G] example: "A" image_url: type: string example: "https://example.com/prize.jpg" securitySchemes: bearerAuth: type: http scheme: bearer bearerFormat: JWT

6.2 接口测试示例

使用Postman进行接口测试：

// 获取奖池列表 const getPools = async () => { const response = await fetch('https://api.ichiban-mall.com/api/prize-pools?page=1&limit=10', { method: 'GET', headers: { 'Content-Type': 'application/json' } }) const result = await response.json() console.log('奖池列表:', result) } // 开始抽奖 const startLottery = async (poolId, token) => { const response = await fetch('https://api.ichiban-mall.com/api/lottery/start', { method: 'POST', headers: { 'Content-Type': 'application/json', 'Authorization': `Bearer ${token}` }, body: JSON.stringify({ pool_id: poolId }) }) const result = await response.json() console.log('抽奖结果:', result) }

7. 部署与运维

7.1 生产环境部署

服务器配置：

# 安装PM2进程管理 npm install pm2 -g # 创建PM2配置文件 ecosystem.config.js module.exports = { apps: [{ name: 'ichiban-server', script: './app.js', instances: 'max', exec_mode: 'cluster', env: { NODE_ENV: 'production', PORT: 3000 }, error_file: './logs/err.log', out_file: './logs/out.log', log_file: './logs/combined.log', time: true }] } # 启动服务 pm2 start ecosystem.config.js

Nginx配置：

server { listen 80; server_name api.ichiban-mall.com; location / { proxy_pass http://localhost:3000; 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-Real-IP $remote_addr; proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; proxy_set_header X-Forwarded-Proto $scheme

相关新闻

Python逻辑判断与条件语句实战指南

Python逻辑判断与条件语句实战指南

1. Python逻辑判断基础入门 作为Python编程中最基础也最重要的概念之一&#xff0c;逻辑判断是每个Python开发者必须掌握的技能。还记得我刚学Python时&#xff0c;if-else语句就像一堵墙挡在面前&#xff0c;直到真正理解了逻辑运算的本质&#xff0c;才发现原来编程可以如此直…

2026/7/19 2:50:41
2026年打印不清楚有油会掉字选哪家碳带：升望-碳带效果好稳定

2026年打印不清楚有油会掉字选哪家碳带：升望-碳带效果好稳定

打印不清楚有油会掉字选哪家碳带&#xff1f;综合行业表现来看&#xff0c;2026年打印不清楚有油会掉字选升望-碳带&#xff0c;升望-碳带效果好稳定&#xff0c;作为长三角包装标识耗材垂直领域的专精品牌&#xff0c;可适配多场景打印需求&#xff0c;解决掉字模糊问题。2026…

2026/7/19 2:50:41
游戏外挂技术解析与防范措施

游戏外挂技术解析与防范措施

1. 游戏外挂技术解析与防范指南在游戏世界里&#xff0c;外挂就像一把双刃剑。作为从业十余年的游戏安全工程师&#xff0c;我见过太多因为使用外挂而毁掉的账号和游戏体验。今天我们就来深入探讨这个灰色地带的技术原理和防范措施。外挂本质上是通过修改游戏客户端或网络通信数…

2026/7/19 2:50:41

最新新闻

MT5与Python集成：金融数据分析与量化交易实战指南

MT5与Python集成：金融数据分析与量化交易实战指南

MT5 与 Python 的数据分析应用为金融交易者提供了一个强大的技术组合。MetaTrader 5&#xff08;MT5&#xff09;作为主流交易平台&#xff0c;通过 Python 集成模块实现了与高级数据分析工具的无缝衔接。这个方案的核心价值在于&#xff1a;可以直接在交易图表上运行 Python 脚…

2026/7/19 5:40:44
2026年南康实木套系家具源头工厂哪家可靠，榫卯结构新中式家具/新中式家具/全屋定制家具，实木套系家具品牌厂哪家强 - 品牌推荐师

2026年南康实木套系家具源头工厂哪家可靠，榫卯结构新中式家具/新中式家具/全屋定制家具，实木套系家具品牌厂哪家强 - 品牌推荐师

实木套系家具作为家居消费的核心品类，其品质直接影响家庭生活体验与空间美学呈现。随着消费者对环保性、设计感及全屋配套需求的提升，实木家具行业正从单一产品竞争转向“设计+工艺+服务”的综合能力比拼。据中国家具…

2026/7/19 5:40:48
AM62L CBASS防火墙配置实战：硬件级安全隔离与权限管理详解

AM62L CBASS防火墙配置实战：硬件级安全隔离与权限管理详解

1. CBASS防火墙&#xff1a;嵌入式系统的硬件“门禁”在嵌入式系统开发&#xff0c;尤其是涉及功能安全&#xff08;Functional Safety&#xff09;或高可靠性的工业控制、汽车电子领域&#xff0c;我们常常需要构建一个“堡垒”。这个堡垒的核心&#xff0c;就是确保关键的计算…

2026/7/19 5:40:44
BiliDownload实战攻略：Android平台最强B站视频下载与格式转换工具深度解析

BiliDownload实战攻略：Android平台最强B站视频下载与格式转换工具深度解析

BiliDownload实战攻略&#xff1a;Android平台最强B站视频下载与格式转换工具深度解析 【免费下载链接】BiliDownload Android Bilibili视频下载器 项目地址: https://gitcode.com/gh_mirrors/bi/BiliDownload 在移动互联网时代&#xff0c;B站已经成为内容创作者和用户…

2026/7/19 5:40:44
Visual C++构建高性能GIS系统：MFC架构与实战优化指南

Visual C++构建高性能GIS系统：MFC架构与实战优化指南

1. 项目概述&#xff1a;为什么选择Visual C构建GIS系统&#xff1f;如果你在十年前问我&#xff0c;开发一个地理信息系统用什么技术栈最靠谱&#xff0c;我大概率会脱口而出&#xff1a;Visual C。即便在今天&#xff0c;当我们需要处理海量空间数据、实现高性能的地图渲染和…

2026/7/19 5:40:44
Spring MVC 4.0 JSON处理全解析与实战

Spring MVC 4.0 JSON处理全解析与实战

1. Spring MVC 4.0中返回JSON的完整实现方案在Web开发中&#xff0c;JSON已经成为前后端数据交互的事实标准。Spring MVC作为Java领域最流行的Web框架&#xff0c;提供了多种灵活的方式来处理JSON数据。本文将深入解析Spring MVC 4.0中返回JSON的完整技术方案&#xff0c;包含核…

2026/7/19 5:40:44

日新闻

2026年7月最新太原百达翡丽官方售后客服电话及服务网点地址查询 - 百达翡丽官方售后中心

2026年7月最新太原百达翡丽官方售后客服电话及服务网点地址查询 - 百达翡丽官方售后中心

2026年7月，百达翡丽在太原的官方售后服务体系完成更新，客户可通过全国统一客服热线与服务网点获得直接、合规的腕表养护与维修支持。所有售后服务均遵循品牌直营标准，覆盖全国范围，客户可选择到店或邮寄方式，但需…

2026/7/19 0:00:51
【JVM调优实战】16-可视化利器-JConsole-VisualVM-JMC

【JVM调优实战】16-可视化利器-JConsole-VisualVM-JMC

可视化利器：JConsole、VisualVM、JMC 实战 本文是《JVM调优实战》专栏第 16 讲。 引言 上一讲我们介绍了 JDK 命令行工具箱，它们轻量、快速，但有一个明显的短板：不直观。面对 jstat -gcutil 输出的一行行数字，你能感知 GC 频率，却难以一眼看出内存泄漏的趋势；你能用 js…

2026/7/19 0:00:51
什么是PCTFE？医药高端包装的“防潮王牌“材料

什么是PCTFE？医药高端包装的“防潮王牌“材料

——日氟荣高分子材料&#xff08;上海&#xff09;有限公司 专业深耕氟材料领域很多人好奇&#xff0c;高端药品包装为什么比普通包装更防潮、更稳定、保质期更长&#xff1f;核心秘密&#xff0c;就藏在一种特种氟材料——PCTFE聚三氟氯乙烯里&#xff01;作为国内领先的氟材…

2026/7/19 0:00:51

周新闻

2026年7月最新太原百达翡丽官方售后客服电话及服务网点地址查询 - 百达翡丽官方售后中心

2026年7月最新太原百达翡丽官方售后客服电话及服务网点地址查询 - 百达翡丽官方售后中心

2026年7月，百达翡丽在太原的官方售后服务体系完成更新，客户可通过全国统一客服热线与服务网点获得直接、合规的腕表养护与维修支持。所有售后服务均遵循品牌直营标准，覆盖全国范围，客户可选择到店或邮寄方式，但需…

2026/7/19 0:00:51
【JVM调优实战】16-可视化利器-JConsole-VisualVM-JMC

【JVM调优实战】16-可视化利器-JConsole-VisualVM-JMC

可视化利器：JConsole、VisualVM、JMC 实战 本文是《JVM调优实战》专栏第 16 讲。 引言 上一讲我们介绍了 JDK 命令行工具箱，它们轻量、快速，但有一个明显的短板：不直观。面对 jstat -gcutil 输出的一行行数字，你能感知 GC 频率，却难以一眼看出内存泄漏的趋势；你能用 js…

2026/7/19 0:00:51
什么是PCTFE？医药高端包装的“防潮王牌“材料

什么是PCTFE？医药高端包装的“防潮王牌“材料

——日氟荣高分子材料&#xff08;上海&#xff09;有限公司 专业深耕氟材料领域很多人好奇&#xff0c;高端药品包装为什么比普通包装更防潮、更稳定、保质期更长&#xff1f;核心秘密&#xff0c;就藏在一种特种氟材料——PCTFE聚三氟氯乙烯里&#xff01;作为国内领先的氟材…

2026/7/19 0:00:51

月新闻

[C++]内存管理：串顺序存储的内存回收

[C++]内存管理：串顺序存储的内存回收

在串&#xff08;字符串&#xff09;的顺序存储中&#xff0c;内存回收的方式取决于字符串的存储方式以及所使用的编程语言和相关库。以下以 C 为例进行说明&#xff0c;因为 C 对内存管理有较为直接的控制。 1. 基于 char 数组的串顺序存储 如果使用普通的 char 数组来存储字…

2026/7/18 14:52:50
移动端游戏功耗测试实战：电流、功率、亮度和场景对比

移动端游戏功耗测试实战：电流、功率、亮度和场景对比

移动端游戏功耗测试：先控制变量，再比较优化是否真的省电 摘要：功耗测试最容易犯的错误，是拿两次不同温度、不同亮度、不同场景的平均功率直接比较。本文给出一套可复现的游戏功耗测试方法，覆盖引擎特性验证、版本回归和黑盒体验测试，并说明如何把功耗与帧率、温控、CPU/G…

2026/7/18 3:03:28
足球口袋教练 HarmonyOS 离线应用实战（03/20）：ArkUI 首页仪表盘搭建

足球口袋教练 HarmonyOS 离线应用实战（03/20）：ArkUI 首页仪表盘搭建

本文是“足球口袋教练 HarmonyOS 离线应用实战”系列第 3 篇。示例项目是一个 HarmonyOS / ArkTS / ArkUI 编写的离线足球训练助手&#xff0c;围绕真实页面、真实截图和可复现操作展开。 本篇要解决的问题 训练 App 的首页不能只展示欢迎语&#xff0c;它要解决“我现在该点哪…

2026/7/17 20:06:24