从 Microsoft Graph API 解析图像答案

【问题标题】：Parse Image from Microsoft Graph API从 Microsoft Graph API 解析图像
【发布时间】：2018-08-17 07:09:02
【问题描述】：

在我查看了 www、stackoverflow 和 youtube 之后，我找不到关于如何从以下位置正确获取图像的具体答案：

https://graph.microsoft.com/beta/me/photo/$value

在 TypeScript/JavaScript 中。正如我想的那样，解决方案真的很容易。您只需要在您的GET 请求中提供此附加信息：

responseType: ResponseContentType.ArrayBuffer

【问题讨论】：

标签： image binary base64 blob

【解决方案1】：

完整的解决方案如下所示：

import { DomSanitizer } from "@angular/platform-browser";
import { Http, Headers, ResponseContentType } from "@angular/http";
import "rxjs/add/operator/map";
import { AlertController } from "ionic-angular";

export class GraphService {
constructor(
   private http: Http,
   private alertCtrl: AlertController,
   private sanitizer: DomSanitizer
) {}

transform(html) {
   return this.sanitizer.bypassSecurityTrustUrl(html);
}

getProfileImage(accessToken: string) {
    // fetch User Profile Image
    let headers: Headers = new Headers();
    headers.append("Authorization", "Bearer " + accessToken);
    this.http
      .get("https://graph.microsoft.com/beta/me/photo/$value", {
        responseType: ResponseContentType.ArrayBuffer,
        headers: headers
      })
      .map(res => res)
      .subscribe(
        (data: any) => {
          let blob = new Blob([data.arrayBuffer()], {
            type: data.headers.get("content-type")
          });
          let imageUrl = window.URL.createObjectURL(blob);

          return this.transform(imageUrl));
        },
        error => {
          let alert = this.alertCtrl.create({
            title: "GraphProvider",
            subTitle: "Can't fetch profile image!",
            buttons: ["OK"]
          });
          alert.present();
        }
      );
}
}

最重要的部分是：不要在标题中附加responseType: ResponseContentType.ArrayBuffer！您必须在标题旁边提供它！并且不要忘记从@angular/http 导入它！

我希望我能帮助所有迷失的灵魂：D

PS：感谢 Micheal Mainer 的 Graph Explorer Repo：https://github.com/microsoftgraph/microsoft-graph-explorer/tree/e2a376615d14c5eabd51e972478b18827800d323

这是我从 Microsoft Graph API 获取的图像：

【讨论】：