我正在构建一个 reactJS 应用程序,我正在尝试从他们的 Outlook 帐户中检索用户的个人资料图片。
阅读 Outlook 的文档,我可以使用以下 URL 获取该照片(将 EMAILHERE
替换为用户的电子邮件):
https://outlook.office.com/owa/service.svc/s/GetPersonaPhoto?email=EMAILHERE&UA=0&size=HR64x64
但是,如果用户没有设置个人资料图片,它将返回 1x1 图片。
在我的 React 应用程序中,我想显示用户的图像(如果存在),如果不使用通用图像 ({this.addDefaultSrc}
)。但是,即使用户没有设置个人资料图片,它仍然返回 1x1 图片,我该如何实现?
我可以检查图像有多大,如果超过 1x1,然后返回吗?由于网址没有返回错误,我不确定还有哪些其他创造性的方法可以实现这一点。
这是我当前的代码:
<div className={styles.chatBody}>
<h6>Chat Window</h6>
{chatArray.map((item,i) =>
<div className={`${styles.answer} ${styles.left}`}>
<div className={styles.avatar}>
<img onError={this.addDefaultSrc} src="https://outlook.office.com/owa/service.svc/s/GetPersonaPhoto?email=EMAILHERE&UA=0&size=HR240x240&sc=1612564823453" alt="User name" />
</div>
<div className={styles.name}>{item.userName}</div>
<div className={styles.text}>{item.message}</div>
<div className={styles.time}>{item.time}</div>
</div>
)}
</div>
addDefaultSrc(ev){
//Code Here to check onError (not sure if it will ever be on error since returns 1X1)
ev.target.src = 'location-to-backup-image-here'
}