[英]How to get user's photo(profile) using Microsoft Graph API?
When a GET( https://graph.microsoft.com/v1.0/users/ {{user_id}} /photo/$value) request is made, the response data will be written with the same characters as image当 GET( https://graph.microsoft.com/v1.0/users/ {{user_id}} /photo/$value) 请求时,响应数据将写入与图像相同的字符
After converting to base64, I tried blob format but the picture does not appear.转换成base64后,我试了blob格式,但是图片没有出现。
router.js路由器.js
router.get('/photo/:id',function (req,res) {
auth.getAccessToken().then(function (token){
let userId = req.params.id;
graph.getUserPhotoData(token, userId).then(function (result) {
res.json(result);
}).catch(function (e) { console.log(e) })
});
});
graph.js图.js
function getUserPhoto(token, userId){
return axios({
method : 'get',
url : 'https://graph.microsoft.com/v1.0/users/'+{{user_id}}+'/photo/$value',
headers: {
'Authorization':token,
// 'Content-Type': 'image/jpeg',
},
responseType : 'blob'
})
}
async function getUserPhotoData(token,userId) {
try{
let userPhoto = getUserPhoto(token,userId);
let p = userPhoto.data;
// let photo = new Buffer(userPhoto.data).toString('base64');
return p; //...013O✿\u0011�e����|��>�4+�y��\u0017�"Y...
}catch (e) { console.log(e);}
}
index.js索引.js
$.get('/photo/'+userId, function(response) {
let binaryData = [];
binaryData.push(response);
const blobUrl = window.URL.createObjectURL(new Blob(binaryData, {type: "image/jpeg"}));
document.getElementById('user-img').setAttribute("src", blobUrl );
});
Edit: new Buffer is deprected. 编辑:不建议使用新的缓冲区。 Please use Buffer.from(response.data, 'binary').toString('base64'); 请使用Buffer.from(response.data,'binary')。toString('base64');
it works for me 这个对我有用
const graphEndpoint = "https://graph.microsoft.com/v1.0/me/photo/$value";
const response = await axios(graphEndpoint, { headers: { Authorization: `Bearer ${token}` }, responseType: 'arraybuffer' });
const avatar = new Buffer(response.data, 'binary').toString('base64');
Finally found a solution to this.终于找到了解决这个问题的方法。 The previous answers didn't quite work for me: What I found that worked was:以前的答案对我来说不太适用:我发现有用的是:
const { data: photoValue} = await axios.request({
method: 'GET',
{ headers: { Authorization: `Bearer ${token}` },
responseType: 'blob',
url: 'https://graph.microsoft.com/v1.0/me/photo/$value',
});
const blobUrl = window.URL.createObjectURL(photoValue);
and then displaying it with <img src={blobUrl} />
.然后用<img src={blobUrl} />
显示它。 This is the shortest answer in my opinion, and relies on the responseType: 'blob'
being given.在我看来,这是最短的答案,并且依赖于给出的responseType: 'blob'
。
I solved this problem. 我解决了这个问题。
const request = require('request'); router.get('/photo/:id',function (req,res) { auth.getAccessToken().then(function (token){ let userId = req.params.id; // graph.getUserPhotoData(token, userId).then(function (result) { // console.log(result); // res.json(result); // }).catch(function (e) { console.log(e) }) request({ uri: 'https://graph.microsoft.com/beta/users/'+userId+'/photo/$value', method: "GET", headers:{'Authorization' : 'Bearer' + token}, encoding: null}, function(error, response, body) { let data = "data:" + response.headers["content-type"] + ";base64," + new Buffer(body).toString('base64'); res.send(data); //data:image/jpeg;base64,/9j/4AAQSkZJRg... }); }); });
$.get('/photo/'+ userId, function(response) { document.getElementById('user-img').setAttribute("src", response); });
'graph.js' is not needed. 不需要“ graph.js”。
reference : Node.js get image from web and encode with base64 参考: Node.js从Web获取图像并使用base64进行编码
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.