Веб-приложения AZURE: развертывание сервера Angular SPA & Node Express из репозитория Github

У меня есть веб-приложение в репозитории Github, в котором есть клиент Angular и внутренний сервер Node Express. Я понятия не имею, как развернуть их одновременно в веб-приложении Azure. Ни один из уроков не покрывает это. Единственное, что они советуют вам сделать, - это поместить index.html или server.js в корневой каталог, что отличается от структуры моего приложения.

Но я попытался переместить сервер в server.js в корневом каталоге, и тогда ничего не произошло.

Я понятия не имею, с чего начать. Большое спасибо за любую помощь.

Скажите мне, какая дополнительная информация вам нужна, потому что я понятия не имею и документации для этого нет.

Обновление: ничего из этого не работает. Я попытался переключить виртуальный путь для / в папку dist, где index.html живет, но это ничего не сделало.

Источник

2 ответа

Решение

Похоже, вы также открыли тему на MSDN с этой проблемой по адресу https://social.msdn.microsoft.com/Forums/azure/en-US/a6cbc494-dc42-4962-99c7-947cee7ff25a/nodejs-deploying-angular-spa-application-node-server-through-github-continuous-integration?forum=windowsazurewebsitespreview.

Приложение Node.js в Azure должно иметь app.js или server.js в корне приложения.

Итак, вот обходной путь, если вы хотите, чтобы ваше угловое приложение в папке dist действовало в качестве внешнего интерфейса вашего веб-приложения, а приложение expressjs - в качестве внутреннего сервиса.

Вы также можете развернуть приложение Express JS в корневом каталоге и папку угловых приложений в том же корневом каталоге. Затем вы можете настроить угловое приложение в маршрутах exrepssjs. НАПРИМЕР

предположим, что ваш угловой вход в приложение index.html в dist папка в корневом каталоге:

app.get('/', function(req, res) {
    res.sendfile(__dirname+'/dist/index.html')

});

Который будет направлять "/" в ваше угловое приложение.

Источник

Чтобы решить вашу проблему, я рекомендую ознакомиться с курсом Шейна Бойера и Джона Папаса о множественном освещении. Они очень хорошо объясняют эту тему. play-by-play-angular-2-app-deploy.

Я сам начал там, но мне пришлось внести некоторые коррективы, чтобы он работал полностью.

Хитрость заключается в том, чтобы создавать ваши файлы локально и помещать файлы сборки в отдельную папку (dist).

Также вам нужно будет добавить:

  1. файл server.js. Gist to server.js (как вы упомянули)
  2. файл package.json. Суть в pacakge.json. Это говорит Azure, какую версию узла и npm использовать.
  3. добавить web.config. Gist to web.config

Если вы хотите, чтобы ваше приложение автоматически развертывалось при фиксации, вам нужно настроить Githook. Нажмите на ссылку для получения инструкций. Также, чтобы githook работал, вам понадобится объявить переменную APP-настроек в вашем веб-приложении Azure с именем "Project" со значением, равным вашей папке сборки (=dist в моем случае.).

У меня есть репозиторий ng2 с рабочим демо в Azure. Ng2a.Frontend. Вы можете найти папку dist там.

Источник
Другие вопросы по тегам