Как подключить Vue к DRF?

Question

[Виктор Юрченко]

Использую проект https://github.com/gothinkster/realworld
я настроил DRF на сервере, можно перейти по ссылке посмотреть 165.227.155.223
Отдельно настроил Vue, при работе со стандартным API проекта он работает, а с моим API пока нет. Как сделать так чтобы он работал с моим API?
В этом проекте на гитхабе поставляются совместимые между собой API и Frontend, только что ещё нужно сделать?
во Vue в файле конфига я прописал путь к своему бекенду

Comments

[Сергей Горностаев]

Что именно значит "пока нет"?

[Виктор Юрченко]

Это значит что ещё не работает, но после исправлений должен будет работать.

[Виктор Юрченко]

Гениальный совет, если скажете где и что исправлю, чтобы заработало

[Андрей Шубин]

Я в ступоре, и даже не знаю как объяснить человеку, который УЖЕ играется с джанго и вуе, но не знает как сделать сраный запрос вместо одного сервера к другому. Тут какой-то порядок знаний странный вышел.

Поищите в проекте на Vue конфиги, а в них переменные типа URL или BASE_URL - это и должен быть путь до сервера. Обычно так.

Поделать руками curl или Postman запросы к бэкенду - убедиться, что он работает.
Посмотреть в отладчике браузера куда с фронта запросы ломятся - убедиться, что к вашему бэкенду.

[Виктор Юрченко]

Андрей Шубин, Я в основном занимался до этого бэкендом, в джанго имеются встроенные шаблоны, мне их хватало. Спасибо за подсказу про отладчик браузера я совсем забыл что там отображаются ошибки. Бэкенд работает. Я посмотрел ошибка в модуле авторизации, она работает с использованием с jwt token, только он у меня не указан, не знаю что туда нужно записать.
Мне не совсем ясно как работает Vue и Django когда они оба работают по одному адресу, если это два сервера которые работают одновременно, то Vue должен первым принимать запрос пользователя или как?

[Андрей Шубин]

Виктор Юрченко, Vue это клиент, он общается с бэкендом. Если речь о чистом Vue без SSR, то его должно что-то отдать клиенту, какой-то веб-сервер типа nginx, apache2 или даже с django его отдать (но так лучше не делать). Затем, когда приложение Vue отрендерилось в браузере оно общается с сервером, все.

Обычно схема сервера выглядит так:
Стоит nginx, слушает все запросы на домен site.com.
Если приходит запрос на site.com, то отдаем статику в виде html и js, которые содержат Vue приложение.
Если приходит запрос вида api.site.com, либо site.com/api (тут кому как удобнее), то nginx пересылает запросы в django.

[Виктор Юрченко]

Понятно, спасибо за объяснение!

[Модератор]

Вопросы с просьбами помочь с отладкой («почему этот код не работает?») должны включать желаемое поведение, конкретную проблему или ошибку и минимальный код для её воспроизведения прямо в вопросе. Вопросы без явного описания проблемы бесполезны для остальных посетителей.