时间戳

首页 > 解决方案 > 使用 Node.js 提供静态文件时出现问题，有时找到文件，有时找不到文件，如何解决？

node.js - 使用 Node.js 提供静态文件时出现问题，有时找到文件，有时找不到文件，如何解决？

问题描述

create-react-app我用 Node.js 作为后端做了一个 React 项目。我使用 Node.js 提供静态文件。

我试图弄清楚几个小时。当我在 docker 中运行并将应用程序推送到 Heroku 时，有时会出现此错误：错误：ENOENT：没有这样的文件或目录，stat '/usr/src/app/server/build/index.html'

那很奇怪 ？如果我点击周围，一切正常。突然它不起作用，它告诉我它找不到index.html？

如果我再次进入该页面并再次单击，一切正常。为什么会这样？

我在 node.js 文件中提供静态文件的代码server.js：

// Serve static files if in production or running in docker
if ( process.env.NODE_ENV === "production" || process.env.NODE_ENV === "docker" ) {
  // Set static folder
  app.use("/", express.static("build"));

  app.get("*", (req, res) => {
    res.sendFile(path.resolve(__dirname, "build", "index.html"));
  });
}

我的文件夹结构：

文件夹结构

还有我的反应路由器：

import Homepage from "./pages/Homepage";
import Dashboard from "./pages/Dashboard";
import Leaderboard from "./pages/Leaderboard";
import Signup from "./pages/Signup";
import Login from "./pages/Login";
import About from "./pages/About";
import Quiz from "./pages/Quiz";
import Locked from "./containers/Locked";

import WebSocketService from "./services/WebSocketService";

// Add the redux.dispatch function to WebSocketService
WebSocketService.setDispatch(store.dispatch);

ReactDOM.render(
  <Provider store={store}>
    <Router>
      <Switch>
        <Route exact path="/" component={Homepage} />
        <Route exact path="/signup" component={Signup} />
        <Route exact path="/login" component={Login} />
        <Route exact path="/about" component={About} />
        {/* Locked */}
        <Locked>
          <Route exact path="/leaderboard" component={Leaderboard} />
          <Route exact path="/dashboard" component={Dashboard} />
          <Route exact path="/play/:quizId" component={Quiz} />
        </Locked>
        {/* 404 */}
        <Redirect to="/" />
      </Switch>
    </Router>
  </Provider>,
  document.getElementById("root")
);

在开发模式下一切正常，但在生产中我遇到了这些问题。当我在开发模式下刷新页面时，我仍然在页面上。如果我在生产模式下刷新，我也会得到同样的错误：错误：ENOENT：没有这样的文件或目录，stat '/usr/src/app/server/build/index.html'

我可以做任何调整来避免它吗？感谢您的帮助！

标签： node.jsreactjsherokustatic-files

解决方案

我解决了这个问题。

用于提供静态文件的新代码。

// Serve static files if in production or running in docker
if ( process.env.NODE_ENV === "production" || process.env.NODE_ENV === "docker" ) {
  // Set static folder
  app.use(express.static(path.join(__dirname, '../build')));

  app.get('/*', (req, res) => {
    res.sendFile(path.join(__dirname, '../build', 'index.html'));
  });
}

推荐阅读