Question

查看Microsoft的Graph API，特别是查看名为“O365-Angular-Microsoft-Graph-Connect”的角度示例 - https://github.com/OfficeDev/O365-Angular-Microsoft-Graph-Connect。已成功注册应用程序并安装了依赖项。但是，在运行应用程序时，我正确地看到了除图像之外的所有用户详细信息（O365租户中的所有用户都有图像）。调试应用程序看起来从api收到的响应中充满了' '符号，表明某处存在编码问题。使用图形API资源管理器时，我得到的图像返回正常，这表明这是应用程序。有关如何解决此问题的任何想法，以便示例应用程序有效吗？索引html页面是正确的UTF-8编码，所以应用程序看起来正确，这表明API的问题，但是图形API浏览器给我正确的图像，表明它是应用程序。

有关如何在Microsoft提供的示例应用中提取图像的任何想法？

其他想法是，由于MS提供的示例屏幕截图使用占位符图像，因此应用程序的这部分内容尚未正常工作。

Answer 1

这是一个较旧的问题，但我希望这对某些人有用（C＃）。

将传入的数组捕获为byteArray并将其转换为base64string。这些可以很容易地转换为图像或保存在DB的

中

    public static async void GetPhoto(HttpClient client, string id)
    {
        var resp = await client.GetAsync(@"https://graph.microsoft.com/v1.0/users/" + id + "/photos/240x240/$value");

        var buffer = await resp.Content.ReadAsByteArrayAsync();
        var byteArray = buffer.ToArray();

        string base64String = Convert.ToBase64String(byteArray);
        if(base64String != null && base64String != "")
        {
            //Insert into database or convert.
        }
    }

Answer 2

使用Postman玩游戏后（Chrome扩展程序可以播放REST等），很明显返回的图像没问题且“正常”，我们的代码必须确保它保存原样。

之后我破解了这个NodeJS代码，可能会帮助像我这样的新手：）

/**
     /users/<id | userPrincipalName>/photo/$value
 */

function getUserPhoto(accessToken, userId, callback) {
          var options = {
            host: 'graph.microsoft.com',
            path: "/v1.0/users/" +userId + "/photo/$value",
            method: 'GET',
            headers: {
              Authorization: 'Bearer ' + accessToken
            }
          };

          https.get(options, function (response) {
            response.setEncoding('binary'); /* This is very very necessary! */
            var body = '';
            response.on('data', function (d) {
              body += d;
            });
            response.on('end', function () {
              var error;
              if (response.statusCode === 200) {
                    /* save as "normal image" */
                fs.writeFile('./public/img/image.jpeg', body, 'binary',  function(err){
                    if (err) throw err
                    console.log('Image saved ok')
                })
                /* callback - for example show in template as base64 image */
                callback(new Buffer(body, 'binary').toString('base64'));
              } else {
                error = new Error();
                error.code = response.statusCode;
                error.message = response.statusMessage;
                // The error body sometimes includes an empty space
                // before the first character, remove it or it causes an error.
                body = body.trim();
                error.innerError = JSON.parse(body).error;
                callback(error, null);
              }
            });
          }).on('error', function (e) {
            callback(e, null);
          });
        }

Answer 3

获取照片的TypeScript代码

  @observable private photo: string;

    getPhoto('/me/photos/48x48/$value').then((photo) => {
      this.photo = photo;
    }).catch(error => {});
  }

<img className='br24' src={this.photo}/>

export function getPhoto(query: string): Promise<string> {
  let promise = new Promise<string>((resolve, reject) => {
    adalContext.AuthContext.acquireToken("https://graph.microsoft.com", (error, token) => {
      if (error) {
        reject(error);
      } else {
        if (query.indexOf('/') != 0)
          query = '/' + query;
        let u = `https://graph.microsoft.com/v1.0${query}`;
        axios.get(u, { headers: { Authorization: `Bearer ${token}`, encoding: null }, responseType: 'arraybuffer' }).then(
          val => {
            let photo = 'data:' + val.headers['content-type'] + ';base64,' + new Buffer(val.data, 'binary').toString('base64');
            resolve(photo);
          },
          error => {
            reject(error);
          }
        );
      }
    });
  });

  return promise;
}

如何使用Microsoft Graph API获取用户的图像，编码问题？

3 个答案: