【发布时间】:2016-11-27 12:06:00
【问题描述】:
我将只使用 Django 作为后端。前端将使用 React 完成,没有 django 模板。我正在使用django-rest-framework 为我的网站创建一个rest api。
我为用户做了一个序列化器。
class CustomUserSerializer(serializers.ModelSerializer):
class Meta:
model = CustomUser
fields = (
'id', 'email', 'password', 'username', 'first_name', 'last_name', 'date_of_birth', 'gender', 'mobile_number'
)
extra_kwargs = {
'password': {'write_only': True},
'id': {'read_only': True}
}
def create(self, validated_data):
user = CustomUser.objects.create(
email=validated_data['email'],
username=validated_data['email'],
first_name=validated_data['first_name'],
last_name=validated_data['last_name'],
date_of_birth=validated_data['date_of_birth'],
gender=validated_data['gender'],
mobile_number=validated_data['mobile_number']
)
user.set_password(validated_data['password'])
user.save()
return user
class CustomUserViewSet(viewsets.ModelViewSet):
queryset = CustomUser.objects.all()
serializer_class = CustomUserSerializer
在浏览器中,当我转到 /custom/users/ 时,我可以查看用户。我还可以创建新用户,成功注册后返回用户。如果我使用 httpie/curl 也可以。
(djangoweb) vagrant@precise32:~$ http --json POST http://55.55.55.5/custom/users/ email="ter23minal2@gmail.com" password="terminal2123" username="t223erm" first_name="te2er" last_name="mi2nal" date_of_birth=1992-12-12 gender=2 mobile_number=66222666666336
它创建并返回新的用户对象。
所以我制作了一个表格来注册一个我没有从 django 服务器提供服务的用户:
<form action="http://55.55.55.5/custom/users/" method="post" id="register-form">
<input type="text" placeholder="email" name="email"/>
...
...
<button id="post">Register</button>
</form>
和 ajax 发布表单。
// using the javscript Cookies library
var csrftoken = Cookies.get('csrftoken');
function csrfSafeMethod(method) {
return (/^(GET|HEAD|OPTIONS|TRACE)$/.test(method));
}
$.ajaxSetup({
beforeSend: function(xhr, settings) {
if (!csrfSafeMethod(settings.type) && !this.crossDomain) {
xhr.setRequestHeader("X-CSRFToken", csrftoken);
}
}
});
$('#post').click(function(event) {
event.preventDefault();
var $form = $('#register-form');
var data = $form.serialize();
$.ajax({
type: "POST",
url: "http://55.55.55.5/custom/users/",
data: JSON.stringify(data),
sucess: function() { console.log("Success!"); },
contentType: "application/json; charset=utf-8",
dataType: "json",
crossDomain:false,
beforeSend: function(xhr, settings) {
xhr.setRequestHeader("X-CSRFToken", csrftoken);
}
});
});
现在如果我点击按钮,问题就开始了:
- 即使我给了
event.preventDefault(),页面也会自动加载到django服务器的url(即http://55.55.55.5/custom/users/)。 - 我收到一个错误:“详细信息”:“CSRF 失败:CSRF 令牌丢失或不正确。”
如何使用 django-rest-framework 处理到 django 服务器的帖子?我没有找到解决这个问题的任何帮助材料。你能指导我怎么做吗?谢谢。
【问题讨论】:
-
你能澄清谁在为前端页面提供服务吗?是服务器直接渲染的静态 HTML/JS,还是 Django 渲染的?假设它是一个静态文件,那么我不确定使用 CSRF 是否有意义,因为您可能应该使用令牌或类似的安全性。
-
@dkarchmer 是的,它是由 nodejs 渲染的静态 HTML/JS。如果我还不是用户,如何使用令牌?我认为如果用户进行身份验证,就会给出令牌。你能指导我吗?谢谢。
标签: jquery ajax django django-rest-framework django-csrf