我使用 ExtJs 4.2.1、Django 1.5.2、DB Postgresql 9.1。
我的网站中有一个登录表单,在用户单击工具栏中的按钮后显示。在他/她插入凭据(用户名和密码)并单击“提交”按钮后,此信息将发送到服务器。
在服务器端调用 view.py 脚本,特别是一种登录方法 (def request_login(request)),其中完成了一些登录和用户身份验证检查。在这些控件之后,带有文本“成功”或“错误”的 httpResponse 被发送到客户端。不幸的是,客户端没有收到任何消息,而是 index.html 页面。我尝试用 json 更改交换消息的类型,但结果是一样的……没有错误/成功消息,而是返回 index.html 页面。
我看到了解释一般情况的 Django 文档:具有经典表单的客户端(index.html)->单击提交并使用 POST 方法发送消息->有一个 view.py 带有一些接收此信息的方法->服务器发送带有消息的响应。通常,如果登录错误,则在同一页面中进行重定向,如果登录成功,则在另一个页面中进行重定向。就我而言,我希望登录返回在同一页面(index.html)中。
登录表单代码:
var winLogin;
Ext.onReady(function(){
Ext.tip.QuickTipManager.init(); //init tooltip
//create a panel to login
var loginFormPanel = Ext.create('Ext.form.Panel', {
bodyPadding: 15,
defaults: { //applying default settings to all added items
anchor: '100%',
xtype: 'textfield',
vtype: 'alphanum',
allowBlank: false,
},
fieldDefaults: {
labelWidth: 80,
labelAlign: 'left',
msgTarget: 'side',
},
items: [{
name: 'username',
fieldLabel: 'User Name',
minLength: 3,
maxLength: 20,
},{
name: 'password',
fieldLabel: 'Password',
inputType: 'password',
minLength: 4,
maxLength: 16,
},
],
dockedItems: [
{
xtype: 'toolbar',
dock: 'bottom',
items: [
{ xtype: 'tbfill' },
{
xtype: 'button',
itemId: 'cancel',
text: 'Cancel',
listeners: {
click: function() {
this.up('form').getForm().reset(); //reset all textfiled
}
}
},
{
xtype: 'button',
itemId: 'submit',
formBind: true,
text: "Submit",
listeners: {
click: function() {
var formPanel = this.up('form');
var user = formPanel.down('textfield[name=username]').getValue();
var pass = formPanel.down('textfield[name=password]').getValue();
if (formPanel.getForm().isValid()) {
Ext.Ajax.request({
url: 'editor/request_login',// call method in the django's view
method: 'POST',
params: {
username: user,
password: pass,
},
success: function (response, opts) {
var text = response.responseText;
Ext.Msg.alert('Success', text);
},
failure: function (response, opts) {
var text = response.responseText;
Ext.Msg.alert('Failure', text);
},
});
}
}
}
}
]
}
]
});
//create window to contain panel
winLogin = Ext.create('Ext.window.Window', {
title: 'Login',
closeAction: 'hide',
height: 170,
width: 360,
layout: 'fit',
iconCls: 'imgToolBarButtonLogin',
resizable: false,
draggable: false,
modal: true,
items: [
loginFormPanel,
],
});
winLogin.center();
});
view.py(服务器):
# Create your views here.
from django.contrib.auth import authenticate, login
from django.http import HttpResponse
def request_login(request):
if request.method == 'POST':
requser = request.POST['username']
reqpass = request.POST['password']
user = authenticate(username=requser, password=reqpass)
if user is not None:
if user.is_active:
login(request, user)
# Return a success message
return HttpResponse("Success", content_type="text/plain")
else:
# Return a 'disabled account' error message
return HttpResponse("Error: this account is disabled!", content_type="text/plain")
else:
# Return an 'invalid login' error message.
return HttpResponse("Error: invalid login. Try again!", content_type="text/plain")
登录(用 JSON 修改):
...
{
xtype: 'button',
itemId: 'submit',
formBind: true,
text: "Submit",
listeners: {
click: function() {
var formPanel = this.up('form');
var user = formPanel.down('textfield[name=username]').getValue();
var pass = formPanel.down('textfield[name=password]').getValue();
if (formPanel.getForm().isValid()) {
Ext.Ajax.request({
url: 'editor/request_login',// call method in the django's view
method: 'POST',
params: {
username: user,
password: pass,
},
success: function (response, opts) {
var json = Ext.JSON.decode(response.responseText);
Ext.Msg.alert('Success', json['message']);
},
failure: function (response, opts) {
var json = Ext.JSON.decode(response.responseText);
Ext.Msg.alert('Failure', json['message']);
},
});
}
}
}
}
...
View.py(用 JSON 修改):
# Create your views here.
from django.contrib.auth import authenticate, login
from django.http import HttpResponse
import json
def request_login(request):
if request.method == 'POST':
requser = request.POST['username']
reqpass = request.POST['password']
user = authenticate(username=requser, password=reqpass)
response_data = {}
if user is not None:
if user.is_active:
login(request, user)
# Return a success message
response_data['result'] = 'success'
response_data['message'] = 'Has loged in'
response_data['fullname'] = user.get_full_name()
return HttpResponse(json.dumps(response_data), content_type="application/json")
else:
# Return a 'disabled account' error message
response_data['result'] = 'disabled'
response_data['message'] = 'this user is disabled'
return HttpResponse(json.dumps(response_data), content_type="application/json")
else:
# Return an 'invalid login' error message.
response_data['result'] = 'failed'
response_data['message'] = 'invalid login'
return HttpResponse(json.dumps(response_data), content_type="application/json")