我在带有 Typscript 前端的 Django rest 框架中使用 JWT 实现令牌身份验证时遇到问题。我越来越
{详细信息:“未提供身份验证凭据。”}
我通过 Typescript 调用 API,即:
readonly BASE_URL = 'http://127.0.0.1:8000/'
api_url = this.BASE_URL + 'items/'
auth_url = this.BASE_URL + "api-token-auth/"
getItemsService(token) {
const headers = new HttpHeaders()
headers.append('Content-Type', 'application/json')
headers.append('Authorization', 'JWT ' + token.token)
return this.http.get(this.api_url, {headers: headers})
}
登录工作正常。当我尝试加载有问题的项目时。
这是我的 Django 代码:
视图.py
from rest_framework import generics
from .models import Item
from .serializers import ItemSerializer
class ItemList(generics.ListCreateAPIView):
queryset = Item.objects.all()
serializer_class = ItemSerializer
class ItemDetail(generics.RetrieveUpdateDestroyAPIView):
queryset = Item.objects.all()
serializer_class = ItemSerializer
项目/ urls.py
from django.urls import path
from .views import ItemList, ItemDetail
urlpatterns = [
path('', ItemList.as_view()),
path('<int:pk>/', ItemDetail.as_view()),
]
项目/urls.py
from django.contrib import admin
from django.urls import include, path
from rest_framework_jwt.views import obtain_jwt_token
urlpatterns = [
path('items/', include('groceries.urls')),
path('admin/', admin.site.urls),
path('api-auth/', include('rest_framework.urls')),
path('api-token-auth/', obtain_jwt_token),
]
设置.py
REST_FRAMEWORK = {
'DEFAULT_PERMISSION_CLASSES': (
'rest_framework.permissions.IsAuthenticated',
),
'DEFAULT_AUTHENTICATION_CLASSES': (
'rest_framework_jwt.authentication.JSONWebTokenAuthentication',
),
}
我认为问题必须出在 Django 上,但我能够得到我所期望的
curl -H "Authorization: JWT <token>" http://localhost:8000/items/
如果我的后端设置不正确,这将不起作用。所以它一定是我的前端代码。
根据您的描述,这可能是 CORS 问题。因为您可以通过curl
命令访问您的 api 端点。但不是浏览器。
跨源资源共享 (CORS) 是一种机制,它使用额外的 HTTP 标头告诉浏览器让在一个源(域)运行的 Web 应用程序有权访问来自不同源的服务器的选定资源。当 Web 应用程序请求与自己的来源具有不同来源(域、协议和端口)的资源时,它会发出跨源 HTTP 请求。
我检查了你的 Angular 打字稿代码,看起来不错。我建议在你的 django 项目中遵循以下说明,看看它是如何进行的:
1)通过pip install django-cors-headers
命令为pip安装它。
2) 在 settings.py 文件中,将此应用添加到您已安装的应用中:
INSTALLED_APPS = (
...
'corsheaders',
...
)
3) 您还需要添加一个中间件类来监听响应:
MIDDLEWARE = [ # Or MIDDLEWARE_CLASSES on Django < 1.10
...
'corsheaders.middleware.CorsMiddleware',
'django.middleware.common.CommonMiddleware',
...
]
记住 CorsMiddleware 应该放在尽可能高的位置。
4) 将此行添加到 settings.py 文件中。
CORS_ORIGIN_ALLOW_ALL = True
有关完整文档,请参阅django-cors-headers。
本文收集自互联网,转载请注明来源。
如有侵权,请联系 [email protected] 删除。
我来说两句