https://api.imgur.com/3/image 的 Http 失败响应

Question

我正在尝试将 base 64 编码图像上传到 imgur，但它一直失败并显示错误消息 Http failure response for https://api.imgur.com/3/image: 403 OK。我该如何解决？

@Injectable()
export class ImgurService {
  private readonly IMGUR_UPLOAD_URL = 'https://api.imgur.com/3/image';
  private readonly IMGUR_API_KEY = '<api-key-xxxx>';

  constructor(
    private logger: NGXLogger,
    private http: HttpClient
  ) {
  }

  upload(b64Image: any) {
    this.logger.debug('Handling file input');
    this.logger.debug(image);
    this.logger.debug(`Uploading picture to ${this.IMGUR_UPLOAD_URL}`);
    const httpOptions = {
      headers: new HttpHeaders ({
        'Authorization': `Bearer ${this.IMGUR_API_KEY}`,
      }),
    };
    const formData = new FormData();
    formData.append('image', b64Image);
    formData.append('album', 'profile');
    return this.http.post<ImgurResponse>(`${this.IMGUR_UPLOAD_URL}`, formData, httpOptions);
  }
}

回复：

error:
data: {error: "The access token provided is invalid.", request: "/3/image", method: "POST"}
status: 403
success: false
__proto__: Object
headers: HttpHeaders
lazyInit: ƒ ()
lazyUpdate: null
normalizedNames: Map(0) {}
__proto__: Object
message: "Http failure response for https://api.imgur.com/3/image: 403 OK"
name: "HttpErrorResponse"
ok: false
status: 403
statusText: "OK"
url: "https://api.imgur.com/3/image"
__proto__: HttpResponseBase

Answer 1

您没有正确设置标题：您需要使用 set 或 append 因为对象是不可变的。

let headers = new HttpHeaders();
headers = headers.set('Authorization', 'Bearer ${this.IMGUR_API_KEY}');

您很可能会在浏览器中看到您的身份验证标头未发送。

Answer 2

很可能您传递了错误的访问令牌。
这是一个对我来说很好用的代码：

  uploadImage(b64Image: string): Observable<Object> {
    let headers = new HttpHeaders({ 'Authorization': `Bearer ${this.IMGUR_ACCESS_TOKEN}` });

    return this.httpClient.post(this.IMGUR_UPLOAD_URL, b64Image, { headers: headers });
  }

当我给出一个随机的不存在的访问令牌时，我也会得到 403，如下所示：

查看快速示例here