404 с Symfony 5 API и Vuejs в качестве внешнего интерфейса в разных корневых папках

я много искал, но я не нашел ответа. Это моя структура папок на моем общем хосте:

- api.subdomain
  - index.php
  - .htaccess
  - ...

- public_html
  - index.html
  - ...

Поэтому, когда я перехожу на http://example.com, он загружает Vuejs, а мой API находится в http://api.example.com

Проблема в том, что когда я перезагружаю страницу, т. е. http://example.com/news (или ввожу вручную, чтобы ссылка), он дает мне 404 Не найдено. Я прочитал в документации Vuejs это:

Поскольку наше приложение представляет собой одностраничное клиентское приложение, без надлежащей настройки сервера пользователи получат ошибку 404 при доступе к http://oursite.com/user/id прямо в своем браузере.

И пускают такой конфиг:

<IfModule mod_rewrite.c>
 RewriteEngine On
 RewriteBase /
 RewriteRule ^index\.html$ - [L]
 RewriteCond %{REQUEST_FILENAME} !-f
 RewriteCond %{REQUEST_FILENAME} !-d
 RewriteRule . /index.html [L]
</IfModule>

Но symfony автоматически сгенерировал это:

<IfModule mod_rewrite.c>
    RewriteEngine On
    RewriteCond %{REQUEST_URI}::$0 ^(/.+)/(.*)::\2$
    RewriteRule .* - [E=BASE:%1]

    # Sets the HTTP_AUTHORIZATION header removed by Apache
    RewriteCond %{HTTP:Authorization} .+
    RewriteRule ^ - [E=HTTP_AUTHORIZATION:%0]

    RewriteCond %{ENV:REDIRECT_STATUS} =""
    RewriteRule ^index\.php(?:/(.*)|$) %{ENV:BASE}/$1 [R=301,L]
    
    RewriteCond %{REQUEST_FILENAME} !-f
    RewriteRule ^ %{ENV:BASE}/index.php [L]
</IfModule>

Я не знаю, как их объединить, и я не понимаю, как мне это сделать, если приложения находятся в другом корневом каталоге. Я пробовал много вещей, но ничего не получалось

Надеюсь, кто-нибудь может мне помочь. Спасибо!


person Adoc    schedule 25.08.2020    source источник
comment
Отвечает ли это на ваш вопрос? Vue Router возвращает 404 при повторном посещении URL-адреса   -  person Phil    schedule 27.08.2020
comment
Спасибо за предложение. Это частично решает проблему (поскольку это тот же контент .htaccess), но этот поток не объясняет, что вам нужен .htaccess в корневом проекте API и еще один .htaccess в проекте Vuejs (на общем хосте и со структурой, которая У меня есть).   -  person Adoc    schedule 27.08.2020


Ответы (1)


Я уже исправляю. Если у кого-то еще есть эта проблема на виртуальном хостинге, решение состоит в том, чтобы добавить .htaccess (как сказано в документации Vue) в корень приложения Vue (в моем случае это public_html).

На всякий случай это .htaccess:

<IfModule mod_rewrite.c>
  RewriteEngine On
  RewriteBase /
  RewriteRule ^index\.html$ - [L]
  RewriteCond %{REQUEST_FILENAME} !-f
  RewriteCond %{REQUEST_FILENAME} !-d
  RewriteRule . /index.html [L]
</IfModule>

Я не знаю, лучшее ли это решение, но решает проблему.

person Adoc    schedule 27.08.2020