From 2bb23e5d0fe581fc7e90fa8fdc0ca2dcfd9bf201 Mon Sep 17 00:00:00 2001 From: "jqtmviyu@gmail.com" Date: Wed, 13 Jan 2021 15:30:20 +0800 Subject: [PATCH] =?UTF-8?q?=E5=88=A0=E9=99=A4mock?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- mock/index.js | 57 ------------------------------ mock/mock-server.js | 81 ------------------------------------------- mock/table.js | 29 ---------------- mock/user.js | 84 --------------------------------------------- mock/utils.js | 25 -------------- vue.config.js | 5 +-- 6 files changed, 3 insertions(+), 278 deletions(-) delete mode 100644 mock/index.js delete mode 100644 mock/mock-server.js delete mode 100644 mock/table.js delete mode 100644 mock/user.js delete mode 100644 mock/utils.js diff --git a/mock/index.js b/mock/index.js deleted file mode 100644 index c514c13..0000000 --- a/mock/index.js +++ /dev/null @@ -1,57 +0,0 @@ -const Mock = require('mockjs') -const { param2Obj } = require('./utils') - -const user = require('./user') -const table = require('./table') - -const mocks = [ - ...user, - ...table -] - -// for front mock -// please use it cautiously, it will redefine XMLHttpRequest, -// which will cause many of your third-party libraries to be invalidated(like progress event). -function mockXHR() { - // mock patch - // https://github.com/nuysoft/Mock/issues/300 - Mock.XHR.prototype.proxy_send = Mock.XHR.prototype.send - Mock.XHR.prototype.send = function() { - if (this.custom.xhr) { - this.custom.xhr.withCredentials = this.withCredentials || false - - if (this.responseType) { - this.custom.xhr.responseType = this.responseType - } - } - this.proxy_send(...arguments) - } - - function XHR2ExpressReqWrap(respond) { - return function(options) { - let result = null - if (respond instanceof Function) { - const { body, type, url } = options - // https://expressjs.com/en/4x/api.html#req - result = respond({ - method: type, - body: JSON.parse(body), - query: param2Obj(url) - }) - } else { - result = respond - } - return Mock.mock(result) - } - } - - for (const i of mocks) { - Mock.mock(new RegExp(i.url), i.type || 'get', XHR2ExpressReqWrap(i.response)) - } -} - -module.exports = { - mocks, - mockXHR -} - diff --git a/mock/mock-server.js b/mock/mock-server.js deleted file mode 100644 index 8941ec0..0000000 --- a/mock/mock-server.js +++ /dev/null @@ -1,81 +0,0 @@ -const chokidar = require('chokidar') -const bodyParser = require('body-parser') -const chalk = require('chalk') -const path = require('path') -const Mock = require('mockjs') - -const mockDir = path.join(process.cwd(), 'mock') - -function registerRoutes(app) { - let mockLastIndex - const { mocks } = require('./index.js') - const mocksForServer = mocks.map(route => { - return responseFake(route.url, route.type, route.response) - }) - for (const mock of mocksForServer) { - app[mock.type](mock.url, mock.response) - mockLastIndex = app._router.stack.length - } - const mockRoutesLength = Object.keys(mocksForServer).length - return { - mockRoutesLength: mockRoutesLength, - mockStartIndex: mockLastIndex - mockRoutesLength - } -} - -function unregisterRoutes() { - Object.keys(require.cache).forEach(i => { - if (i.includes(mockDir)) { - delete require.cache[require.resolve(i)] - } - }) -} - -// for mock server -const responseFake = (url, type, respond) => { - return { - url: new RegExp(`${process.env.VUE_APP_BASE_API}${url}`), - type: type || 'get', - response(req, res) { - console.log('request invoke:' + req.path) - res.json(Mock.mock(respond instanceof Function ? respond(req, res) : respond)) - } - } -} - -module.exports = app => { - // parse app.body - // https://expressjs.com/en/4x/api.html#req.body - app.use(bodyParser.json()) - app.use(bodyParser.urlencoded({ - extended: true - })) - - const mockRoutes = registerRoutes(app) - var mockRoutesLength = mockRoutes.mockRoutesLength - var mockStartIndex = mockRoutes.mockStartIndex - - // watch files, hot reload mock server - chokidar.watch(mockDir, { - ignored: /mock-server/, - ignoreInitial: true - }).on('all', (event, path) => { - if (event === 'change' || event === 'add') { - try { - // remove mock routes stack - app._router.stack.splice(mockStartIndex, mockRoutesLength) - - // clear routes cache - unregisterRoutes() - - const mockRoutes = registerRoutes(app) - mockRoutesLength = mockRoutes.mockRoutesLength - mockStartIndex = mockRoutes.mockStartIndex - - console.log(chalk.magentaBright(`\n > Mock Server hot reload success! changed ${path}`)) - } catch (error) { - console.log(chalk.redBright(error)) - } - } - }) -} diff --git a/mock/table.js b/mock/table.js deleted file mode 100644 index bd0e013..0000000 --- a/mock/table.js +++ /dev/null @@ -1,29 +0,0 @@ -const Mock = require('mockjs') - -const data = Mock.mock({ - 'items|30': [{ - id: '@id', - title: '@sentence(10, 20)', - 'status|1': ['published', 'draft', 'deleted'], - author: 'name', - display_time: '@datetime', - pageviews: '@integer(300, 5000)' - }] -}) - -module.exports = [ - { - url: '/vue-admin-template/table/list', - type: 'get', - response: config => { - const items = data.items - return { - code: 20000, - data: { - total: items.length, - items: items - } - } - } - } -] diff --git a/mock/user.js b/mock/user.js deleted file mode 100644 index 7555338..0000000 --- a/mock/user.js +++ /dev/null @@ -1,84 +0,0 @@ - -const tokens = { - admin: { - token: 'admin-token' - }, - editor: { - token: 'editor-token' - } -} - -const users = { - 'admin-token': { - roles: ['admin'], - introduction: 'I am a super administrator', - avatar: 'https://wpimg.wallstcn.com/f778738c-e4f8-4870-b634-56703b4acafe.gif', - name: 'Super Admin' - }, - 'editor-token': { - roles: ['editor'], - introduction: 'I am an editor', - avatar: 'https://wpimg.wallstcn.com/f778738c-e4f8-4870-b634-56703b4acafe.gif', - name: 'Normal Editor' - } -} - -module.exports = [ - // user login - { - url: '/vue-admin-template/user/login', - type: 'post', - response: config => { - const { username } = config.body - const token = tokens[username] - - // mock error - if (!token) { - return { - code: 60204, - message: 'Account and password are incorrect.' - } - } - - return { - code: 20000, - data: token - } - } - }, - - // get user info - { - url: '/vue-admin-template/user/info\.*', - type: 'get', - response: config => { - const { token } = config.query - const info = users[token] - - // mock error - if (!info) { - return { - code: 50008, - message: 'Login failed, unable to get user details.' - } - } - - return { - code: 20000, - data: info - } - } - }, - - // user logout - { - url: '/vue-admin-template/user/logout', - type: 'post', - response: _ => { - return { - code: 20000, - data: 'success' - } - } - } -] diff --git a/mock/utils.js b/mock/utils.js deleted file mode 100644 index 95cc27d..0000000 --- a/mock/utils.js +++ /dev/null @@ -1,25 +0,0 @@ -/** - * @param {string} url - * @returns {Object} - */ -function param2Obj(url) { - const search = decodeURIComponent(url.split('?')[1]).replace(/\+/g, ' ') - if (!search) { - return {} - } - const obj = {} - const searchArr = search.split('&') - searchArr.forEach(v => { - const index = v.indexOf('=') - if (index !== -1) { - const name = v.substring(0, index) - const val = v.substring(index + 1, v.length) - obj[name] = val - } - }) - return obj -} - -module.exports = { - param2Obj -} diff --git a/vue.config.js b/vue.config.js index 4856ed0..ec12735 100644 --- a/vue.config.js +++ b/vue.config.js @@ -35,8 +35,9 @@ module.exports = { overlay: { warnings: false, errors: true - }, - before: require('./mock/mock-server.js') + } + // before: require('./mock/mock-server.js') + }, configureWebpack: { // provide the app's title in webpack's name field, so that