|
1 | 1 | ---
|
2 | 2 | title: Add and remove attachments in an Outlook add-in
|
3 | 3 | description: Use various attachment APIs to manage the files or Outlook items attached to the item the user is composing.
|
4 |
| -ms.date: 02/13/2025 |
| 4 | +ms.date: 02/18/2025 |
5 | 5 | ms.topic: how-to
|
6 | 6 | ms.localizationpriority: medium
|
7 | 7 | ---
|
@@ -76,39 +76,32 @@ Office.context.mailbox.item.addFileAttachmentAsync(
|
76 | 76 | );
|
77 | 77 | ```
|
78 | 78 |
|
79 |
| -To add inline a Base64-encoded image to the body of a message or appointment being composed, you must first get the current item body using the `Office.context.mailbox.item.body.getAsync` method before inserting the image using the `addFileAttachmentFromBase64Async` method. Otherwise, the image won't render in the body once it's inserted. For guidance, see the following JavaScript example, which adds an inline Base64 image to the beginning of an item body. |
| 79 | +To add an inline Base64-encoded image to the body of a message or appointment being composed, use the [Body API](/javascript/api/outlook/office.body) methods, such as [prependAsync](/javascript/api/outlook/office.body#outlook-office-body-prependasync-member(1)), [setSignatureAsync](/javascript/api/outlook/office.body#outlook-office-body-setsignatureasync-member(1)), or [setAsync](/javascript/api/outlook/office.body#outlook-office-body-setasync-member(1)). |
| 80 | + |
| 81 | +> [!TIP] |
| 82 | +> Before inserting the image inline using `Office.context.mailbox.item.body.setAsync`, you must first call `Office.context.mailbox.item.body.getAsync` to get the current body of the mail item. Otherwise, the image won't render in the body once it's inserted. For guidance, see the [Add inline Base64-encoded image to message or appointment body (Compose)](https://raw.githubusercontent.com/OfficeDev/office-js-snippets/refs/heads/main/samples/outlook/20-item-body/add-inline-base64-image.yaml) sample in [Script Lab](../overview/explore-with-script-lab.md). |
| 83 | +
|
| 84 | +The following is an example of a Base64-encoded image prepended to the body of a mail item. |
80 | 85 |
|
81 | 86 | ```javascript
|
82 |
| -const mailItem = Office.context.mailbox.item; |
83 | 87 | const base64String =
|
84 | 88 | "iVBORw0KGgoAAAANSUhEUgAAAGAAAABgCAMAAADVRocKAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAnUExURQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAN0S+bUAAAAMdFJOUwAQIDBAUI+fr7/P7yEupu8AAAAJcEhZcwAADsMAAA7DAcdvqGQAAAF8SURBVGhD7dfLdoMwDEVR6Cspzf9/b20QYOthS5Zn0Z2kVdY6O2WULrFYLBaLxd5ur4mDZD14b8ogWS/dtxV+dmx9ysA2QUj9TQRWv5D7HyKwuIW9n0vc8tkpHP0W4BOg3wQ8wtlvA+PC1e8Ao8Ld7wFjQtHvAiNC2e8DdqHqKwCrUPc1gE1AfRVgEXBfB+gF0lcCWoH2tYBOYPpqQCNwfT3QF9i+AegJfN8CtAWhbwJagtS3AbIg9o2AJMh9M5C+SVGBvx6zAfmT0r+Bv8JMwP4kyFPir+cswF5KL3WLv14zAFBCLf56Tw9cparFX4upgaJUtPhrOS1QlY5W+vWTXrGgBFB/b72ev3/0igUdQPppP/nfowfKUUEFcP207y/yxKmgAYQ+PywoAFOfCH3A2MdCFzD3kdADBvq10AGG+pXQBgb7pdAEhvuF0AIc/VtoAK7+JciAs38KIuDugyAC/v4hiMCE/i7IwLRBsh68N2WQjMVisVgs9i5bln8LGScNcCrONQAAAABJRU5ErkJggg==";
|
85 | 89 |
|
86 |
| -// Get the current body of the message or appointment. |
87 |
| -mailItem.body.getAsync(Office.CoercionType.Html, (bodyResult) => { |
88 |
| - if (bodyResult.status === Office.AsyncResultStatus.Failed) { |
89 |
| - console.error(bodyResult.error.message); |
90 |
| - return; |
| 90 | +// Add the Base64-encoded image to the beginning of the body. |
| 91 | +Office.context.mailbox.item.addFileAttachmentFromBase64Async(base64String, "sample.png", { isInline: true }, (attachmentResult) => { |
| 92 | + if (attachmentResult.status === Office.AsyncResultStatus.Failed) { |
| 93 | + console.log(`Failed to attach file: ${attachmentResult.error.message}`); |
| 94 | + return; |
91 | 95 | }
|
92 | 96 |
|
93 |
| - // Insert the Base64-encoded image at the beginning of the body. |
94 |
| - const options = { isInline: true, asyncContext: bodyResult.value }; |
95 |
| - mailItem.addFileAttachmentFromBase64Async(base64String, "sample.png", options, (attachResult) => { |
96 |
| - if (attachResult.status === Office.AsyncResultStatus.Failed) { |
97 |
| - console.error(attachResult.error.message); |
98 |
| - return; |
99 |
| - } |
100 |
| - |
101 |
| - let body = attachResult.asyncContext; |
102 |
| - body = body.replace("<p class=MsoNormal>", `<p class=MsoNormal><img src="cid:sample.png">`); |
103 |
| - mailItem.body.setAsync(body, { coercionType: Office.CoercionType.Html }, (setResult) => { |
104 |
| - if (setResult.status === Office.AsyncResultStatus.Failed) { |
105 |
| - console.error(setResult.error.message); |
106 |
| - return; |
107 |
| - } |
| 97 | + Office.context.mailbox.item.body.prependAsync('<img src="cid:sample.png" />', { coercionType: Office.CoercionType.Html }, (prependResult) => { |
| 98 | + if (prependResult.status === Office.AsyncResultStatus.Failed) { |
| 99 | + console.log(`Failed to prepend image to body: ${attachmentResult.error.message}`); |
| 100 | + return; |
| 101 | + } |
108 | 102 |
|
109 |
| - console.log("Inline Base64 image added to the body."); |
110 |
| - }); |
111 |
| - }); |
| 103 | + console.log("Inline Base64-encoded image added to the beginning of the body."); |
| 104 | + }) |
112 | 105 | });
|
113 | 106 | ```
|
114 | 107 |
|
|
0 commit comments