반응형
장고에서 X 편집 가능한 인라인 편집 - CSRF 보호를 받는 방법은?
장고에 있는 모델의 X-Editable 인라인 편집을 하려고 합니다.모델 인스턴스의 속성(이 경우 데이터셋 개체의 이름)을 변경하려고 할 뿐입니다.
ajax 요청에서 정보를 정확하게 캡처하도록 보기를 작성하는 방법을 잘 모르겠습니다.
POST /datasets/9/update_name/
{
pk: 3 //primary key (record id)
value: 'The Updated Name' //new value
}
그런 다음 Dataset 개체에 새 이름을 저장합니다.
urls.py
# ex: /datasets/3/update_name
url(r'^(?P<pk>\d+)/update_name/$', update_name ,
name='update_name'),
세세한 부분
<h1 class="page-title center">
<a href="#" id="datasetName">{{ dataset.name }}</a>
</h1>
<script>
$('#datasetName').editable({
type: 'text',
pk: {{ dataset.pk }},
url: '{% url 'datasets:update_name' dataset.pk %}',
title: 'Edit dataset name'
params: { csrf: '{% csrf_token %}'} # // This isn't working
});
</script>
views.py
def update_name(request, dataset_id):
# ... Update Dataset object ...
json = simplejson.dumps(request.POST)
return HttpResponse(json, mimetype='application/json')
편집:
CSRF 보호가 없다는 것이 문제라고 생각합니다.이것을 X 편집 형태로 추가하려면 어떻게 해야 합니까?
** 편집 2:
문서에 따라 이것도 시도해 봤습니다.
<h1 class="page-title center">
<a href="#" id="datasetName">{{ dataset.name }}</a>
</h1>
<script>
// using jQuery
function getCookie(name) {
var cookieValue = null;
if (document.cookie && document.cookie != '') {
var cookies = document.cookie.split(';');
for (var i = 0; i < cookies.length; i++) {
var cookie = jQuery.trim(cookies[i]);
// Does this cookie string begin with the name we want?
if (cookie.substring(0, name.length + 1) == (name + '=')) {
cookieValue = decodeURIComponent(cookie.substring(name.length + 1));
break;
}
}
}
return cookieValue;
}
var csrftoken = getCookie('csrftoken');
function csrfSafeMethod(method) {
// these HTTP methods do not require CSRF protection
return (/^(GET|HEAD|OPTIONS|TRACE)$/.test(method));
}
$.ajaxSetup({
beforeSend: function(xhr, settings) {
function getCookie(name) {
var cookieValue = null;
if (document.cookie && document.cookie != '') {
var cookies = document.cookie.split(';');
for (var i = 0; i < cookies.length; i++) {
var cookie = jQuery.trim(cookies[i]);
// Does this cookie string begin with the name we want?
if (cookie.substring(0, name.length + 1) == (name + '=')) {
cookieValue = decodeURIComponent(cookie.substring(name.length + 1));
break;
}
}
}
return cookieValue;
}
if (!(/^http:.*/.test(settings.url) || /^https:.*/.test(settings.url))) {
// Only send the token to relative URLs i.e. locally.
xhr.setRequestHeader("X-CSRFToken", getCookie('csrftoken'));
}
}
});
$('#datasetName').editable({
type: 'text',
pk: {{ dataset.pk }},
url: '{% url 'datasets:update_name' dataset.pk %}',
title: 'Edit dataset name',
});
</script>
와, 이 문제에 너무 많은 시간을 소비했어요!
쇼트리스트 버전은 다음과 같습니다.
<a href="#" id="projectname{{project.id}}" data-type="text" data-pk="{{project.id}}" data-title="Enter project name" data-url="{% url 'updateproject' project.id %}" data-params="{csrfmiddlewaretoken:'{{csrf_token}}'}">{{ project.name }}</a>
그 다음에 전화해요.
$('#projectname{{project.id}}').editable();
crf 양식 필드의 올바른 이름은 다음과 같습니다.csrfmiddlewaretoken
.
저는 PHP Project에서 이것을 직면했고 ax Options 옵션을 사용하여 해결했습니다.메타 태그에서 CSRF 토큰을 선택하여 요청 헤더에 추가했습니다.
ajaxOptions: {
dataType: 'json',
beforeSend: function(xhr){
xhr.setRequestHeader('X-CSRF-Token', $('meta[name="csrf-token"]')
.attr('content'));
}
}
특히 레일을 사용하여 추가 작업을 하는 경우 올바른 것으로 생각합니다.
ajaxOptions: {
beforeSend: function(xhr) {xhr.setRequestHeader('X-CSRF-Token', $('meta[name="csrf-token"]').attr('content'))},
},
내부 편집 가능한 기능을 사용할 수 있습니다.
$('#projectname').editable({
showbuttons: 'bottom',
ajaxOptions: {
beforeSend: function(xhr) {xhr.setRequestHeader('X-CSRF-Token', $('meta[name="csrf-token"]').attr('content'))},
},
type: 'textarea',
url: '/url/url'
});
언급URL : https://stackoverflow.com/questions/13782351/x-editable-inline-editing-in-django-how-to-get-csrf-protection
반응형
'it-source' 카테고리의 다른 글
비밀번호 숨기기와 보기를 전환하는 방법 (0) | 2023.09.08 |
---|---|
Angular2 \ Typcript에서 문자열을 날짜로 변환하는 방법? (0) | 2023.09.08 |
자바스크립트에서 단어를 자르지 않고 문자열을 단축합니다. (0) | 2023.09.08 |
필요한 인수 전달(모듈 로드 시) (0) | 2023.09.08 |
Android 앱에서 Excel 파일 보기 (0) | 2023.09.08 |