我有一个简单的快速服务器,看起来像这样:
快速应用:
var express = require('express');
var compression = require('compression');
var path = require('path');
var cors = require('cors');
var router = express.Router();
var app = express();
app.use('/bundle', express.static(path.join(__dirname, '/bundle')));
app.enable('trust proxy');
app.use(compression());
app.get('*', function(req, res) {
res.header('Cache-Control', "max-age=60, must-revalidate, private");
res.sendFile( path.join(__dirname, 'index.html') );
});
var server = app.listen(process.env.PORT || 5000, function () {
var host = server.address().address;
var port = server.address().port;
console.log(`Example app listening at http://%s:%s`, host, port);
});
和简单的html 文件:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>React Router test</title>
</head>
<body>
<div id="root"></div>
<script src="bundle.js"></script>
</body>
</html>
在 bundle.js 中,我有带有客户端路由的 ReactJS 应用程序:
render((
<Router history={browserHistory}>
<Route path="/" component={App}>
<Route path="about" component={About} />
<Route path="about2" component={About2} />
<Route path="about3" component={About3} />
<Route path="*" component={NoMatch} />
</Route>
<Route path="*" component={NoMatch} />
</Router>
), document.getElementById('root'));
每当我尝试导航到域:端口/(路由器支持此路由)时,一切都很好。但是,当我尝试导航到更复杂的 URL 时,例如domain:port///..等,我在浏览器中遇到错误:
bundle.js:1 Uncaught SyntaxError: Unexpected token <
看起来像从静态服务器响应发送 bundle.js 而不是使用 index.html 和 bundle.js 内部有 html 标记。
我怎样才能解决这个问题?
谢谢!