Запросы на Vuejs возвращают другой ответ, чем Postman с бэкенда django-rest-framework
Я пытаюсь реализовать поток кода авторизации пользователя Twitch. Я работаю над тем, чтобы получить авторизационный url, сгенерированный из бэкенда django, и передать его моему фронт-энду Vue, чтобы пользователь мог открыть страницу авторизации пользователя.
Postman прекрасно восстанавливает сгенерированный url, однако когда я пытаюсь сделать то же самое в Vue с помощью Requests, он выдает мне совершенно другой объект.
Object { _events: {…}, _eventsCount: 1, _maxListeners: undefined, uri: {…}, method: "POST", readable: true, writable: true, explicitMethod: true, _qs: {…}, _auth: {…}, … }
auth.js:37:12
и вот что возвращает Postman
"{'url': 'https://id.twitch.tv/oauth2/authorize', 'client_id': 'xxx', 'redirect_uri': 'http://localhost:8000/api/twitch/callback', 'grant_type': 'token', 'scope': 'user_read'}"
Я не уверен, что может быть причиной этого. Ниже приведен код, использованный для достижения этой точки.
urls.py
from django.conf.urls import url
from django.urls import include, path
from better_auth import views
urlpatterns = [
url(r'^api/token$', views.get_twitch_token),
url(r'^api/auth/login$', views.get_twitch_user_token_uri),
url(r'^api/auth/twitch/callback$', views.save_twitch_user_token),
]
views.py
import json
import os
import requests
from django.http.response import JsonResponse
from rest_framework.decorators import api_view
from rest_framework import status
# get user access token
@api_view(['POST'])
def get_twitch_user_token_uri(request):
endpoint = "https://id.twitch.tv/oauth2/authorize"
token_url = {
'url': endpoint,
'client_id': settings['TWITCH_CLIENT_ID'],
'redirect_uri': settings['TWITCH_REDIRECT_URI'],
'grant_type': 'token',
'scope': 'user_read'
}
Json = json.dumps(token_url)
Json = Json.replace('"', "'")
return JsonResponse(Json, status=status.HTTP_200_OK, safe=False)
Login.vue
methods: {
login() {
this.$store
.dispatch("auth/get_twitch_token")
.then(() => this.$router.push("/"));
}
}
auth.js
const actions = {
get_twitch_token({ commit }) {
commit(GET_TWITCH_TOKEN_URI);
console.log(this.endpoint);
return auth.twitch_token(this.endpoint)
.then(({ data }) => commit(GET_TWITCH_TOKEN, data))
.then(() => commit(GET_TWITCH_TOKEN_SUCCESS))
.catch(() => commit(GET_TWITCH_TOKEN_FAILURE));
},
}
const mutations = {
[GET_TWITCH_TOKEN_URI](state) {
const url = "http://localhost:8000/api/auth/login";
state.authenticating = true;
const r = request.post(url);
this.endpoint = r;
},
}
Выше показано, где возникает ошибка при запросе url из моего бэкенда django. Я уверен, что я что-то упускаю из виду, я просто не знаю, почему он возвращает неправильный ответ.
Любая помощь будет принята с благодарностью! Спасибо.
связано с тем, как я вызывал запрос и передавал данные от действий к мутациям.
Login.vue
methods: {
login() {
this.$store.dispatch("auth/get_twitch_user_token_uri");
// .then(() => this.$router.push("/"));
}
}
auth.js
const actions = {
async get_twitch_user_token_uri({ commit }) {
commit(GET_TWITCH_TOKEN_URI);
const options = {
method: 'POST',
header: { 'Content-Type': 'application/json' },
};
try {
const response = await fetch("http://localhost:8000/api/auth/login", options);
const data = await response.json();
console.log(data);
commit(SET_TWITCH_TOKEN_URI, data);
return commit(GET_TWITCH_TOKEN_URI_SUCCESS);
} catch (e) {
return commit(GET_TWITCH_TOKEN_URI_FAILURE);
}
},
}
const mutations = {
[GET_TWITCH_TOKEN_URI](state) {
state.authenticating = true;
},
[SET_TWITCH_TOKEN_URI](state, data) {
state.endpoint = data;
},
}