ajax请求没有经过axios

Question

所以我使用axios来访问Cloudinary API并上传照片。然后我想能够做一个与我自己的API通信的AJAX请求，以存储我刚上传的照片的网址。这是我的代码：

$("#file-upload").change(function (event) {
        file = event.target.files[0];

$("#add-article").click(function () {
        formData.append('file', file);
        formData.append('upload_preset', CLOUDINARY_UPLOAD_PRESET);

        axios({
            url: CLOUDINARY_URL,
            method: 'POST',
            headers: {
                'Content-Type': 'application/x-www-form-urlencoded'
            },
            data: formData
        }).then(function (res) {
            console.log(res);
            fileSource = res.data.secure_url;

            $.ajax({
                url: 'https://127.0.0.1:5000/api/admin/add_news',
                contentType: 'application/json; charset=utf-8',
                data: JSON.stringify({
                    'title': newsTitle,
                    'imgSrc': fileSource
                }),
                method: 'POST',
                dataType: 'json',
                crossDomain: true,
                success: function (res) {
                    alert(res.message);
                    location.reload();
                },
                error: function () {
                    console.log('error')
                },
                complete: function (jqXHR) {
                    if (jqXHR.status == '401') {
                        console.log(jqXHR.status)
                    }
                }
            });
        }).catch(function (err) {
            console.log(err);
        });

    }); 

我把所有这些放在document.ready函数中。它会返回如下错误：

我读到jQuery和JavaScript兼容在一起，所以我在这里缺少什么？