Vue axios не отправляет заголовки на сервер (django simplejwt)

В postman он работает хорошо. Но у меня есть эта ошибка, когда я делаю запрос axios из Vue.

:

'Authentication credentials were not provided.'

Если я пишу какой-то пользовательский заголовок в postman, я могу увидеть его в request.headers. Но в нем нет информации о заголовках, если я строю заголовки в axios.

component.vue

test_auth: function(){

  var accessToken = this.$store.state.accessToken;
  console.log(accessToken);
  axios.get('http://django:8000/api/uvs/',{headers:{
    'Authorization':`Bearer ${accessToken}`,
    

  }} )
    .then(function (response) {
      console.log(response);
    })
    .catch(function (error) {
      console.log(error.response.data);
    });

},

и мои настройки сервера

CORS_ALLOWED_ORIGINS = [
    "http://django:8080",
    "http://django",
    "http://127.0.0.1",
    "http://vue:8080",
    "http://vue",
]
CORS_ALLOW_ALL_ORIGINS = True
CORS_ALLOW_CREDENTIALS = True



REST_FRAMEWORK = {

    'DEFAULT_PERMISSION_CLASSES': [
        'rest_framework.permissions.DjangoModelPermissionsOrAnonReadOnly'
    ],

    'DEFAULT_AUTHENTICATION_CLASSES': (
        'rest_framework_simplejwt.authentication.JWTAuthentication',

    )
}

SIMPLE_JWT = {
 

    'AUTH_HEADER_TYPES': ('Bearer',),
 
}

и views.py

class UserSerializer(serializers.Serializer):
    class Meta:
        model = User
        fields = ('id', 'username', 'email', 'is_staff')



class UserViewSet(viewsets.ModelViewSet):
    serializer_class = UserSerializer
    queryset = User.objects.all()
    permission_classes = [IsAuthenticated]

OK, проблема возникает из-за axios.get. Я не знаю почему, но это работает, когда я использую axios.create() и использую intercepter для добавления заголовков с Authorization Token для каждого запроса. Затем я вызываю axios_instance.get, и тогда я могу отправить свой токен через заголовки.

Вернуться на верх