Вроде бы элементарный вопрос по Angular -> Роутинг, НО...?

Question

[Максим]

Имеется элементарная структура сайта:

http://localhost:4200 <-home-page

http://localhost:4200/cars <-cars-page

http://localhost:4200/not-found <- not-found

Прописаны роуты

const appRoutes: Routes = [
  { path: '', component: HomePageComponent },
  { path: 'cars', component: CarsPageComponent },
  { path: 'not-found', component: NotFoundComponent },
  { path: '**', redirectTo: '/not-found' }
];

Локально все работает замечательно, НО когда все собираю и заливаю на хост (к примеру www.mysite.com), то когда перехожу по прямой ссылке, вкладки работают нормально, когда в адресной строке пишу руками www.mysite.com/cars, или www.mysite.com/blabla, то получаю ошибку

Ошибка

Нашел информацию, что можно в app.modules.ts добавить строку

providers: [{provide: LocationStrategy, useClass: HashLocationStrategy}],

Соответственно в адресной строке появляется #, т.е. www.mysite.com/#/, www.mysite.com/#/cars, www.mysite.com/#/not-found и все переходы работают без проблем и если руками прописываешь www.mysite.com/#/cars попадаешь на нужную страницу

Есть ли еще варианты решения данной задачи, что бы не использовать #

Спасибо за внимание! :)

Answer 1

[Максим]

Решением было добавлением .htaccess

RewriteEngine On
# If an existing asset or directory is requested go to it as it is
RewriteCond %{DOCUMENT_ROOT}%{REQUEST_URI} -f [OR]
RewriteCond %{DOCUMENT_ROOT}%{REQUEST_URI} -d
RewriteRule ^ - [L]

# If the requested resource doesn't exist, use index.html
RewriteRule ^ /index.html

Ответ брал тут

Answer 2

[Евгений Калибров]

Вам нужно настроить ваш http-сервер так, что бы все запросы пересылались на файл index.html
Например для apache это можно сделать так:

RewriteEngine On
RewriteCond %{REQUEST_URI} !^/index.html$
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{REQUEST_URI} !\.(css|gif|ico|jpg|js|png|swf|txt|svg|woff|ttf|eot)$
RewriteRule . index.html [L]

Comments

[Максим]

Добавили сюда

<VirtualHost *:80>
    ServerAdmin [e-mail]
    DocumentRoot "/home/user/public/admin/www"
    ServerName mysite.com
    ServerAlias www.mysite.com *mysite.com
    ErrorLog "/home/user/public/admin/logs/error_log"
    CustomLog "/home/user/public/admin/logs/access_log" common

    RewriteEngine On
    RewriteCond %{REQUEST_URI} !^/index.html$
    RewriteCond %{REQUEST_FILENAME} !-f
    RewriteCond %{REQUEST_FILENAME} !-d
    RewriteCond %{REQUEST_URI} !\.(css|gif|ico|jpg|js|png|swf|txt|svg|woff|ttf|eot)$
    RewriteRule . index.html [L]

    <Directory "/home/user/public/admin/www">
        Require all granted
    </Directory>
</VirtualHost>

теперь вот такое выдает

Bad Request

[Максим]

Есть еще какие то варианты?