У меня есть интерфейс VueJS, настроенный с интерфейсом ExpressJS, что очень похоже на то, о чем вы говорите.И да, это вполне возможно.Итак, давайте рассмотрим каждый из ваших вопросов по отдельности.
Может ли приложение Vue.js быть размещено на веб-сервере для обслуживания статических файлов HTML, если да, то какой из них совместим?
Да, когда вы запускаете VueJS, вы можете либо build
как статическое приложение, либо serve
как приложение NodeJS.
См. Раздел Развертывание документации по Vue CLI 3 здесь .В нем объясняется, как каталог /dist
используется для обслуживания приложения VueJS так, как вы намереваетесь.
Могут ли как внешние, так и внутренние службы работать на одном сервере, на разных портах дляНапример, и какие будут лучшие рекомендации для этого?
Недавно я опубликовал пример того, как разместить ваш Front-End и API на одном сервере здесь .(Включает примеры кодирования и пояснения).Этот ответ ссылается на ExpressJS как на API, но принципы те же.На самом деле, просто прослушайте интерфейсный порт на порту 80, а ваш API работает на другом неиспользуемом порту (например, 8081).
И как аутентификация при входе влияет на запуск веб-приложения втаким образом, и я должен искать создание какой-либо аутентификации OAuth между передней и задней панелями?
Я обрабатываю всю аутентификацию на внутренней стороне.По сути, в Vue Router вы можете установить параметр secure
.Затем объявите router.beforeEach((to,from,next) => {});
вызов в конце.Затем этот вызов должен проверить, есть ли у пользователя действующий токен для входа, и перенаправить его на страницу входа в приложения после установки файла cookie с URL-адресом, с которого пользователю было предложено войти, чтобы его можно было отправить обратно после входа в систему.
В нашем случае пользователь перенаправляется на маршрут VueJS /saml/login
.Компонент /saml/login
.Этот компонент выполняет вызов API и возвращает адрес, на который пользователь должен быть перенаправлен для входа в систему.В нашем случае это API (который работает на том же сервере, но с другим портом [см. Ответ выше]), www.example.com:8081/api/v1/saml_login.Затем он работает с IDP и получает токен и пользовательские данные.Здесь вы также можете выполнять функции ACS (подготовка пользователя, обновление времени входа в систему или пользовательских данных и т. Д.). После получения токена он помещается в файл cookie или другой заполнитель, чтобы его можно было использовать для проверки на соответствие.токен хранится в базе данных при первоначальной проверке пользователя.(Лучше всего устанавливать срок действия на токены).Затем пользователь перенаправляется на URL-адрес, сохраненный в файле cookie, который позволяет нам узнать, откуда ему было предложено выполнить вход, чтобы они могли просматривать свое содержимое, не просматривая его снова.(Рад поделиться с вами кодом, если хотите)