在Azure上部署时无法将Node.js应用连接到React.js应用

Question

我正在尝试在Azure上部署一个MERN应用（React.js作为客户端，Node.js作为服务器）。我创建了一个Cosmos数据库帐户和数据库（MongoDB），并将Node.js应用程序连接到该数据库。

我无法在Node.js和React.js应用之间创建通信。

我已经创建了 React.js应用程序的内部版本并粘贴到Node.js应用程序中并部署了Node.js应用程序。

我遇到问题

  

“无法获取/”

我还尝试通过在下面的结构中将整个React.js应用程序粘贴到Node.js应用程序中来手动部署该应用程序

|- node-app
   |- client
       |- react-app
|- node-app rest files...

我不知道如何在生产环境中获取环境变量

我的app.js在下面-

require('dotenv').config();
require('./config/database.config');

var app = express();

// view engine setup
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'pug');

app.use(express.static(path.join(__dirname, 'build')));

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

app.use(function(err, req, res, next) {
  // set locals, only providing error in development
  res.locals.message = err.message;
  res.locals.error = req.app.get('env') === 'development' ? err : {};

  // render the error page
  res.status(err.status || 500);
  res.render('error');
});

module.exports = app;

我的数据库配置文件在下面-

var mongoose = require('mongoose');

mongoose.connect(
  process.env.DB_CONN,
  {
    auth :{user : process.env.DB_USER, password : process.env.DB_PW},
    useNewUrlParser: true
  })
    .then(() => {
    console.log("Successfully connected to the database");    
  }).catch(err => {
    console.log('Could not connect to the database. Exiting now...', err);
    process.exit();
});

Answer 1

根据我的经验，我认为您的问题是由您的代码app.use(express.static(path.join(__dirname, 'build')));服务于npm run build构建的React客户端的静态文件引起的。

在Azure上，本地和Azure之间的变量__dirname有所不同。在本地，__ dirname变量的值始终是启动节点进程的完整路径名，例如，如果在CMD中以D：\ home运行节点，则print __dirname将返回D：\ home。但是在Azure上，您将在任何路径中看到__dirname值。如果您尝试运行命令节点-e“ const path = require（'path'）; console.log（__ dirname）;”在Kudu控制台中，如下图所示。

因此，path.join(__dirname, 'build')的值始终为build，与IIS启动的节点的当前路径无关。因此，要解决此问题，请使用D:\home\site\wwwroot这样的绝对路径，而不要使用__dirname方法中的path.join变量，或者直接使用D:\home\site\wwwroot\build方法中的express.static。

任何担心，请随时让我知道。