腳本之家服務(wù)器常用軟件

快捷導(dǎo)航

ujcms-cp后臺前端項(xiàng)目 v2.0

后臺前端項(xiàng)目

投訴報(bào)錯(cuò)

源碼大?。?span>265KB
源碼語言：簡體中文
源碼類型：國產(chǎn)軟件
源碼授權(quán)：免費(fèi)軟件
源碼類別：其它源碼
應(yīng)用平臺：TypeScript
更新時(shí)間：2022-03-24
網(wǎng)友評分：

360通過騰訊通過金山通過

265KB

詳情介紹

UJCMS-CP是UJCMS的后臺前端項(xiàng)目。使用 TypeScript、Vite 2、Vue 3、ElementPlus 2、TailwindCSS 3、VueRouter、VueI18n 開發(fā)。

需要啟動UJCMS主項(xiàng)目才可以使用，不可單獨(dú)運(yùn)行(無法訪問后端接口)。

如不需要修改UJCMS的后臺界面，則不必啟動此項(xiàng)目。UJCMS的/src/main/webapp/cp目錄已包含本項(xiàng)目編譯后的代碼，直接運(yùn)行UJCMS主項(xiàng)目即可。

搭建步驟

使用 vscode 開發(fā)工具。

安裝 node 環(huán)境。建議 node 14 版本，最低為 node 12.14 版本。

使用淘寶 npm 鏡像。

安裝依賴，執(zhí)行：npm install

啟動程序，執(zhí)行：npm run dev

訪問：http://localhost:9520

用戶名：admin，密碼：password。

編譯及部署

執(zhí)行：npm run build

編譯后的程序在/dist目錄。

將/dist目錄里的文件拷貝至主項(xiàng)目UJCMS的/src/main/webapp/cp目錄下(先將原目錄下的文件刪除)。

前后端分開部署

通常前端和后端程序部署到同一個(gè)應(yīng)用，即將前端程序復(fù)制到主項(xiàng)目UJCMS的/cp目錄。以演示站點(diǎn)為例，后端接口地址為https://demo.ujcms.com/api,前端訪問地址則為https://demo.ujcms.com/cp/。這樣可以避免跨域問題，是最簡單的部署方式。

如果需要將前后端部署到不同域名或端口，如后端接口地址為http://www.example.com/api，前端地址為http://www.frontend.com。由于前后端域名不同，前端直接訪問后端接口會出現(xiàn)跨域錯(cuò)誤。這時(shí)需要在前端服務(wù)器部署反向代理，解決跨域問題。以nginx為例：

# 代理 api 接口
location /api {
proxy_pass http://www.example.com;
}
# 代理上傳文件
location /uploads {
proxy_pass http://www.example.com;
}

開發(fā)模式啟動時(shí)，情況也類似，后端接口地址為http://localhost:8080/api，前端地址為http://localhost:9520。前后端端口不同，也屬于跨域。但前端開發(fā)在狀態(tài)啟動時(shí)，會自動開啟代理，相關(guān)配置在vite.config.ts文件中。類似以下代碼：

proxy: {
'/api': {
target: env.VITE_PROXY,
changeOrigin: true,
},
'/uploads': {
target: env.VITE_PROXY,
changeOrigin: true,
},
},

UJCMS CP 后臺前端項(xiàng)目

下載地址

下載錯(cuò)誤？【投訴報(bào)錯(cuò)】