Как развернуть отдельный сервер и интерфейс на одном сервере

Question

Я разработал проект с Vuejs в качестве внешнего интерфейса и Laravel в качестве внутреннего API. На локальном хосте они работают в разных портах. Как мне развернуть их в рабочей среде?

Answer 1

При создании приложения Vue для производства все соответствующие файлы находятся в папке dist.Он не работает ни на одном порту, но вместо этого файлы обслуживаются веб-сервером (например, Apache или Nginx).Для API-интерфейса laravel у вас обычно есть папка public в установке laravel, а остальные файлы не доступны напрямую из Интернета.

Я предполагаю, что вы хотите развернуть APIи интерфейс в том же домене.Самый простой способ заставить это работать - иметь определенный префикс для вашего API.В приведенном ниже случае я использую префикс /api для всех запросов API, так как это значение по умолчанию для маршрутов API.Все остальное считается запросом внешнего интерфейса.

Вы настраиваете структуру папок, как показано ниже.Папка public_html - это то, что обычно загружается при переходе на example.com, и вы можете проверить это, добавив файл test.txt с некоторым содержанием и перейдя к example.com/test.txt.Папка backend содержит вашу установку laravel.Папка frontend содержит все, что содержится в папке dist после запуска npm run build.

/var
+-- /www
    +-- /vhosts
        +-- /example.com
            +-- public_html
        +-- /backend
        +-- /frontend

Чтобы все заработало, мы собираемся удалить папку public_html и заменить ее насимволическая ссылка на backend/public.

cd /var/www/vhosts/example.com
rm -r public_html
ln -s ../backend/public public_html

Когда мы проверяем example.com, теперь мы должны увидеть, что мы можем делать запросы к API, используя example.com/api/someroute.Есть несколько способов заставить интерфейс работать с этим, но для простоты развертывания, давайте создадим символическую ссылку на папку dist.

cd /var/www/vhosts/example.com/public_html
ln -s ../../frontend/dist app

Если вы используете режим хеширования для своего приложения Vue и неЯ не против доступа к приложению через example.com/app, я думаю, это все, что вам нужно сделать.В противном случае вам придется изменить файл .htaccess, если вы используете Apache, или изменить конфигурацию перезаписи любого другого веб-сервера, который вы используете.Я думаю, что файл .htaccess будет выглядеть примерно так:

# We assume that the FollowSymLinks option is enabled in the main Apache configuration.
RewriteEngine On

# Rewrite anything that starts with `api` to the laravel index file
RewriteCond %{REQUEST_URI} ^/api
RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{REQUEST_FILENAME} !-f
RewriteRule ^ index.php [L]

# Rewrite anything else to the frontend app
RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{REQUEST_FILENAME} !-f
RewriteRule ^ /app/index.html [L]