在 Angular 9 中将附加文件发送到 MS Graph 电子邮件

Question

我正在向 Angular 9 网络应用程序添加文件附件功能，但运行遇到了问题。

MS Graph API 参考资料指出，任何文件在使用前都应进行 based64 编码，我已经这样做了，但出现以下错误

{"error":{"code":"RequestBodyRead","message":"无法将文字 'data:application/pdf;base64,JV.....' 转换为预期类型 'Edm.Binary'。"}}

这是我的代码；

  getBase64(file: File) {
    return new Promise((resolve, reject) => {
      const reader = new FileReader();
      reader.readAsDataURL(file);
      reader.onload = () => resolve(reader.result);
      reader.onerror = error => reject(error);
    });
  }

async sendEmail(toEmail: string, subject: string, message: string, fileAttachment: File): Promise<any> {

    this.getBase64(fileAttachment).then(
      async data => {
        // console.log(data)

        try {
          const sendMail = {
            message: {
              subject: subject,
              body: {
                contentType: 'HTML',
                content: message
              },
              toRecipients: [
                {
                  emailAddress: {
                    address: toEmail
                  }
                }
              ],
              attachments: [
                {
                  "@odata.type": "#microsoft.graph.fileAttachment",
                  "name": fileAttachment.name,
                  "contentType": fileAttachment.type.toString,
                  "contentBytes": data
                }
              ]
            }
          };

          let res = await this.client.api('/me/sendMail').post(sendMail);

          return res;
        } catch (error) {
          this.handleError(error);
        }
      }
    );
  }

如果有人能提供帮助，我将不胜感激。我已经为此工作了一段时间，但未能解决问题。

非常感谢，

马克.

更新使用 MS Graph Explorer 发送电子邮件，我能够确定问题的原因；这是来自 getBase64 "data:application/pdf;base64" 的 returned 值的第一部分如果我从 base64 字符串中删除它，我可以给自己发送一封电子邮件。

所以问题是，为什么字符串的第一部分在那里？当来自 getBase64 的 return 值是未知类型时，我该如何去除它？

Answer 1

你可以有一个单独的函数来使用 promises 获取文件的 base64 编码，然后使用 split 函数删除第一部分。

<input name="attachments" type="file" (change)="addattachment($event)" >

function getBase64(file, onLoadCallback) {
    return new Promise(function(resolve, reject) {
        var reader = new FileReader();
        reader.onload = function() { resolve(reader.result); };
        reader.onerror = reject;
        reader.readAsDataURL(file);
    });
}

async addattachment (event) {
    const myfile = event.target.files[0]
    const promise = this.getBase64(myfile)
    const base64file = await promise
    var ms_base64file = base64file.split(',')[1]
    console.log(ms_base64file)
}

在 Angular 9 中将附加文件发送到 MS Graph 电子邮件

Issue attaching file to MS Graph email in Angular 9

base64

graph

email-attachments

angular