带有Django CSRF的Extjs

问题描述

我正在尝试将Extjs的表单发布到Django（版本3.1）作为后端并在Django端显示“ CSRF令牌错误”“ POST / test / HTTP / 1.1” 403”

我的感觉是这样的：

我的Extjs应用程序在localhost：1841上运行（默认为extjs 开发）
我的Django应用程序在localhost：8000上运行（defualt Django runserver 命令...）

两者都在同一服务器上。

我确实读过这本书，因为我不是从Django而是从生成表单 django外部的ExtJS，我需要通过Django api ==> get_token（request）...获取CSRF ...

所以这是我的观点：

def csrf(request):
    return JsonResponse({'csrftoken': get_token(request)})

这里是调用此csrf函数的JS函数...

    function getCsrftoken () {
        Ext.Ajax.request ({
            url : 'http://127.0.0.1:8000/csrf/',success : function (response,opts) {
                obj = Ext.decode (response.responseText,true);
    
#save it for later user...
                Ext.util.Cookies.set('csrftoken',obj['csrftoken']);
                
            },})
    };

我确实对其进行了测试，并且通过生成CSRF令牌，它可以正常工作。

这是我从ExtJs一侧提交的表单动作（POST）...

onSubmitClick : function () {
    let form = Ext.getCmp ('formID');
    var csrf = Ext.util.Cookies.get ('csrftoken');
    if (form.isValid ()) 
        form.submit ({
            url : 'http://127.0.0.1:8000/test/',headers : {
                'X-CSrftoken': csrf,},success : function (form,action) {
                let data = Ext.decode (action.response.responseText)
                Ext.Msg.alert ('Success',data['success']);
            },});
    } else { // display error alert if the data is invalid
        Ext.Msg.alert ('Invalid Data','Please correct form errors.')
    }
}

如您所见，我确实从标头中的发送CSRF令牌...

headers : {
                    'X-CSrftoken': csrf,

之后，我确实收到了Django CSRF错误，如上所示。

这是我与Django相关的设置...

INSTALLED_APPS = [
    'django.contrib.admin','django.contrib.auth','django.contrib.contenttypes','django.contrib.sessions','django.contrib.messages','django.contrib.staticfiles','corsheaders',]

MIDDLEWARE = [
    'corsheaders.middleware.CorsMiddleware','django.middleware.security.SecurityMiddleware','django.contrib.sessions.middleware.SessionMiddleware','django.middleware.common.CommonMiddleware','django.middleware.csrf.CsrfViewMiddleware','django.contrib.auth.middleware.AuthenticationMiddleware','django.contrib.messages.middleware.MessageMiddleware','django.middleware.clickjacking.XFrameOptionsMiddleware',]

ROOT_URLconf = 'core.urls'

TEMPLATES = [
    {
        'BACKEND': 'django.template.backends.django.DjangoTemplates','Dirs': [
                    os.path.join(BASE_DIR,'templates'),],'APP_Dirs': True,'OPTIONS': {
            'context_processors': [
                'django.template.context_processors.debug','django.template.context_processors.request','django.contrib.auth.context_processors.auth','django.contrib.messages.context_processors.messages',]

Wsgi_APPLICATION = 'core.wsgi.application'

# Database
# https://docs.djangoproject.com/en/3.0/ref/settings/#databases

DATABASES = {
    'default': {
        'ENGINE': 'django.db.backends.sqlite3','NAME': os.path.join(BASE_DIR,'db.sqlite3'),}
}


# Password validation
# https://docs.djangoproject.com/en/3.0/ref/settings/#auth-password-validators

AUTH_PASSWORD_VALIDATORS = [
    {
        'NAME': 'django.contrib.auth.password_validation.UserAttributeSimilarityValidator',{
        'NAME': 'django.contrib.auth.password_validation.MinimumLengthValidator',{
        'NAME': 'django.contrib.auth.password_validation.CommonPasswordValidator',{
        'NAME': 'django.contrib.auth.password_validation.NumericPasswordValidator',]


# Internationalization
# https://docs.djangoproject.com/en/3.0/topics/i18n/

LANGUAGE_CODE = 'en-us'

TIME_ZONE = 'UTC'

USE_I18N = True

USE_L10N = True

USE_TZ = True


# Static files (CSS,JavaScript,Images)
# https://docs.djangoproject.com/en/3.0/howto/static-files/
STATIC_URL = '/static/'


# corsheaders
CORS_ORIGIN_ALLOW_ALL = True


#CSRF
CSRF_HEADER_NAME = 'X-CSrftoken'
CSRF_COOKIE_SECURE = False
#CSRF_USE_SESSIONS = True
CORS_ALLOW_CREDENTIALS = True
#CORS_ORIGIN_WHITELIST = ['127.0.0.1:8000']
CSRF_TRUSTED_ORIGINS = ['localhost:1841']

这是获取令牌的get请求的图像...

这是发布请求的图片日志...

有关此错误的任何帮助。

感谢您的答复！

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

ajax csrf csrf extjs

带有Django CSRF的Extjs

问题描述

解决方法

相关问答