如何在jQuery中使用Imgur API v3匿名上传而不泄露客户端ID?

时间:2014-08-13 17:26:00

标签: jquery ajax imgur

我想制作一个允许人们上传图片的网页,但我认为我的服务器无法接受。所以我想将图像上传到Imgur。我已经有了一些代码来执行此操作:

<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>Imgur Upload Test</title>
        <style>
            #image_preview, #image_preview_2 {
                max-width: 200px;
            }
        </style>
    </head>
    <body>
        <h1>Imgur Upload Test</h1>
        <input type="file" id="image_selector" />
        <h2>Image Preview:</h2>
        <img src="none" id="image_preview" />
        <h2>Image On Imgur:</h2>
        <img src="none" id="image_preview_2" />
        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
        <script>
            $("#image_selector").change(function() {
                var reader = new FileReader();
                reader.onload = function(e) {
                    var data = e.target.result.substr(e.target.result.indexOf(",") + 1, e.target.result.length);
                    $("#image_preview").attr("src", e.target.result);
                    $.ajax({
                        url: 'https://api.imgur.com/3/image',
                        headers: {
                            'Authorization': 'Client-ID MY_CLIENT_ID'
                        },
                        type: 'POST',
                        data: {
                            'image': data,
                            'type': 'base64'
                        },
                        success: function(response) {
                            $("#image_preview_2").attr("src", response.data.link);
                        }, error: function() {
                            alert("Error while uploading...");
                        }
                    });
                };
                reader.readAsDataURL(this.files[0]);
            });
        </script>
    </body>
</html>

这里的问题是我无法想出一种方法来保密我的客户端ID。如何在不将图像上传到服务器的情况下完成此操作?

0 个答案:

没有答案