Question

我正在使用create-react-app。

当你去localhost：3001 / test - 它提供HTML。但你所看到的只是一个空页面，因为id＆＃34; root＆＃34;渲染。

这是我服务器中的代码：

    #define USING(...) if(__VA_ARGS__; true)

        USING(int i = 0)
        USING(std::string s = "0")
        {
            Assert::IsTrue(i == 0, L"Invalid result", LINE_INFO());
            Assert::IsTrue(s == "0", L"Invalid result", LINE_INFO());
        }
        //i = 1; // error C2065: 'i': undeclared identifier
        //s = "1"; //error C2065: 's': undeclared identifier

我的HTML接近这个：

app.get('/test', (req, res) => {
    res.sendFile(__dirname + '/public/index.html');
})

Answer 1

根据提供的一些细节，我会给出一份清单

1-确保您在代码的这一部分中有 root

ReactDOM.render(<YourApp />, document.getElementById('root'));

2-在您的控制台中，您是否有类似的错误消息？

对预检请求的响应没有通过访问控制检查：否＆＃39;访问控制 - 允许 - 来源＆＃39;标头出现在请求的资源上。

...然后由于CORS问题，您只是没有从服务器接收数据。使用此：CORS

3-仔细检查执行res.sendFile的服务器是否正常运行，检查终端是否检查错误，例如＆＃34;找不到文件＆＃34;或者类似的问题。

4-这有效（我只是尝试过），在与当前服务器相同的目录中进行尝试。将代码粘贴到testNode.js中并运行node testNode.js，然后访问http://localhost:3003/test

const express = require('express')
const app = express()
const port = 3003

app.get('/test', (req, res) => {
    res.sendFile(__dirname + '/public/index.html');
})

app.get('/', (request, response) => {
  response.send('Hello from Express!')
})

app.listen(port, (err) => {
  if (err) {
    return console.log('something bad happened', err)
  }

  console.log(`server is listening on ${port}`)
})

5- 公共/文件夹是否可读？它有权限吗？试试chmod -R 777 public/（稍后再修改）

Answer 2

您必须设置静态文件的位置。例如，如果您使用环境变量。

if(process.env.ENV === 'prod'){
    app.use(express.static('client/build'));
    const path = require('path');

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

此外，请确保运行npm run build以创建部署所需的所有文件。

如何使用express .senfFile发送React.js文件？

2 个答案: