首页 > 解决方案 > 通过他们的 API 将多张图片上传到 Imgur

问题描述

好吧,只是为了解决这个问题,PHP 不是一个选项,因为这个项目的代码必须可以通过浏览器通过 chrome 的页面源和检查器以及所有这些来访问。我正在尝试一次上传多张图片(通过 HTML 的 input=file),但遇到了一些麻烦。我得到了一个应该只处理一个文件的代码,它确实可以,但是当将它实现到 for 循环中时,它不能按预期工作,它只上传第一个图像,然后给出响应和只有这样。

var files = $("#upload").get(0).files;
for (var i = 0; i < files.length; i++) {
    if (files[i]) {
        var apiUrl = 'https://api.imgur.com/3/image';
        var apiKey = '<apiKey>';
        var settings = {
            async: false,
            crossDomain: true,
            processData: false,
            contentType: false,
            type: 'POST',
            url: apiUrl,
            headers: {
            Authorization: 'Client-ID ' + apiKey,
            Accept: 'application/json'
            },
            mimeType: 'multipart/form-data'
        };
        var formData = new FormData();
        formData.append("image", files[i]);
        settings.data = formData;

        var urlObj = URL.createObjectURL(files[i]);
        $("#sortable").html("");
        $("#sortable").append("<img src='" + urlObj + "' id='" + (i + 1) + "' class='unuploaded ui-state-default'>");

        // Response contains stringified JSON
        // Image URL available at response.data.link
        $.ajax(settings).done(function(response) {
            $("#" + (i+1)).src = response.data.link;
            $("#" + (i+1)).removeClass("unuploaded");
        });
    }
}

标签: javascriptjqueryhtmlimgur

解决方案


推荐阅读