vue+node(express)做中間層開(kāi)發(fā)四--express支持axios

在上文設(shè)置了experss支持es6之后,就可以把vue代碼里的axios搬過(guò)來(lái)了。
這一步只新增一個(gè)qs包 npm install qs

在src文件夾下新建一個(gè)libs文件,把api.request.jsaxios.js文件搬過(guò)來(lái),修改一下import的路徑:

import HttpRequest from './axios'
import config from '../config'

axios.js中的store不會(huì)用到,刪除之,addErrorLog方法也刪除掉。

新建一個(gè)config文件夾,用來(lái)放配置文件。server/node_api/src/config/index.js

export default {
  baseUrl: {
    dev: 'http://www.xxxx/',    // 測(cè)試服務(wù)器
    prod: 'http://www.xxxx/'    // 正式服務(wù)器
  },
}

新建一個(gè)api文件夾,用來(lái)放api,server/node_api/src/api/users.js

import express from 'express'
import axios from '../libs/api.request'
import qs from 'qs'
/**
 * 登陸
 */
export const login = (data) => {
  return axios.request({
    url: 'hdapi/admin/login',
    method: 'post',
    data: qs.stringify(data)
  })
}

/**
 * 登陸
 */
export const getUserInfo = (query) => {
  return axios.request({
    url: 'hdapi/admin/queryUserByToken',
    method: 'get',
    params: query
  })
}

現(xiàn)在開(kāi)始用usersRouter了。編輯server/node_api/src/app.js新增

import usersRouter from './routes/users'
...
app.use('/users', usersRouter)

編輯server/node_api/src/routes/users.js,把controller操作寫(xiě)在這里面

import express from 'express'
import { login, getUserInfo } from '../api/users'

var router = express.Router()

router.post('/login', (req, res, next) => {
  login({user_name: 'admin', user_pwd: '666'}).then(result => {
    const {result: { data: { data: {user, token }}}} = {result}
    console.log('token',token)
    res.send({
      token,
      user
    })
  })
})

export default router
Screen Shot 2020-12-31 at 18.20.20.png

后續(xù)還可以做的

  • 后臺(tái)做錯(cuò)誤頁(yè)面跳轉(zhuǎn)
  • 增加分流機(jī)制
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書(shū)系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容