Использование NGINX в качестве прокси на Heroku для express.js 404

Question

Я пытаюсь развернуть новый сайт в Heroku, который использует express.js и отделенную CMS. Все работает нормально, проблема в том, что в рамках перехода со старого сайта есть около 300 уникальных перенаправлений, которые мне нужно выполнить.

Я думал, что смогу использовать NGINX в качестве прокси и поместить туда перенаправление, но не могу заставить конфигурацию работать правильно.

В моем приложении есть сборочный пакет NGINX и сборочный узел js. Это мой конфиг NGINX

daemon off;

worker_processes <%= ENV['NGINX_WORKERS'] || 4 %>;

events {
    use epoll;
    accept_mutex on;
    worker_connections 1024;
}

http {
    # Buffers
    client_body_buffer_size 10K;
    client_header_buffer_size 1k;
    client_max_body_size 8m;
    large_client_header_buffers 2 1k;

    # Timeouts
    client_body_timeout 12;
    client_header_timeout 12;
    keepalive_timeout 15;
    send_timeout 10;

    # Gzip
    gzip on;
    gzip_comp_level 2;
    gzip_min_length 1000;
    gzip_proxied expired no-cache no-store private auth;
    gzip_types text/plain application/x-javascript text/xml text/css application/xml;

    # Logging
    log_format l2met 'measure#nginx.service=$request_time request_id=$http_x_request_id';
    access_log off;
    error_log logs/nginx/error.log;

    # Other
    server_tokens off;
    include mime.types;
    sendfile on;

    server {
        listen <%= ENV["PORT"] %>;
        server_name _;
        rewrite ^old-path$ https://www.newdomain.com/new-path permanent;
    root /client/public;

        location = / {
            proxy_pass http://127.0.0.1:3001;
            proxy_redirect default;
            proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
            proxy_set_header Host $http_host;
        }
    }
}

Это мой файл package.json

{
  "name": "my aoo",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "engines": {
    "node": "8.10.0",
    "npm": "5.6.0"
  },
  "scripts": {
    "start": "node index.js",
    "server": "nodemon index.js",
    "client": "cd client/ && npm run prod:compress",
    "dev": "concurrently \"npm run client\" \"npm run server\""
  },
  "repository": {
    "type": "git",
    "url": "#########"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "homepage": "##########",
  "dependencies": {
    "babel-register": "^6.26.0",
    "body-parser": "^1.18.3",
    "compression": "^1.7.3",
    "concurrently": "^4.0.1",
    "connect": "^3.6.6",
    "dotenv": "^6.1.0",
    "express": "^4.16.4",
    "express-static-gzip": "^1.1.3",
    "http": "^0.0.0",
    "nodemailer": "^4.6.8",
    "nodemailer-smtp-transport": "^2.7.4",
    "nodemon": "^1.18.4",
    "prerender-node": "^3.2.1",
    "prismic-dom": "^2.1.0",
    "prismic-javascript": "^2.0.1",
    "react-cookie-consent": "^1.9.0",
    "react-router-sitemap-builder": "^1.1.1",
    "serve-static": "^1.13.2",
    "sitemap-generator": "^8.3.1",
    "swig": "^1.4.2"
  }
}

Это Procfile

web: bin/start-nginx npm start

При тестировании в dev он выполняет перенаправление и при посещении сайта в корневом домене работает, но если я пытаюсь посетить путь непосредственно за пределами маршрута, я получаю 404.

Спасибо.

Answer 1

Это потому, что React - это одностраничное приложение, и вам нужно перенаправлять обратно в файл index.html. добавить эту команду.

location {
    ...
    try_files $uri /index.html;
}