首页 文章

如何使用vuejs路由与历史回退和expressjs路由

提问于
浏览 次
3

我已经坚持了几个星期，我无法弄明白 . 这让我发疯了...我读了很多教程，听起来它应该有用！

我有一个expressjs服务器设置和一个vuejs应用程序 . 我希望能够使用历史浏览器模式为vuejs路由提供服务，并且我还希望能够为我的api层设置服务器端路由 .

如果我禁用历史记录模式，一切正常 - 但我需要启用历史记录模式，以便我可以使用auth0库和回调 . 回调不允许在网址中使用＃ .

这是我的代码：

const express = require('express');
const path = require('path');
const bodyParser = require('body-parser');
const logger = require('morgan');
const history = require('connect-history-api-fallback');

const app = express();

app.use(require('connect-history-api-fallback')())
app.use(logger('dev'));
app.use(bodyParser.json());
app.use(history({
  verbose: true
}));

app.get('/api', (req, res) => res.send('Hello World!'))
app.use('/', express.static(path.join(__dirname, 'dist')));

var port = process.env.PORT || 8080;
app.listen(port);
console.log('server started '+ port);

对于上面的代码，vuejs应用程序位于/ dist下，所有路由都可以工作 . 但是当我尝试命中/ api时 - 它也被重定向到vuejs应用程序 .

任何帮助将不胜感激！我正处在我认为不可能的地步 .

express vue.js callback routing auth0

1 回答

  • 1

    我遇到了同样的问题 . 我通过在api路线之后添加 app.use(history()) 但在 app.use('/', express.static(path.join(__dirname, 'dist'))); 之前修复了它 .

    所以我觉得你会这样

    const express = require('express');
const path = require('path');
const bodyParser = require('body-parser');
const logger = require('morgan');
const history = require('connect-history-api-fallback');

const app = express();

app.use(logger('dev'));
app.use(bodyParser.json());

app.get('/api', (req, res) => res.send('Hello World!'));
app.use(history({
  verbose: true
}));
app.use('/', express.static(path.join(__dirname, 'dist')));

var port = process.env.PORT || 8080;
app.listen(port);
console.log('server started '+ port);

    这个答案对我有所帮助：https://forum.vuejs.org/t/how-to-handle-vue-routes-with-express-ones/23522/2

    回复于

相关问题