Токен CSRF в Angular 4 CLI от Джанго

Question

Я создал полнофункциональное приложение с Angular, Node, Express и Postgres: https://github.com/shivkiyer/database-app

Теперь я пытаюсь изучить Django, повторяя проект с Django на бэкэнде вместо Node JS. Весь код здесь: https://github.com/shivkiyer/djangoangular

Я не могу извлечь токен CSRF, отправленный Django в Angular, чтобы я мог отправить его обратно при отправке формы POST.

В Django у меня есть два вида:

from django.shortcuts import render
from django.http import HttpResponse, JsonResponse
from . import models, forms

# Create your views here.

def basic_list(request):
    print(request)
    customer_list = []
    for customer_item in models.Customer.objects.all():
        customer_list.append({
            "first_name": customer_item.first_name,
            "last_name": customer_item.last_name,
            "city": customer_item.city
        })
    print(customer_list)
    return JsonResponse(customer_list, safe=False)

def empty_form(request):
    print(request)
    return HttpResponse("Form received")

В моем файле settings.py у меня включено «django.middleware.csrf.CsrfViewMiddleware». Я проверил документацию по Django: https://docs.djangoproject.com/en/2.0/ref/csrf/

Я попытался добавить несколько параметров в файл settings.py:

CSRF_USE_SESSIONS = True
CSRF_HEADER_NAME = 'HTTP_X_CSRFTOKEN'
CORS_ORIGIN_ALLOW_ALL = True
CORS_ALLOW_CREDENTIALS = True
CORS_ALLOW_HEADERS = (
    'content-type',
    'HTTP_X_CSRFTOKEN'
)

CORS_EXPOSE_HEADERS = [
    'content-type',
    'HTTP_X_CSRFTOKEN']

Мой угловой компонент имеет:

import { Component, OnInit } from '@angular/core';
import { Http, Response, Headers } from '@angular/http';
import { FormGroup, FormControl, Validators } from '@angular/forms';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent implements OnInit {
  title = 'app';
  sample_form: FormGroup;
  server_token: any;

  constructor(private http: Http) {
    this.sample_form = new FormGroup({
      'first_name': new FormControl(null),
      'last_name': new FormControl(null)
    });
  }

  ngOnInit() {}

  viewCustomers() {
    this.http.get('http://127.0.0.1:8000/list/')
        .subscribe((response: Response) => {
          console.log(response.headers.keys());
          this.server_token = response.headers.get('http_x_csrftoken');
          console.log(response.headers.get('http_x_csrftoken'));
          console.log(response.json());
        });
  }

  send_sample_form() {
    let my_headers = new Headers({'x-csrftoken': this.server_token});
    this.http.post('http://127.0.0.1:8000/emptyform/',
          {'my_form': this.sample_form.value},
          {headers: this.server_token})
          .subscribe(
            (response) => {
              console.log(response.headers.keys());
              console.log(response);
            }
          );
  }

}

Я не могу извлечь токен CSRF из заголовка. Команда: console.log (response.headers.keys ());

Отображает только тип содержимого заголовка. Как мне получить этот токен и отправить его обратно в Django в POST-запросе. Когда я отключаю «django.middleware.csrf.CsrfViewMiddleware» в settings.py, это работает. Таким образом, нет другой межсайтовой проблемы.

Заранее спасибо.