Недопустимый токен CSRF. Django + AngularJS

Question

Я получаю токен CSRF или неверную ошибку при выполнении запроса POST на удаленном django api с моей машины localhost.

Мои настройки на AngularJS:

.config(['$httpProvider', function($httpProvider){ 

$httpProvider.defaults.xsrfCookieName = 'csrftoken'; 
$httpProvider.defaults.xsrfHeaderName = 'X-CSRFToken'; 

}]); 

, но им по-прежнему получать CSRF маркер отсутствует или неправильный ошибку.

Я проверяю, какие заголовки отправляются и, по-видимому, угловые не отправляют HTTP_X_CSRFTOKEN.

Но я вижу, что cookie csrftoken = что-то отправлено.

Кто-нибудь знает, что происходит?

заголовка запроса

POST /s/login/ HTTP/1.1 
Host: server.somewhere.io:8000 
Connection: keep-alive 
Content-Length: 290 
Pragma: no-cache 
Cache-Control: no-cache 
Accept: application/json, text/plain, */* 
Origin: http://localhost 
User-Agent: Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/48.0.2564.116 Safari/537.36 
Content-Type: application/json;charset=UTF-8 
Referer: http://localhost/thesocialmarkt/ 
Accept-Encoding: gzip, deflate 
Accept-Language: en-GB,en;q=0.8,en-US;q=0.6,pt-BR;q=0.4,pt;q=0.2 
Cookie: csrftoken=hiYq1bCNux1mTeQuI4eNgi97qir8pivi; sessionid=1nn1phjab5yd71yfu5k8ghdch2ho6exc 

Answer 1

Как указал Hawkes @ Крис на это StackOverflow ответ, данный @Ye Лю

Поскольку угловое приложение не обслуживается Джанго, чтобы дать установленный cookie , угловое приложение должно выполнить запрос GET на django .

Я проверял, что до тех пор, пока вы не сделаете запрос http, csrftoken cookie не будет установлен. Таким образом, только

$httpProvider.defaults.xsrfCookieName = 'csrftoken'; 
$httpProvider.defaults.xsrfHeaderName = 'X-CSRFToken'; 

не работает. Сначала вам нужно сделать, если не реальный, а затем прокомментировать http-запрос django rest_framework.

Update: Ваши комментарии подтолкнули меня к дальнейшему изучению его, пожалуйста прочитайте эту blog, где уже упоминаются, как,

КЛИЕНТ-SIDE СГЕНЕРИРОВАННОЙ CSRF-токены. Попросите клиентов сгенерировать и отправить то же уникальное секретное значение как в Cookie, так и в пользовательский HTTP-заголовок . Учитывая сайт разрешено только для чтения/записи Cookie для своего домена, только реальный сайт может отправить такое же значение в обоих заголовках

Так давайте попробуем с этим один запрос в первую очередь.

$http.defaults.headers.post['X-CSRFToken'] = $cookies.csrftoken; 

где вы инъекционные $cookies к контроллеру/услуге.

Если это сработает, возможно, написание interceptors будет хорошим выбором, а также поможет вам отлаживать.

Уверен, что вы используете версию AngularJs как минимум 1.2, см это changeset и в последние фиксации Угловая службы HTTP проверка CSRF с этим кодом,

var xsrfValue = urlIsSameOrigin(config.url) 
      ? $$cookieReader()[config.xsrfCookieName || defaults.xsrfCookieName] 
      : undefined; 
     if (xsrfValue) { 
      reqHeaders[(config.xsrfHeaderName || defaults.xsrfHeaderName)] = xsrfValue; 
     } 

Так что это необходимо, чтобы вы отправляете же маркер, который присутствует в печенье.

Чтобы проанализировать использование инструмента разработчика в вашем браузере, чтобы увидеть запрос/ответ с помощью http-запроса и проанализировать заголовки и файлы cookie.

Answer 2

если вы используете $ HTTP в AngularJS для запроса Ajax и если вы столкнулись с какой-либо маркер вопрос CSRF затем использовать это:

$http.defaults.xsrfCookieName = 'csrftoken'; 
$http.defaults.xsrfHeaderName = 'X-CSRFToken';