권한 제어에 따른 "POST ... 403 45" 에러 해결

1. 문제

 - 지난번 로그인 기능 제작 및 권한 기능 생성 후 권한 제어를 해둔 페이지 내의 POST 관련 기능 실행 시 에러가 발생하는 상황이 발생함에 따라 이를 해결해야할 소요가 생김.

2. 변경 전 코드

 - statistics.js

# 변경 전
postPerfomanceQuantityList: function () {
    $("#quantity_result").LoadingOverlay("show");
    const url_ = `/api_data/data_performance/quantityList/`
    const body = {
        "quantity_value_texture_st": this.performance_value_texture_st,
        "start_date": this.performance_date_start,
        "end_date": this.performance_date_end,
    }
    axios
        .post(url_, body)
        .then((response) => {
            this.quantity_values_str = [];
            this.quantity_values = response.data['list'];
            graph_update("기간", "매출액", this.quantity_values, 'quantity_chart');
            for(var key in this.quantity_values){
                temp_dic = {}
                temp_dic["기간"] = this.quantity_values[key]["기간"];
                temp_dic["절단"] = this.quantity_values[key]["절단"].toString().replace(/\B(?<!\.\d*)(?=(\d{3})+(?!\d))/g, ",");
                temp_dic["평면"] = this.quantity_values[key]["평면"].toString().replace(/\B(?<!\.\d*)(?=(\d{3})+(?!\d))/g, ",");
                temp_dic["측면"] = this.quantity_values[key]["측면"].toString().replace(/\B(?<!\.\d*)(?=(\d{3})+(?!\d))/g, ",");
                temp_dic["판매수량"] = this.quantity_values[key]["판매수량"].toString().replace(/\B(?<!\.\d*)(?=(\d{3})+(?!\d))/g, ",");
                temp_dic["매출액"] = this.quantity_values[key]["매출액"].toString().replace(/\B(?<!\.\d*)(?=(\d{3})+(?!\d))/g, ",");
                this.quantity_values_str.push(temp_dic);
            };

        })
        .catch(function (e) {
            alert('err case', e)
        })
        .finally(function () {
            $("#quantity_result").LoadingOverlay("hide");
        });
},

3. 변경 후 코드

 - statistics.js

postPerfomanceQuantityList: function () {
    axios.defaults.xsrfCookieName = 'csrftoken';
    axios.defaults.xsrfHeaderName = 'X-CSRFTOKEN';
    $("#quantity_result").LoadingOverlay("show");
    const url_ = `/api_data/data_performance/quantityList/`
    const body = {
        "quantity_value_texture_st": this.performance_value_texture_st,
        "start_date": this.performance_date_start,
        "end_date": this.performance_date_end,
    }
    axios
        .post(url_, body)
        .then((response) => {
            this.quantity_values_str = [];
            this.quantity_values = response.data['list'];
            graph_update("기간", "매출액", this.quantity_values, 'quantity_chart');
            for(var key in this.quantity_values){
                temp_dic = {}
                temp_dic["기간"] = this.quantity_values[key]["기간"];
                temp_dic["절단"] = this.quantity_values[key]["절단"].toString().replace(/\B(?<!\.\d*)(?=(\d{3})+(?!\d))/g, ",");
                temp_dic["평면"] = this.quantity_values[key]["평면"].toString().replace(/\B(?<!\.\d*)(?=(\d{3})+(?!\d))/g, ",");
                temp_dic["측면"] = this.quantity_values[key]["측면"].toString().replace(/\B(?<!\.\d*)(?=(\d{3})+(?!\d))/g, ",");
                temp_dic["판매수량"] = this.quantity_values[key]["판매수량"].toString().replace(/\B(?<!\.\d*)(?=(\d{3})+(?!\d))/g, ",");
                temp_dic["매출액"] = this.quantity_values[key]["매출액"].toString().replace(/\B(?<!\.\d*)(?=(\d{3})+(?!\d))/g, ",");
                this.quantity_values_str.push(temp_dic);
            };

        })
        .catch(function (e) {
            alert('err case', e)
        })
        .finally(function () {
            $("#quantity_result").LoadingOverlay("hide");
        });
},