javascript - Django 和 React:错误消息“您需要启用 JavaScript 才能运行此应用程序。”而不是 Json
问题描述
我是 React 的新手,我尝试让 Django Rest 和 react 一起工作。
顺便说一句,我的 javascript 已启用。
我有一个简单的看法:
class StudentView(generics.ListCreateAPIView):
queryset = Student.objects.all()
serializer_class = StudentSerializer
我尝试从反应中获取它:
useEffect(() =>{
fetch("http://127.0.0.1:8000/secretariat/get_student/", {
method: 'GET',
headers: {
'Content-Type': 'application/json',
}
})
.then( resp => resp.json())
.then( resp => setStudents(resp))
.catch(error => console.log(error))
}, [])
当我在浏览器网络中检查时,这就是我所拥有的响应:
我不认为我有 CORS 标头问题,但这里是我的 CORS 设置。
INSTALLED_APPS = [
'django.contrib.admin',
'django.contrib.auth',
'django.contrib.contenttypes',
'django.contrib.sessions',
'django.contrib.messages',
'django.contrib.staticfiles',
'django.contrib.sites',
'corsheaders',
'common_app',
'rest_framework',
'rest_framework.authtoken',
'allauth.account',
'rest_auth.registration',
'ldap',
'rest_auth',
'simple_history',
]
MIDDLEWARE = [
'django.middleware.security.SecurityMiddleware',
'django.contrib.sessions.middleware.SessionMiddleware',
'corsheaders.middleware.CorsMiddleware',
'django.middleware.common.CommonMiddleware',
'django.middleware.csrf.CsrfViewMiddleware',
'django.contrib.auth.middleware.AuthenticationMiddleware',
'django.contrib.messages.middleware.MessageMiddleware',
'django.middleware.clickjacking.XFrameOptionsMiddleware',
'simple_history.middleware.HistoryRequestMiddleware',
]
CORS_ORIGIN_ALLOW_ALL = False
CORS_ORIGIN_WHITELIST = (
'http://127.0.0.1'
)
CORS_ALLOW_METHODS = (
'DELETE',
'GET',
'OPTIONS',
'PATCH',
'POST',
'PUT',
)
CORS_ALLOW_HEADERS = (
'accept',
'accept-encoding',
'authorization',
'content-type',
'dnt',
'origin',
'user-agent',
'x-csrftoken',
'x-requested-with',
)
我认为我做错了什么,但我不知道。
谢谢
解决方案
好吧,我真的不知道为什么,但我让它与 Axios 一起工作,根本没有改变我的 CORS 设置。如果有人知道为什么它使用 axios 而不是 fetch,我想知道。
因此,如果它发生在其他人身上,则使用 axios 做出反应的工作代码:
axios.get("http://127.0.0.1:8000/secretariat/get_student/")
.then(response => {
console.log(response)
})
.catch(error => {
console.log(error);
})
推荐阅读
- c - 如果存在 VLA,为什么仍然需要 malloc?
- javascript - uglify 错误:找不到模块“乐观主义者”
- string - 如何拆分分隔字符串以在 bash 中组成 dd 命令?
- flutter - Flutter:TextFormField - 将输入类型设置为时间而不是日期时间
- apache-spark - Spark MySQL JDBC挂起没有错误
- php - paygate payweb3 在 php 网站中的集成
- node.js - 验证 Adonis Websocket 连接
- python - 从 Python 列表中获取属性
- vue.js - v-data-table 中的 v-edit-dialog 在关闭时恢复原始值
- c - 接收到带有 sigaction 的信号时重启进程