Настройка django социальной аутентификации с vuejs внешним интерфейсом - PullRequest
0 голосов
/ 02 мая 2020

Я только начал проект с разработчиком внешнего интерфейса. Мы пытаемся добавить социальную аутентификацию (Discord), но безуспешно.

Я хочу использовать django в качестве REST API для бэкэнда, я установил django-allauth, который, кажется, работает, когда я использую django шаблон для подключения с использованием Discord:

{% load socialaccount %}
{% providers_media_js %}
<html>
    <head>
        <title>Discord Registration</title>
    </head>
    <body>
{{user}}
<a href="{% provider_login_url "discord" method="oauth2" %}">Discord Connect</a>
</html>

Но я понятия не имею, как поделиться этим подключением с внешним интерфейсом (сделано с vuejs). Я никогда не работал над проектом, в котором backend и frontend не находятся в одном приложении ... Что делать на frontend и что делать на backend? И главный вопрос, как? Я работал над этим в течение двух дней, и я все еще полностью потерян.

1 Ответ

0 голосов
/ 03 мая 2020

Вы можете выполнить эту работу двумя способами, в зависимости от того, как вы планируете развертывание в рабочей среде.

Метод 1:
Разработчик веб-интерфейса может запустить команду npm run build, которая создаст папку с именем dist. Вы должны обслуживать эту папку из приложения django. Выполните следующие действия в своем Django приложении:

В settings.py файле добавьте VUE_FOLDER = 'PATH_TO_DIST_FOLDER/dist'

TEMPLATES = [
{
    'BACKEND': 'django.template.backends.django.DjangoTemplates',
    'DIRS': [os.path.join(BASE_DIR, VUE_FOLDER)],
}



В файле urls.py добавьте path('', TemplateView.as_view(template_name='index.html'), name="home"

В приведенной выше строке файл Vue index. html будет отображаться как django домашняя страница.

Таким образом, ваше производство будет иметь только один порт, который будет обслуживать только одно приложение с пользовательским интерфейсом и приложением django. Все API, которые присутствуют в urls.py файле, могут быть доступны через пользовательский интерфейс. Не нужно беспокоиться о CORS.

Метод 2:
Пользовательский интерфейс может быть отдельным приложением, размещенным на одном порту, а ваше приложение django может быть отдельным приложением, размещенным на другом порту. , В этом случае ваше django приложение должно поддерживать CORS, поскольку все вызовы API из пользовательского интерфейса будут рассматриваться как вызовы из разных источников. Пользовательский интерфейс должен включать полный URL-путь http://django-server:port/api_name/ для доступа к API.

В обоих случаях вам не нужно использовать шаблон django, и пользовательский интерфейс может быть независимым приложением. О маршрутизации будет заботиться vue -рутер. Django приложение будет действовать как сервер и будет обрабатывать только API. Надеюсь, это поможет.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...