使用 AngularJS 将图像上传到 Imgur答案

【问题标题】：Uploading image to Imgur using AngularJS使用 AngularJS 将图像上传到 Imgur
【发布时间】：2015-10-04 04:44:56
【问题描述】：

我正在尝试使用 Imgur 的 API 上传图片。我想让我的代码尽可能简单，所以我尝试使用angular-file-upload 指令。

我已设置指令以使用标签并将请求提交给 API：

https://api.imgur.com/3/image

HTML 如下所示：

<input type="file" nv-file-select="" uploader="uploader">

在控制器内部我正在这样做：

$scope.uploader = new FileUploader({
    url: 'https://api.imgur.com/3/image',
    headers: {
        Authorization: 'Client-ID XXXXXXXXXXXXXXX',
    },
    autoUpload: true
});

我面临的问题是 Imgur API 期望在标头的“图像”字段中接收文件作为二进制文件或 base64 数据，但浏览器似乎在 POST 的正文中发送文件请求。

我一直在尝试让指令改为在标头中发送文件，但我找不到方法。使用 angular-file-upload 指令解决此问题的方法或实现此问题的另一种简单方法将不胜感激。

一个要求是我需要提供上传状态的反馈：上传百分比、成功、错误和错误原因。

【问题讨论】：

请发布您的代码。

标签： javascript angularjs imgur

【解决方案1】：

我找到了这个问题的简单答案。

在为 angular-file-upload 指令创建 FileUploader 对象的实例时，必须指定 alias 选项以将包含文件数据的表单字段的名称从默认的 file 更改为Imgur 期望的名称：image。

$scope.uploader = new FileUploader({
    url: 'https://api.imgur.com/3/image',
    alias: 'image',
    headers: {
        Authorization: 'Client-ID XXXXXXXXXXXXXXX',
    },
    autoUpload: true
});

【讨论】：