Angular маршрутизация не работает при статическом развертывании с Node

Question

Я создаю свой проект angular и вставляю результат сборки в папку publi c в root моего проекта узла.

В моем файле app. js у меня есть следующий код:

...
app.use(express.static(path.join(__dirname, 'public')));
...
app.get('*', (req, res) => {
     res.send(path.join(__dirname, 'public/index.html'));
});

При развертывании проекта это отлично работает; когда я загружаю страницу, отображается index. html, и навигация по странице работает.

Однако, когда я ввожу URL-адрес, например, «/ admin», который определен в моей angular маршрутизации, я получаю сообщение об ошибке «Не найдено».

Как это решить?

Answer 1

Проблема была в методе .send () ... Я заменил это:

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

на это:

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

, и это сработало. Извините, ребята, что вы теряете время. Но вы помогли мне исследовать разные вещи!

Answer 2

Я не знаю вашего кода, но

1. вы можете попробовать настроить base-href в своем индексе. html

   <base href="/"> 
   

   правильно. ...

2. Обслуживание с nginx может иметь такую ​​конфигурацию. Он направляет index. html на правильные маршруты вашего SPA:

   root /home/app/dist/;
   
   server {
       listen 8080;
       server_name  localhost;
   
       location /admin/ {
         alias /home/app/dist/my-app/admin/;
         expires -1;
         add_header Cache-Control "no-cache, must-revalicate, post-check=0 pre-check=0";
         index index.html;
         try_files $uri $uri/ index.html =404;
       }
   
       location / {
         alias /home/app/dist/my-app/;
         expires -1;
         add_header Cache-Control "no-cache, must-revalicate, post-check=0 pre-check=0";
         index index.html;
         try_files $uri $uri/ index.html =404;
       }
   }
   

см. nginx инструкции здесь: https://medium.com/better-programming/how-to-properly-get-angular-and-nginx-working-together-for-development-3e5d158734bf

Answer 3

выше router.get, у вас должно быть: -

// serve angular front end files from root path
router.use('/', express.static('public', { redirect: false }));

Answer 4

Надеюсь, это решит вашу проблему. Создайте файл .htaccess в папке root и передайте

RewriteEngine on
RewriteCond %{REQUEST_FILENAME} -s [OR]
RewriteCond %{REQUEST_FILENAME} -l [OR]
RewriteCond %{REQUEST_FILENAME} -d
RewriteRule ^.*$ - [NC,L]

RewriteRule ^(.*) /index.html [NC,L]