MEAN-приложение в производстве: не удается вызвать API

Question

Я пытаюсь развернуть свое MEAN-приложение.Прежде чем сделать это на герою или в каком-то другом месте, я тестирую производственный режим.Все работает в «режиме разработки», когда я запускаю Node и Angular отдельно на двух разных портах.В производственном режиме я не могу получить доступ к API бэкэнда.

Использование переменных окружения (см. Ниже) У меня есть Node.js / Express server Угловой скомпилированный код в / dist.Вот некоторые соответствующие выдержки из кода Node.js:

const express = require("express");
const path = require('path')
const cors = require('cors');
const  mongoose = require('mongoose');

const app = express();
... //some non-relevant stuff eg passport, body-parser ...

//Load configurations
const config = require('./config/config.js');
// Load routes
const storeroutes = require('./routes/stores.routes.js');
//Use mongoose to connect to the stores DB in mongoDB

mongoose.connect(config.mongoDB, { useNewUrlParser: true });
mongoose.connection.once('open', () => {
    console.log('Connection to the MongoDB database established successfully!');
});
// CORS Middleware
app.use(cors());
...
// Static Folders (used by Node)
app.use(express.static(path.join(__dirname, 'views')));
app.use(express.static(path.join(__dirname, 'public')));

// Serve Angular
if (process.env.NODE_ENV == 'production') {
  app.use(express.static("../dist/"));
  app.use((req, res) => {
    res.sendFile(path.join(__dirname, '../dist/index.html')); 
  });
}

// Use routes
app.use('/', storeroutes)

app.listen(config.port);

config / config.js просто экспортирует переменные среды .. так что поверьте мне, что NODE_ENV = 'production', config.port = 4000,и другие, которые я не показываю.

Маршруты в stores.routes.js в основном являются экспресс-маршрутизаторами, и, как я уже сказал, все работает в режиме разработки.Например, в режиме разработки API на http://localhost:4000/stores отображается в базе данных mongoDB

Когда я запускаю NODE_ENV=production node server.js, интерфейсная страница отображается правильно, но под капотом вызовы серверного API не выполняются, см.скриншоты.На самом деле я не могу перейти к ссылке API выше.

В моей службе Angular я вызываю API следующим образом:

export class StoreService {
  uri:string = environment.node_url; //this is 'http://localhost:4000'
  // Fetches all documents.
  getAllStores() {
    return this.http.get(`${this.uri}/stores`);
  }
  ...
}

Я подозреваю, что проблема в коде Node / Express app.use((req, res) => { res.sendFile(.., но, возможно, это проблема вURL к API, который я использую в Angular (я должен попытаться использовать baseUrl как-нибудь?).

Answer 1

Приведенный ниже код принудительно направляет всю маршрутизацию к index.html внешнего интерфейса:

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

Сначала я сделал это, удалив эти строки.Однако лучшим решением было бы поместить бэкэнд API выше следующим образом:

// Use routes for backend API
app.use('/', storeroutes)

// Serve Angular
if (process.env.NODE_ENV == 'production') {
  app.use(express.static("../dist/"));
  // Any request that is not the storeroutes above goes to Angular client
  app.get('*', (req, res) => {
    res.sendFile(path.resolve(__dirname, '../dist','index.html')); 
  });
}