I have a simple Node Express server setup that serves an html file with a bundle.js.
(我有一个简单的Node Express服务器设置,该服务器提供带有bundle.js的html文件。)
Whenever I try to add a route that catches all routes and redirects to the homepage, I get an error in the console when I open an unmapped route saying(每当我尝试添加可捕获所有路由并重定向到首页的路由时,打开未映射的路由时,控制台中都会出现错误,提示:)
"EventSource's response has a MIME type ("text/html") that is not "text/event-stream". Aborting the connection."
(“ EventSource的响应具有不是“ text / event-stream”的MIME类型(“ text / html”)。中止了连接。”)
I'm not exactly sure what this means, I was also having issues with trying to serve the index.html (Issues with the path for the file) so it's possible that might have something to do with this.
(我不确定这意味着什么,尝试提供index.html(文件路径的问题)时也遇到了问题,因此可能与此有关。)
I'm trying to serve the Index.html inside the build folder.(我正在尝试在build文件夹中提供Index.html。)
Project Structure:
(项目结构:)
Index.js (Server File)
(Index.js(服务器文件))
const http = require('http');
const express = require('express');
const bodyParser = require('body-parser');
const path = require('path');
const app = express();
const server = http.createServer(app);
app.use(bodyParser.json());
app.use(express.static(path.join(__dirname, '.', 'public/build')));
app.get('/', (req, res) => {
res.sendFile('index.html', {root: path.join(__dirname, 'public/build')});
res.end();
});
app.all('*', (req, res) => {
console.log('triggered');
res.redirect('/');
res.end();
});
server.listen(3000);
Oddly enough, when I go to localhost:3000 It prints "triggered" in the node console and If I remove the "app.all" line of code that catches any other routes, then it doesn't throw this error anymore:
(奇怪的是,当我转到localhost:3000时,它在节点控制台中显示“已触发”,并且如果我删除捕获任何其他路由的“ app.all”代码行,那么它将不再抛出此错误:)
"EventSource's response has a MIME type ("text/html") that is not "text/event-stream". Aborting the connection."
(“ EventSource的响应具有不是“ text / event-stream”的MIME类型(“ text / html”)。中止了连接。”)
However, If I remove the line of code that catches routes, I get the error "cannot GET /routename" as expected.
(但是,如果我删除捕获路由的代码行,则会收到错误“无法获取/ routename”,这是预期的。)
Index.html
(Index.html)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>project</title>
</head>
<body>
<div id="root"></div>
<script type="text/javascript" src="bundle.js"></script></body>
</html>
Content being rendered in the Index.html file
(在Index.html文件中呈现的内容)
import React from 'react';
import './styles/index.css';
const App = () => {
return (
<div>
<h1>Home Page</h1>
<button onClick={null}>Click Me</button>
</div>
);
};
export default App;
Index.js (Client side)
(Index.js(客户端))
import React from 'react';
import ReactDOM from 'react-dom';
import {Provider} from 'react-redux';
import App from './App';
import store from './redux/store';
require('webpack-hot-middleware/client');
ReactDOM.render(
<Provider store={store}>
<App/>
</Provider>
, document.getElementById('root')
);
ask by Waqas Abbasi translate from so