pc商城
项目介绍
目录结构
复制LaiKeJaveMall
├── common
│ ├── footer.html #脚部
│ ├── head.html #头部
│ ├── md5.js
│ ├── navRight.html #右侧导航
│ ├── zh_CN.js #中文简体
│ ├── zh_EN.js #英文
│ ├── zh_TN.js #繁体
├── css # 样式
│ ├── commom
│ │ ├── animate.min.css #公共样式
│ │ └── reset.css
│ ├── common.css #公共样式
│ ├── pages #页面样式
│ └── reset.css
├── index.html
├── js
│ ├── config.js #接口配置
│ └── vue.js
├── package-lock.json
├── pages #商城页面
│ ├── address #地址管理
│ │ └── myaddress.html
│ ├── afterSale #售后
│ │ └── management.html
│ ├── assets #个人资产
│ ├── collection #收藏
│ │ ├── mycollection.html
│ │ └── similar.html
│ ├── coupon #优惠券
│ ├── home #主页
│ │ └── index.html
│ ├── homeList #商品列表
│ │ ├── homeList.html
│ │ └── homeLoad.html
│ ├── homedetail #商品详情
│ │ └── homedetail.html
│ ├── login #登录
│ │ ├── forgetPassword.html
│ │ ├── login.html
│ │ ├── register.html
│ │ └── setPassword.html
│ ├── mch #店铺申请和主页
│ │ ├── applyShop.html
│ │ └── mch.html
│ ├── message #站内消息
│ │ ├── message.html
│ │ └── messageDetail.html
│ ├── my #个人中心页面
│ │ ├── aboutUs.html
│ │ ├── my.html
│ │ ├── myLoad.html
│ │ └── myinfor.html
│ ├── order #订单相关页面
│ │ ├── afterDetails.html #售后详情
│ │ ├── afterSale.html #售后列表
│ │ ├── evaluationing.html #评价
│ │ ├── myOrder.html #我的订单
│ │ ├── orderDetails.html #订单详情
│ │ └── payment.html #待付款支付
│ ├── pay
│ │ ├── payDetails.html #订单确认
│ │ ├── payResult.html #支付结果
│ │ └── scanCode.html #扫码
│ ├── plug
│ ├── security
│ ├── shoppingCart #购物车
├── plugins
│ └── others
│ ├── element-ui
│ ├── jquery.min.js
│ ├── qrcode.min.js
│ └── swiper.animate1.0.3.min.js
└── static #静态资源
├── home-img
└── images
项目工具
| 项 | 版本 | 说明 |
|---|---|---|
| nodejs | 14.20.0 | 下载安装 |
| vscode | 最新 | 开发编辑器 |
| pm2 | 默认 | 守护进程 |
项目部署
后端服务
laike-gateway
laike-admin-store
laike-store-pc
配置修改
1、修改 .env.js,Javaprod环境部分即可
//商城ID
const STORE_ID = 1;
//来源
const STORE_TYPE = 6;
//java环境端口
const JAVA_PORT = 8081
//php环境端口
const PHP_PORT = 8089
//公共部分uri地址
const COMMON_URI = "?store_id=" + STORE_ID + "&store_type=" + STORE_TYPE
module.exports = {
//////////////////////////////////////////////
//JAVA 开发环境 需修改部分
//////////////////////////////////////////////
java_dev_production: {
NODE_ENV: 'java_dev_production',
VUE_APP_LKT_STORE_ID:STORE_ID,
VUE_APP_STORE_TYPE:STORE_TYPE,
PUBLIC_PATH:'',//配置router
VUE_APP_LKT_MCH_DEFURL:'https://store.think.laiketui.net/#/login',//来客电商PC商城跳转路径PC店铺,填pc店铺后台地址
VUE_APP_LKT_H5_DEFURL:'https://h5.think.laiketui.net/#/',//来客电商H5默认路径
VUE_APP_LKT_ROOT_IMG_URL:'https://think.laiketui.net/', //图片资源路径，填网关地址
VUE_APP_LKT_KEFU_URL:'wss://think.laiketui.net/wss/message/onlineMessage/', //客服 websocket地址
VUE_APP_BASE_API: 'https://think.laiketui.net/gw', //填网关地址
PROT:JAVA_PORT,
LKT_ROOT_URL:"https://think.laiketui.net/gw" + COMMON_URI //填网关地址
},
//需修改部分结束
// JAVA 演示环境
java_prod_production: {
NODE_ENV: 'java_prod_production',
VUE_APP_LKT_STORE_ID:STORE_ID,//商城ID
VUE_APP_STORE_TYPE:STORE_TYPE,//来源
PUBLIC_PATH:'',//配置router
VUE_APP_LKT_MCH_DEFURL:'https://store.think.laiketui.net/#/login',//来客电商PC商城跳转路径PC店铺
VUE_APP_LKT_H5_DEFURL:'https://h5.think.laiketui.net/#/',//来客电商H5默认路径
VUE_APP_LKT_ROOT_IMG_URL:'https://think.laiketui.net/', //图片资源路径
VUE_APP_LKT_KEFU_URL:'wss://think.laiketui.net/wss/message/onlineMessage/', //客服 websocket地址
VUE_APP_BASE_API: 'https://think.laiketui.net/gw',
PROT:JAVA_PORT,
LKT_ROOT_URL:"https://think.laiketui.net/gw"+COMMON_URI
},
// JAVA 测试环境
'java_test_production':{
NODE_ENV: 'java_test_production',
VUE_APP_LKT_STORE_ID:STORE_ID,//商城ID
VUE_APP_STORE_TYPE:STORE_TYPE,//来源
PUBLIC_PATH:'',//配置router
VUE_APP_LKT_MCH_DEFURL:'https://java.dev.laiketui.net/mch/login',//来客电商PC商城跳转路径PC店铺
VUE_APP_LKT_H5_DEFURL:'https://java.dev.laiketui.net/H5',//来客电商H5默认路径
VUE_APP_LKT_ROOT_IMG_URL:'https://java.dev.laiketui.net/', //图片资源路径
VUE_APP_LKT_KEFU_URL:'wss://java.dev.laiketui.net/wss/message/onlineMessage/', //客服 websocket地址
VUE_APP_BASE_API:'https://java.dev.laiketui.net/gw',
PROT:JAVA_PORT,
LKT_ROOT_URL:"https://java.dev.laiketui.net/gw"+COMMON_URI
},
//////////////////////////////////////////////
//PHP 环境
//////////////////////////////////////////////
//本地
php_dev_production: {
NODE_ENV: 'php_dev_production',
VUE_APP_LKT_STORE_ID:STORE_ID,//商城ID
VUE_APP_STORE_TYPE:STORE_TYPE,//来源
PUBLIC_PATH:'/mall',//配置router
VUE_APP_LKT_MCH_DEFURL:'https://tp.dev.laiketui.net/mch/#/login',//来客电商PC商城跳转路径PC店铺
VUE_APP_LKT_H5_DEFURL:'https://tp.dev.laiketui.net/H5/#/',//来客电商H5默认路径
VUE_APP_LKT_ROOT_IMG_URL:'https://tp.dev.laiketui.net/', //图 片资源路径
VUE_APP_LKT_KEFU_URL:'wss://tp.dev.laiketui.net/wss/', //客服 websocket地址
VUE_APP_BASE_API:'https://tp.dev.laiketui.net',
PROT:PHP_PORT,
LKT_ROOT_URL: "/api"+COMMON_URI
},
//PHP 生产环境
php_prod_production: {
NODE_ENV: 'php_prod_production',
VUE_APP_LKT_STORE_ID:STORE_ID,//商城ID
VUE_APP_STORE_TYPE:STORE_TYPE,//来源
PUBLIC_PATH:'/mall',//配置router
VUE_APP_LKT_MCH_DEFURL:'https://tp.dev.laiketui.net/mch/#/login',//来客电商PC商城跳转路径PC店铺
VUE_APP_LKT_H5_DEFURL:'https://tp.dev.laiketui.net/H5/#/',//来客电商H5默认路径
VUE_APP_LKT_ROOT_IMG_URL:'https://tp.dev.laiketui.net/', //图 片资源路径
VUE_APP_LKT_KEFU_URL:'wss://tp.dev.laiketui.net/wss/', //客服 websocket地址
VUE_APP_BASE_API:'https://tp.dev.laiketui.net',
PROT:PHP_PORT,
LKT_ROOT_URL:"https://tp.dev.laiketui.net"+COMMON_URI
},
//PHP 测试环境
php_test_production: {
NODE_ENV: 'php_test_production',
VUE_APP_LKT_STORE_ID:STORE_ID,//商城ID
VUE_APP_STORE_TYPE:STORE_TYPE,//来源
PUBLIC_PATH:'/mall',//配置router
VUE_APP_LKT_MCH_DEFURL:'https://tp.dev.laiketui.net/mch/#/login',//来客电商PC商城跳转路径PC店铺
VUE_APP_LKT_H5_DEFURL:'https://tp.dev.laiketui.net/H5/#/',//来客电商H5默认路径
VUE_APP_LKT_ROOT_IMG_URL:'https://tp.dev.laiketui.net/', //图 片资源路径
VUE_APP_LKT_KEFU_URL:'wss://tp.dev.laiketui.net/wss/', //客服 websocket地址
VUE_APP_BASE_API:'https://tp.dev.laiketui.net',
PROT:PHP_PORT,
LKT_ROOT_URL: "https://tp.dev.laiketui.net"+COMMON_URI
}
}
打包部署
执行npm run build打包命令后会生成一个.nuxt的文件夹，首次部署需要在宝塔上传入如下几个文件，并且打开终端下载依赖。之后部署正常情况没有修改assets、plugins、static、nuxt.config.js、package-lock.json、package.json里面的内容，每次打包只需要上传.nuxt文件上去即可（部署完需要重启pm2进程）
# 拉依赖
npm i
# Java打包
# Java生产环境
# npm run java:prod
# Java测试环境
# npm run java:test
# PHP打包
# PHP生产环境
npm run php:prod
# PHP测试环境
#npm run php:test
打包之后，将1-9打包上传到服务器指定文件夹
.
├── 1、.nuxt
├── README.md
├── api
├── app
├── 2、assets//若有修改的情况每次打包后需要上传到服务器；没有修改的情况只需要第一次上传到服务器
├── babel.config.js
├── components
├── ecosystem.config.js
├── 9、env.js
├── jsconfig.json
├── layouts
├── 6、node_modules //如果不想在服务器下载则这个包也可以一起打包上传到服务器【如果服务器下载则非必须】
├── 3、nuxt.config.js//若有修改的情况每次打包后需要上传到服务器；没有修改的情况只需要第一次上传到服务器
├── 7、package-lock.json //若有修改的情况每次打包后需要上传到服务器；没有修改的情况只需要第一次上传到服务器
├── 8、 package.json //若有修改的情况每次打包后需要上传到服务器；没有修改的情况只需要第一次上传到服务器
├── pages
├── 4、plugins//若有修改的情况每次打包后需要上传到服务器；没有修改的情况只需要第一次上传到服务器
├── 5、static//若有修改的情况每次打包后需要上传到服务器；没有修改的情况只需要第一次上传到服务器
├── store
├── utils
└── yarn.lock
第一次部署服务器端启动：
# 请在文件上传路径执行以下命令！也就是与.nuxt同级的目录！
# 服务器安装 pm2
npm install pm2 -g
# JAVA 刚刚启动的进程，服务启动成功后有个地址，需要在域名下做代理，即可完成部署
# pm2 delete java-mall
# pm2 start npm --name "java-mall" -- run java:ps
# PHP 刚刚启动的进程，服务启动成功后有个地址，需要在域名下做代理，即可完成部署
pm2 delete laike-mall
pm2 start npm --name "laike-mall" -- run php:ps
pm2 save
非第一次部署：
更改了其中内容后都需要重启pm2服务，命令 pm2 restart 0 (0是需要重启的序号)
#### 查看服务列表
[root@java java.web.houjiemeishi.com]# pm2 list
┌────┬────────────────────┬──────────┬──────┬───────────┬──────────┬──────────┐
│ id │ name │ mode │ ↺ │ status │ cpu │ memory │
├────┼────────────────────┼──────────┼──────┼───────────┼──────────┼──────────┤
│ 0 │ mall │ fork │ 84 │ online │ 0% │ 55.9mb │
└────┴────────────────────┴──────────┴──────┴───────────┴──────────┴──────────┘
[PM2][WARN] Current process list is not synchronized with saved list. App nuxt-pcsc differs. Type 'pm2 save' to synchronize.
# 重启指定服务编号
[root@java java.web.houjiemeishi.com]# pm2 restart 0
Use --update-env to update environment variables
[PM2] Applying action restartProcessId on app [0](ids: [ '0' ])
[PM2] [mall](0) ✓
┌────┬────────────────────┬──────────┬──────┬───────────┬──────────┬──────────┐
│ id │ name │ mode │ ↺ │ status │ cpu │ memory │
├────┼────────────────────┼──────────┼──────┼───────────┼──────────┼──────────┤
│ 0 │ mall │ fork │ 85 │ online │ 0% │ 19.8mb │
└────┴────────────────────┴──────────┴──────┴───────────┴──────────┴──────────┘
[PM2][WARN] Current process list is not synchronized with saved list. App nuxt-pcsc differs. Type 'pm2 save' to synchronize.
启动之后可以直接暴漏端口用ip:port访问 ； 或者通过nginx 配置代理 ip:port 来访问。
location /pc {
proxy_pass http://npm start启动时候控制台出来的ip:端口; //例如：proxy_pass http://172.21.125.47:8081;
}
PM2 是一个进程管理工具，它可以帮助我们管理 Node.js 进程。PM2 可以监控应用程序并自动重启它们，也可以在集群模式下负载均衡进程。除此之外，PM2 还提供了很多有用的功能，比如日志管理、进程监控、应用程序部署等。
pm2基本用法：
1启动应用程序
使用 PM2 启动应用程序非常简单，只需要在命令行中执行以下命令即可：
pm2 start
其中，app.js 是我们要启动的应用程序的入口文件。执行该命令后，PM2 会启动该应用程序，并在后台运行。
查看应用程序列表
使用 PM2 启动的应用程序可以通过以下命令查看：
pm2 list
该命令会列出所有使用 PM2 启动的应用程序。
停止应用程序
如果我们需要停止某个应用程序，可以使用以下命令：
pm2 stop app
其中，app 是要停止的应用程序的名称或 ID。如果我们想要停止所有使用 PM2 启动的应用程序，可以使用以下命令：
pm2 stop all
重启应用程序
如果我们需要重启某个应用程序，可以使用以下命令：
pm2 restart app
其中，app 是要重启的应用程序的名称或 ID。如果我们想要重启所有使用 PM2 启动的应用程序，可以使用以下命令：
pm2 restart all
删除应用程序
如果我们需要删除某个应用程序，可以使用以下命令：
pm2 delete app
其中，app 是要删除的应用程序的名称或 ID。如果我们想要删除所有使用 PM2 启动的应用程序，可以使用以下命令：
pm2 delete all
查看应用程序日志
使用 PM2 启动的应用程序会自动记录日志，我们可以使用以下命令查看应用程序的日志：
pm2 logs app
其中，app 是要查看日志的应用程序的名称或 ID。该命令会输出应用程序的日志，可以通过 Ctrl+C 停止查看。
访问
