首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >使用Node.js服务静态文件存在问题,有时发现文件,有时找不到,如何解决呢?

使用Node.js服务静态文件存在问题,有时发现文件,有时找不到,如何解决呢?
EN

Stack Overflow用户
提问于 2018-11-20 09:08:32
回答 3查看 2.2K关注 0票数 0

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

我已经试过几个小时了。当我在docker中运行并将应用程序推送到Heroku时,有时会遇到以下错误: Error: ENOENT:没有这样的文件或目录,stat '/usr/src/app/server/build/index.html‘

这很奇怪?如果我点击周围,一切都正常。突然,它不起作用了,它告诉我它找不到index.html

如果我再一次进入页面,再点击一遍,一切都正常。为什么会发生这种情况?

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

代码语言:javascript
复制
// 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"));
  });
}

我的文件夹结构:

我的反应路由器:

代码语言:javascript
复制
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")
);

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

我能做些什么来避免吗?谢谢帮忙!

EN

回答 3

Stack Overflow用户

回答已采纳

发布于 2018-11-20 15:07:09

我解决了问题。

用于服务静态文件的新代码。

代码语言:javascript
复制
// 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'));
  });
}
票数 1
EN

Stack Overflow用户

发布于 2018-11-20 09:43:58

我还没有对其进行测试,但您正在处理来自build文件夹的静态文件,而app.get则从该文件夹为index.html提供服务。所以试着:

代码语言:javascript
复制
if ( process.env.NODE_ENV === "production" || process.env.NODE_ENV === "docker" ) {
  // Set static folder
  app.use("/", express.static("build"));
}

至少这是明示的部分。但通常情况下,反应路由器是如何适应画面的。

票数 0
EN

Stack Overflow用户

发布于 2018-11-20 13:21:42

我的猜测是,app.use("/", express.static("build"));不像您所期望的那样工作。试着去做吧:

代码语言:javascript
复制
const clientDir = path.resolve(__dirname, 'build')
app.use(express.static(clientDir))

但很难猜到。我在使用上面的东西时一点问题都没有。它可能不适用于您的用例。祝好运。

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/53389571

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档