将对象数组中的数据发送到服务器

Question

我正在开发一个应用程序，当我没有互联网连接时，它必须发送到 localStogare，稍后我可以在它在线时将数据发送到服务器，我将手动执行此操作。

一旦我使用 JS 从 localStorage 获取数据，将其存储在变量中

let encuestas = [];

if ( localStorage.getItem('encuestas') ) {
    encuestas = JSON.parse(localStorage.getItem('encuestas'))
}

之后，我有一个这样的数组：

encuestas = [
{
        "code": "2124",
        "sells": 2124,
        "latitude": "14.8550091",
        "longitude": "-90.0685453",
        "visit_date": "2019-04-02",
        "visit_time": "21:23:54",
        "user": 1,
        "answers": [
            {
                "question": 4,
                "answer": "Si"
            },
            {
                "question": 1,
                "answer": "No"
            }
        ]
    },
    {
        "code": "2140",
        "sells": 2140,
        "latitude": "14.8550156",
        "longitude": "-90.0685451",
        "visit_date": "2019-04-02",
        "visit_time": "21:40:13",
        "user": 2,
        "answers": [
            {
                "question": 4,
                "answer": "No"
            },
            {
                "question": 1,
                "answer": "No"
            }
        ]
    },
    {
        "code": "2146",
        "sells": 2146,
        "latitude": "14.855016",
        "longitude": "-90.0685448",
        "visit_date": "2019-04-02",
        "visit_time": "21:46:17",
        "user": 2,
        "answers": [
            {
                "question": 4,
                "answer": "No"
            },
            {
                "question": 1,
                "answer": "No"
            }
        ]
    }
]

现在我需要通过循环将数据发送到服务器，我已经完成了这个功能但我无法发送数据，我没有收到任何错误消息

这个必须接收我需要发送的数据索引

const sendDataToServer = encuesta => {
    axios({
        method: 'post',
        headers: {
            'Authorization': `Token ${sessionStorage.getItem("token")}`
        },
        url: `${baseURL}customers/`,
        contentType: 'application/json',
        data: encuesta
    })
    .then(res => {
        encuestas.shift()
    })
    .catch(e => {
        console.log(e)
    })
}

这必须将每一个发送到服务器，然后 delEcuestas 必须将数组设置为空数组

const enviarDatos = () => {
    for ( const i in encuestas ) {
        sendDataToServer(encuestas[i])
    }

    delEncuestas();
}

希望你能帮帮我，谢谢！！

Answer 1

我没有立即明白为什么在执行此代码时没有发出请求。也就是说，我们可能可以使用一些更易读、更惯用的代码来实现这一点。

使用shift() 修改数组，这是循环条件的一部分，通常不鼓励在循环结构内（如果不是实际的错误）。所以无论如何都值得重构这段代码。

现在，假设您的后端可以按任何顺序处理请求，那么使用axios.all() 函数使请求异步可能是可取的。

类似这样的：

const enviarDatos = () => {
    let axiosPromises = enquestas.map(enquesta => {
            return axios({
                method: 'post',
                headers: {
                    'Authorization': `Token ${sessionStorage.getItem("token")}`
                },
                url: `${baseURL}customers/`,
                contentType: 'application/json',
                data: encuesta
            });
        });

    axios.all(axiosPromises).then(results => {
            // All promises are resolved/rejected
            // E.g. results = [promiseResolution1, promiseResolution2, etc.]
            delEncuestas();
        }
    ).error((err) => {});
}