Question

我正在使用vue.js编写应用程序，我在dev-server.js中模拟了localhost的登录api，现在我想将有关登录api的代码分离成一个独立的文件，我该怎么办？除了有一些关于CORS的代码，这里是代码：

var app = express()
var bodyParser = require('body-parser')
var multer = require('multer')
var upload = multer()

app.use(bodyParser.json())
app.use(bodyParser.urlencoded({extended: true}))
// CORS
var allowCrossDomain = function (req, res, next) {
  res.header('Access-Control-Allow-Origin', 'http://localhost:8080')
  res.header('Access-Control-Allow-Methods', 'GET, POST, PUT, DELETE')
  res.header('Access-Control-Allow-Headers', 'Content-Type, X-Token')
  res.header('Access-Control-Allow-Credentials', 'true')
  next()
}
app.use(allowCrossDomain)



// mock localhost api
var apiRoutes = express.Router()
// login api;
const userAccountList = ['100000', '100001', '100002', '100003']
apiRoutes.post('/user/login', upload.array(), function (req, res) {
  if (userAccountList.indexOf(req.body.account) < 0){
    return res.json({
      code: 50000,
      msg: 'the account or the password is not correct, please try again'
    });
  }
}
app.use('/api', apiRoutes);

Answer 1

也许可以查看像webpack这样的模块捆绑包。它允许您将代码拆分为可以一起加载的不同包。

Answer 2

（我认为它是关于节点和表达的问题，而不是vue.js）

虽然express基本上是用中间件构建的web应用程序，但我认为现在是时候将你的逻辑分成不同的中间件了。

因此，您可以将登录逻辑作为中间件（例如：

）放入独立的.js文件中

MutationObserver

然后从你的应用程序中要求它：

// login.js

const userAccountList = ['100000', '100001', '100002', '100003']

const loginMiddleware = function (req, res, next) {
  if (userAccountList.indexOf(req.body.account) < 0){
    res.json({
      code: 50000,
      msg: 'the account or the password is not correct, please try again'
    });
  }
};

module.exports = loginMiddleware;

以下是有关如何正确编写中间件的官方明文：https://expressjs.com/en/guide/using-middleware.html

如何将vue中的dev-server.js文件拆分为多个单独的文件？

2 个答案: