Freigeben über

Automatisches Überprüfen auf eine Anlage, bevor eine Nachricht gesendet wird

  • Artikel

Verpassen Sie nie wieder, ein wichtiges Dokument oder Foto an Ihre Nachricht anzufügen. Mit einem ereignisbasierten Add-In werden Ihre Nachrichten automatisch auf Anlagen überprüft, bevor sie gesendet werden, sodass Sie sicher sind, dass Sie immer eine vollständige Version senden.

In den folgenden Abschnitten erfahren Sie, wie Sie ein ereignisbasiertes Add-In entwickeln, das intelligente Warnungen zur Behandlung des OnMessageSend Ereignisses implementiert. Am Ende dieser exemplarischen Vorgehensweise sucht Ihr Add-In automatisch nach einem angefügten Dokument oder Bild, das in der Nachricht erwähnt wird, und warnt Sie, wenn es fehlt, bevor die Nachricht gesendet wird.

Hinweis

Die OnMessageSend Ereignisse und OnAppointmentSend wurden im Anforderungssatz 1.12 eingeführt. Zusätzliche Funktionen und Anpassungsoptionen wurden auch zu nachfolgenden Anforderungssätzen hinzugefügt. Informationen zum Überprüfen, ob Ihr Outlook-Client diese Ereignisse und Features unterstützt, finden Sie unter Unterstützte Clients und Plattformen und in den spezifischen Abschnitten, in denen die Features beschrieben werden, die Sie implementieren möchten.

Einrichten der Umgebung

Bevor Sie mit der exemplarischen Vorgehensweise beginnen, überprüfen Sie, ob Ihr Outlook-Client das Feature "Intelligente Warnungen" unterstützt. Anleitungen finden Sie unter Unterstützte Clients und Plattformen.

Schließen Sie dann den Outlook-Schnellstart ab, der ein Add-In-Projekt mit dem Yeoman-Generator für Office-Add-Ins erstellt.

Konfigurieren des Manifests

Wählen Sie zum Konfigurieren des Manifests die Registerkarte für den Typ des verwendeten Manifests aus.

  1. Öffnen Sie die manifest.json Datei.

  2. Fügen Sie dem Array "extensions.runtimes" das folgende -Objekt hinzu. Beachten Sie Folgendes zu diesem Markup:

    • Die "minVersion" des Postfachanforderungssatzes ist auf "1.12" festgelegt, da die Tabelle mit den unterstützten Ereignissen angibt, dass dies die niedrigste Version des Anforderungssatzes ist, der das OnMessageSend Ereignis unterstützt.
    • Die "id" der Laufzeit wird auf den beschreibenden Namen "autorun_runtime" festgelegt.
    • Die Eigenschaft "code" verfügt über eine untergeordnete "page"-Eigenschaft, die auf eine HTML-Datei festgelegt ist, und eine untergeordnete "script"-Eigenschaft, die auf eine JavaScript-Datei festgelegt ist. Sie erstellen oder bearbeiten diese Dateien in späteren Schritten. Office verwendet je nach Plattform einen dieser Werte oder den anderen.
      • Das klassische Outlook unter Windows führt den Ereignishandler in einer reinen JavaScript-Runtime aus, die eine JavaScript-Datei direkt lädt.
      • Outlook im Web, unter Mac und unter neuen Outlook unter Windows führen Sie den Handler in einer Browserruntime aus, die eine HTML-Datei lädt. Diese Datei enthält wiederum ein <script> Tag, das die JavaScript-Datei lädt. Weitere Informationen finden Sie unter Runtimes in Office-Add-Ins.
    • Die Eigenschaft "lifetime" ist auf "short" festgelegt. Dies bedeutet, dass die Laufzeit gestartet wird, wenn das Ereignis ausgelöst wird, und nach Abschluss des Handlers heruntergefahren wird. (In bestimmten seltenen Fällen wird die Runtime heruntergefahren, bevor der Handler abgeschlossen ist. Siehe Runtimes in Office-Add-Ins.)
    • Es gibt eine Aktion zum Ausführen eines Handlers für das OnMessageSend -Ereignis. Sie erstellen die Handlerfunktion in einem späteren Schritt.
     {
    "requirements": {
        "capabilities": [
            {
                "name": "Mailbox",
                "minVersion": "1.14"
            }
        ]
    },
    "id": "autorun_runtime",
    "type": "general",
    "code": {
        "page": "https://localhost:3000/commands.html",
        "script": "https://localhost:3000/launchevent.js"
    },
    "lifetime": "short",
    "actions": [
        {
            "id": "onMessageSendHandler",
            "type": "executeFunction",
            "displayName": "onMessageSendHandler"
        }
    ]
}

  3. Fügen Sie das folgende "autoRunEvents"-Array als Eigenschaft des Objekts im Array "extensions" hinzu.

    "autoRunEvents": [

]

  4. Fügen Sie dem Array "autoRunEvents" das folgende -Objekt hinzu. Zu diesem Code ist Folgendes anzumerken:

    • Das Ereignisobjekt weist dem OnMessageSend Ereignis eine Handlerfunktion zu (unter Verwendung des einheitlichen Manifestnamens des Ereignisses, "messageSending", wie in der Tabelle für unterstützte Ereignisse beschrieben). Der in "actionId" angegebene Funktionsname muss mit dem Namen übereinstimmen, der in einem früheren Schritt in der Eigenschaft "id" des Objekts im Array "actions" verwendet wurde.
    • Die Option "sendMode" ist auf "softBlock" festgelegt. Dies bedeutet: Wenn die Nachricht nicht die Bedingungen erfüllt, die das Add-In für das Senden festlegt, muss der Benutzer Maßnahmen ergreifen, bevor er die Nachricht senden kann. Wenn das Add-In jedoch zum Zeitpunkt des Sendens nicht verfügbar ist, wird das Element gesendet.
      {
      "requirements": {
          "capabilities": [
              {
                  "name": "Mailbox",
                  "minVersion": "1.12"
              }
          ],
          "scopes": [
              "mail"
          ]
      },
      "events": [
        {
            "type": "messageSending",
            "actionId": "onMessageSendHandler",
            "options": {
                "sendMode": "softBlock"
            }
        }
      ]
  }

Tipp

  • Eine Liste der Optionen für den Sendemodus, die mit den OnMessageSend Ereignissen und OnAppointmentSend verfügbar sind, finden Sie unter Verfügbare Sendemodusoptionen.
  • Weitere Informationen zu Manifesten für Outlook-Add-Ins finden Sie unter Office-Add-In-Manifeste.

Implementieren der Ereignisbehandlung

Sie müssen die Behandlung für das ausgewählte Ereignis implementieren.

In diesem Szenario fügen Sie die Behandlung für das Senden einer Nachricht hinzu. Ihr Add-In sucht in der Nachricht nach bestimmten Schlüsselwörtern. Wenn eines dieser Schlüsselwörter gefunden wird, wird überprüft, ob Anlagen vorhanden sind. Wenn keine Anlagen vorhanden sind, empfiehlt das Add-In dem Benutzer, die möglicherweise fehlende Anlage hinzuzufügen.

Hinweis

Der Ereignishandler in dieser exemplarischen Vorgehensweise implementiert die errorMessageMarkdown-Eigenschaft . Diese Eigenschaft befindet sich derzeit in Outlook im Web und unter Windows (neu und klassisch) in der Vorschauphase. Features in der Vorschau sollten nicht in Produktions-Add-Ins verwendet werden. Wir laden Sie ein, dieses Feature in Test- oder Entwicklungsumgebungen auszuprobieren und Feedback zu Ihrer Erfahrung über GitHub zu begrüßen (siehe Den Abschnitt Feedback am Ende dieser Seite).

Um dieses Feature im klassischen Outlook unter Windows zu testen, müssen Sie Version 2403 (Build 17330.10000) oder höher installieren. Nehmen Sie dann am Microsoft 365 Insider-Programm teil, und wählen Sie die Option Betakanal in Ihrem Outlook-Client aus, um auf Office Beta-Builds zuzugreifen.

  1. Erstellen Sie aus demselben Schnellstartprojekt einen neuen Ordner namens launchevent im Verzeichnis ./src .

  2. Erstellen Sie im Ordner ./src/launchevent eine neue Datei mit dem Namen launchevent.js.

  3. Öffnen Sie die Datei ./src/launchevent/launchevent.js in Ihrem Code-Editor, und fügen Sie den folgenden JavaScript-Code hinzu.

    /*
* Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the MIT license.
* See LICENSE in the project root for license information.
*/

function onMessageSendHandler(event) {
  Office.context.mailbox.item.body.getAsync(
    "text",
    { asyncContext: event },
    getBodyCallback
  );
}

function getBodyCallback(asyncResult){
  const event = asyncResult.asyncContext;
  let body = "";
  if (asyncResult.status !== Office.AsyncResultStatus.Failed && asyncResult.value !== undefined) {
    body = asyncResult.value;
  } else {
    const message = "Failed to get body text";
    console.error(message);
    event.completed({ allowEvent: false, errorMessage: message });
    return;
  }

  const matches = hasMatches(body);
  if (matches) {
    Office.context.mailbox.item.getAttachmentsAsync(
      { asyncContext: event },
      getAttachmentsCallback);
  } else {
    event.completed({ allowEvent: true });
  }
}

function hasMatches(body) {
  if (body == null || body == "") {
    return false;
  }

  const arrayOfTerms = ["send", "picture", "document", "attachment"];
  for (let index = 0; index < arrayOfTerms.length; index++) {
    const term = arrayOfTerms[index].trim();
    const regex = RegExp(term, 'i');
    if (regex.test(body)) {
      return true;
    }
  }

  return false;
}

function getAttachmentsCallback(asyncResult) {
  const event = asyncResult.asyncContext;
  if (asyncResult.value.length > 0) {
    for (let i = 0; i < asyncResult.value.length; i++) {
      if (asyncResult.value[i].isInline == false) {
        event.completed({ allowEvent: true });
        return;
      }
    }

    event.completed({
      allowEvent: false,
      errorMessage: "Looks like the body of your message includes an image or an inline file. Attach a copy to the message before sending.",
      // TIP: In addition to the formatted message, it's recommended to also set a
      // plain text message in the errorMessage property for compatibility on
      // older versions of Outlook clients.
      errorMessageMarkdown: "Looks like the body of your message includes an image or an inline file. Attach a copy to the message before sending.\n\n**Tip**: For guidance on how to attach a file, see [Attach files in Outlook](https://www.contoso.com/help/attach-files-in-outlook)."
    });
  } else {
    event.completed({
      allowEvent: false,
      errorMessage: "Looks like you're forgetting to include an attachment.",
      // TIP: In addition to the formatted message, it's recommended to also set a
      // plain text message in the errorMessage property for compatibility on
      // older versions of Outlook clients.
      errorMessageMarkdown: "Looks like you're forgetting to include an attachment.\n\n**Tip**: For guidance on how to attach a file, see [Attach files in Outlook](https://www.contoso.com/help/attach-files-in-outlook)."
    });
  }
}

// IMPORTANT: To ensure your add-in is supported in Outlook, remember to map the event handler name specified in the manifest to its JavaScript counterpart.
Office.actions.associate("onMessageSendHandler", onMessageSendHandler);

Wichtig

  • Im klassischen Outlook unter Windows werden Importe derzeit nicht in der JavaScript-Datei unterstützt, in der Sie die Behandlung für die ereignisbasierte Aktivierung implementieren.
  • Um sicherzustellen, dass Ihr Add-In erwartungsgemäß ausgeführt wird, wenn ein OnMessageSend - oder OnAppointmentSend -Ereignis auftritt, rufen Sie Office.actions.associate in der JavaScript-Datei auf, in der Ihre Handler implementiert sind. Dadurch wird der im Manifest angegebene Ereignishandlername seiner JavaScript-Entsprechung zugeordnet. Wenn dieser Aufruf nicht in Ihrer JavaScript-Datei enthalten ist und die Sendemoduseigenschaft Ihres Manifests auf "Soft Block " festgelegt ist oder nicht angegeben ist, werden Ihre Benutzer am Senden von Nachrichten oder Besprechungen gehindert.

Anpassen der Schaltfläche "Nicht senden" (optional)

Hinweis

Unterstützung zum Anpassen der Schaltfläche "Nicht senden " wurde in Anforderungssatz 1.14 eingeführt. Erfahren Sie mehr über die unterstützten Clients und Plattformen.

Wenn ein E-Mail-Element die Bedingungen eines Smart Alerts-Add-Ins nicht erfüllt, wird dem Benutzer ein Dialogfeld angezeigt, in dem er darauf hingewiesen wird, dass möglicherweise zusätzliche Aktionen erforderlich sind, bevor ein Element gesendet werden kann. Die im Manifest angegebene Option für den Sendemodus bestimmt die Optionen, die dem Benutzer im Dialogfeld angezeigt werden. Die Option Nicht senden wird im Dialogfeld angezeigt, unabhängig davon, welche Option für den Sendemodus Sie auswählen. Wenn Sie Nicht senden auswählen, wird der Sendevorgang standardmäßig abgebrochen und das Dialogfeld geschlossen. Um dem Benutzer weitere Anleitungen zur Erfüllung der Bedingungen ihres Add-Ins bereitzustellen, passen Sie den Text dieser Schaltfläche an, und programmieren Sie ihn, um einen Aufgabenbereich zu öffnen, in dem Sie zusätzliche Informationen und Funktionen bereitstellen können.

Ändern des Texts und der Funktionalität der Schaltfläche "Nicht senden"

Um den Text der Schaltfläche Nicht senden zu ändern oder ihr einen Aufgabenbereichsbefehl zuzuweisen, müssen Sie zusätzliche Optionen in der event.completed-Methode Ihres Ereignishandlers festlegen.

  • Mit der Option cancelLabel wird der Text der Schaltfläche "Nicht senden " angepasst. Benutzerdefinierter Text darf maximal 20 Zeichen lang sein.

  • Die Option commandId gibt die ID des Aufgabenbereichs an, der geöffnet wird, wenn die Schaltfläche Nicht senden ausgewählt ist. Der Wert muss mit der Aufgabenbereichs-ID im Manifest Ihres Add-Ins übereinstimmen. Das Markup hängt vom Typ des Manifests ab, das ihr Add-In verwendet.

    • Nur Add-In-Manifest: Das id Attribut des <Control-Elements> , das den Aufgabenbereich darstellt.
    • Einheitliches Manifest für Microsoft 365: Die Eigenschaft "id" des Aufgabenbereichbefehls im Array "controls".

  • Die Option contextData gibt alle JSON-Daten an, die Sie an das Add-In übergeben möchten, wenn die Schaltfläche Nicht senden ausgewählt ist. Wenn Sie diese Option einschließen, müssen Sie auch die commandId Option festlegen. Andernfalls werden die JSON-Daten ignoriert.

    Tipp

    Um den Wert der contextData Option abzurufen, müssen Sie Office.context.mailbox.item.getInitializationContextAsync in der JavaScript-Implementierung Ihres Aufgabenbereichs aufrufen.

  1. Navigieren Sie zum Ordner ./src/launchevent , und öffnen Sie dannlaunchevent.js.

  2. Ersetzen Sie die getAttachmentsCallback-Funktion durch den folgenden Code.

    function getAttachmentsCallback(asyncResult) {
  const event = asyncResult.asyncContext;
  if (asyncResult.value.length > 0) {
    for (let i = 0; i < asyncResult.value.length; i++) {
      if (asyncResult.value[i].isInline == false) {
        event.completed({ allowEvent: true });
        return;
      }
    }

    event.completed({
      allowEvent: false,
      errorMessage: "Looks like the body of your message includes an image or an inline file. Attach a copy to the message before sending.",
      // TIP: In addition to the formatted message, it's recommended to also set a
      // plain text message in the errorMessage property for compatibility on
      // older versions of Outlook clients.
      errorMessageMarkdown: "Looks like the body of your message includes an image or an inline file. Attach a copy to the message before sending.\n\n**Tip**: For guidance on how to attach a file, see [Attach files in Outlook](https://www.contoso.com/help/attach-files-in-outlook).",
      cancelLabel: "Add an attachment",
      commandId: "msgComposeOpenPaneButton"
    });
  } else {
    event.completed({
      allowEvent: false,
      errorMessage: "Looks like you're forgetting to include an attachment.",
      // TIP: In addition to the formatted message, it's recommended to also set a
      // plain text message in the errorMessage property for compatibility on
      // older versions of Outlook clients.
      errorMessageMarkdown: "Looks like you're forgetting to include an attachment.\n\n**Tip**: For guidance on how to attach a file, see [Attach files in Outlook](https://www.contoso.com/help/attach-files-in-outlook).",
      cancelLabel: "Add an attachment",
      commandId: "msgComposeOpenPaneButton"
    });
  }
}

  3. Speichern Sie Ihre Änderungen.

Überschreiben der Sendemodusoption zur Laufzeit (optional)

Hinweis

Unterstützung zum Anpassen der Schaltfläche "Nicht senden " wurde in Anforderungssatz 1.14 eingeführt. Erfahren Sie mehr über die unterstützten Clients und Plattformen.

Es kann Vorkommen geben, in dem Ihr Add-In verschiedene Sendemodusoptionen implementieren soll. Sie möchten beispielsweise, dass Ihr Add-In die Option Blockieren für E-Mail-Elemente erzwingt, die nicht den Informationsschutzrichtlinien Ihrer organization entsprechen, aber nur die Option Benutzer eingabeaufforderung anwenden, um eine Empfehlung bereitzustellen, wenn ein Benutzer den falschen Empfänger hinzufügt.

Um die Sendemodusoption zur Laufzeit außer Kraft zu setzen, müssen Sie die Option sendModeOverride in der event.completed -Methode Ihres Ereignishandlers festlegen.

  1. Navigieren Sie zum Ordner ./src/launchevent , und öffnen Sie dannlaunchevent.js.

  2. Ersetzen Sie die getAttachmentsCallback-Funktion durch den folgenden Code.

    function getAttachmentsCallback(asyncResult) {
  const event = asyncResult.asyncContext;
  if (asyncResult.value.length > 0) {
    for (let i = 0; i < asyncResult.value.length; i++) {
      if (asyncResult.value[i].isInline == false) {
        event.completed({ allowEvent: true });
        return;
      }
    }

    event.completed({
      allowEvent: false,
      errorMessage: "Looks like the body of your message includes an image or an inline file. Would you like to attach a copy of it to the message?",
      // TIP: In addition to the formatted message, it's recommended to also set a
      // plain text message in the errorMessage property for compatibility on
      // older versions of Outlook clients.
      errorMessageMarkdown: "Looks like the body of your message includes an image or an inline file. Would you like to attach a copy of it to the message?\n\n**Tip**: For guidance on how to attach a file, see [Attach files in Outlook](https://www.contoso.com/help/attach-files-in-outlook).",
      cancelLabel: "Attach a copy",
      commandId: "msgComposeOpenPaneButton",
      sendModeOverride: Office.MailboxEnums.SendModeOverride.PromptUser
    });
  } else {
    event.completed({
      allowEvent: false,
      errorMessage: "Looks like you're forgetting to include an attachment.",
      // TIP: In addition to the formatted message, it's recommended to also set a
      // plain text message in the errorMessage property for compatibility on
      // older versions of Outlook clients.
      errorMessageMarkdown: "Looks like you're forgetting to include an attachment.\n\n**Tip**: For guidance on how to attach a file, see [Attach files in Outlook](https://www.contoso.com/help/attach-files-in-outlook).",
      cancelLabel: "Add an attachment",
      commandId: "msgComposeOpenPaneButton"
    });
  }
}

  3. Speichern Sie Ihre Änderungen.

Konfigurieren des Aufgabenbereichs (optional)

Wenn Sie die optionalen Schritte implementiert haben, um die Schaltfläche "Nicht senden " anzupassen oder die Option "Sendemodus" in dieser exemplarischen Vorgehensweise außer Kraft zu setzen, müssen Sie auch den Aufgabenbereich konfigurieren. Obwohl der Aufgabenbereich in dieser Implementierung erforderlich ist, ist es keine Anforderung, den Text der Schaltfläche "Nicht senden " anzupassen oder die Option "Sendemodus" außer Kraft zu setzen.

  1. Navigieren Sie zum Ordner ./src/taskpane , und öffnen Sie danntaskpane.html.

  2. Wählen Sie den gesamten <Hauptknoten> (einschließlich der Tags "Öffnen" und "Schließen") aus, und ersetzen Sie ihn durch den folgenden Code.

    <body class="ms-welcome ms-Fabric">
    <header class="ms-welcome__header ms-bgColor-neutralLighter">
        <img width="90" height="90" src="../../assets/logo-filled.png" alt="Contoso" title="Contoso" />
        <h1 class="ms-font-su">Try out the Smart Alerts sample</h1>
    </header>
    <section id="sideload-msg" class="ms-welcome__main">
        <h2 class="ms-font-xl">Please <a href="https://learn.microsoft.com/office/dev/add-ins/testing/test-debug-office-add-ins#sideload-an-office-add-in-for-testing">sideload</a> your add-in to see app body.</h2>
    </section>
    <main id="app-body" class="ms-welcome__main" style="display: none;">
        <p>
            This sample implements a Smart Alerts add-in that activates when you forget to attach a document or picture that you mention in your message.
            To learn more, see the <a href="https://learn.microsoft.com/office/dev/add-ins/outlook/smart-alerts-onmessagesend-walkthrough">Smart Alerts walkthrough</a>.
        </p>
        <h3 class="ms-font-l">Add an attachment</h3>
        <p>Add the URL of a file to add it as an attachment.</p>
        <div class="ms-TextField">
            <label class="ms-Label ms-font-l">URL of file:</label>
            <input id="attachment-url" class="ms-TextField-field" type="text" value="https://localhost:3000/assets/icon-128.png" placeholder="">
        </div>
        <br/>
        <button class="ms-Button ms-Button--primary">
            <span id="add-attachment" class="ms-Button-label">Add as attachment</span>
        </button>
        <br/>
        <h3 class="ms-font-l">Override the send mode option at runtime</h3>
        <p>Add an inline image to test overriding the send mode option at runtime.</p>
        <button class="ms-Button ms-Button--primary">
            <span id="add-inline-image" class="ms-Button-label">Add an inline image</span>
        </button>
    </main>
</body>

  3. Speichern Sie Ihre Änderungen.

  4. Öffnen Sie im gleichen Ordner ./src/taskpanetaskpane.js.

  5. Ersetzen Sie den Inhalt durch den folgenden Code.

    /*
 * Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the MIT license.
 * See LICENSE in the project root for license information.
 */

Office.onReady((info) => {
  if (info.host === Office.HostType.Outlook) {
    document.getElementById("sideload-msg").style.display = "none";
    document.getElementById("app-body").style.display = "flex";
    document.getElementById("add-attachment").onclick = addAttachment;
    document.getElementById("add-inline-image").onclick = addInlineImage;
  }
});

// Adds the specified URL as an attachment to the message.
export async function addAttachment() {
  const attachmentUrl = document.querySelector("#attachment-url").value;
  Office.context.mailbox.item.addFileAttachmentAsync(attachmentUrl, getFileName(attachmentUrl), (asyncResult) => {
    console.log(asyncResult);
  });
}

// Gets the file name from a URL.
function getFileName(url) {
  const lastIndex = url.lastIndexOf("/");
  if (lastIndex >= 0) {
    return url.substring(lastIndex + 1);
  }

  return url;
}

// Adds an inline image to the body of the message.
export async function addInlineImage() {
  const mailItem = Office.context.mailbox.item;
  const base64String =
    "iVBORw0KGgoAAAANSUhEUgAAAGAAAABgCAMAAADVRocKAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAnUExURQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAN0S+bUAAAAMdFJOUwAQIDBAUI+fr7/P7yEupu8AAAAJcEhZcwAADsMAAA7DAcdvqGQAAAF8SURBVGhD7dfLdoMwDEVR6Cspzf9/b20QYOthS5Zn0Z2kVdY6O2WULrFYLBaLxd5ur4mDZD14b8ogWS/dtxV+dmx9ysA2QUj9TQRWv5D7HyKwuIW9n0vc8tkpHP0W4BOg3wQ8wtlvA+PC1e8Ao8Ld7wFjQtHvAiNC2e8DdqHqKwCrUPc1gE1AfRVgEXBfB+gF0lcCWoH2tYBOYPpqQCNwfT3QF9i+AegJfN8CtAWhbwJagtS3AbIg9o2AJMh9M5C+SVGBvx6zAfmT0r+Bv8JMwP4kyFPir+cswF5KL3WLv14zAFBCLf56Tw9cparFX4upgaJUtPhrOS1QlY5W+vWTXrGgBFB/b72ev3/0igUdQPppP/nfowfKUUEFcP207y/yxKmgAYQ+PywoAFOfCH3A2MdCFzD3kdADBvq10AGG+pXQBgb7pdAEhvuF0AIc/VtoAK7+JciAs38KIuDugyAC/v4hiMCE/i7IwLRBsh68N2WQjMVisVgs9i5bln8LGScNcCrONQAAAABJRU5ErkJggg==";

  // Gets the current body of the message.
  mailItem.body.getAsync(Office.CoercionType.Html, (bodyResult) => {
    if (bodyResult.status === Office.AsyncResultStatus.Failed) {
      console.log(bodyResult.error.message);
      return;
    }

    // Inserts the Base64-encoded image to the beginning of the body.
    const options = { isInline: true, asyncContext: bodyResult.value };
    mailItem.addFileAttachmentFromBase64Async(base64String, "sample.png", options, (attachResult) => {
      if (attachResult.status === Office.AsyncResultStatus.Failed) {
        console.log(attachResult.error.message);
        return;
      }

      let body = attachResult.asyncContext;
      body = body.replace("<p class=MsoNormal>", `<p class=MsoNormal><img src="cid:sample.png">`);
      mailItem.body.setAsync(body, { coercionType: Office.CoercionType.Html }, (setResult) => {
        if (setResult.status === Office.AsyncResultStatus.Failed) {
          console.log(setResult.error.message);
          return;
        }

        console.log("Inline image added to the body.");
      });
    });
  });
}

  6. Speichern Sie Ihre Änderungen.

Aktualisieren der HTML-Datei für Befehle

  1. Öffnen Sie im Ordner ./src/commandscommands.html.

  2. Fügen Sie unmittelbar vor dem schließenden Headtag (</head>) einen Skripteintrag für den JavaScript-Code zur Ereignisbehandlung hinzu.

    <script type="text/javascript" src="../launchevent/launchevent.js"></script>

Wichtig

Die Außerkraftsetzungsfeatures der Schaltfläche "Nicht senden" und die Option "Sendemodus" befinden sich derzeit in Outlook für Mac in der Vorschauphase. Wenn Sie diese Features in Ihrem Add-In-Projekt testen, müssen Sie einen Verweis auf die Vorschauversion der Office JavaScript-API in Ihre commands.html-Datei einschließen.

<script type="text/javascript" src="https://appsforoffice.microsoft.com/lib/beta/hosted/office.js"></script>
<script type="text/javascript" src="../launchevent/launchevent.js"></script>
  1. Speichern Sie Ihre Änderungen.

Aktualisieren der Webpack-Konfigurationseinstellungen

  1. Öffnen Sie die webpack.config.js Datei im Stammverzeichnis des Projekts, und führen Sie die folgenden Schritte aus.

  2. Suchen Sie das plugins Array im config -Objekt, und fügen Sie dieses neue Objekt am Anfang des Arrays hinzu.

    new CopyWebpackPlugin({
  patterns: [
    {
      from: "./src/launchevent/launchevent.js",
      to: "launchevent.js",
    },
  ],
}),

  3. Speichern Sie Ihre Änderungen.

Probieren Sie es aus

  1. Führen Sie die folgenden Befehle im Stammverzeichnis Ihres Projekts aus. Wenn Sie ausführen npm start, wird der lokale Webserver gestartet (sofern er noch nicht ausgeführt wird), und Ihr Add-In wird quergeladen.

    npm run build

    npm start

    Hinweis

    Wenn Ihr Add-In nicht automatisch quergeladen wurde, befolgen Sie die Anweisungen unter Querladen von Outlook-Add-Ins zum Testen , um das Add-In in Outlook manuell querzuladen.

  2. Erstellen Sie in Ihrem bevorzugten Outlook-Client eine neue Nachricht, und legen Sie den Betreff fest. Fügen Sie im Textkörper Text hinzu. Beispiel: "Hier ist ein Bild des vorgeschlagenen Logos."

  3. Senden der Nachricht. Ein Dialogfeld wird angezeigt, in dem Sie aufgefordert werden, eine Anlage hinzuzufügen. Wählen Sie Nicht senden oder Anlage hinzufügen aus. Die verfügbare Option hängt davon ab, ob Sie den optionalen Schritt zum Anpassen der Schaltfläche "Nicht senden " implementiert haben.

    • Standardschaltfläche "Nicht senden ".

      Dialogfeld, in dem der Benutzer aufgefordert wird, der Nachricht eine Anlage hinzuzufügen.

    • Angepasste Schaltfläche "Anlage hinzufügen ".

      Dialogfeld mit einer angepassten Schaltfläche

    Hinweis

    Wenn Sie in unterstützten Versionen des klassischen Outlook unter Windows vor Version 2410 (Build 18031.15000) der Schaltfläche Nicht senden einen Aufgabenbereich zuweisen, wird durch Schließen des Dialogfelds auch der angegebene Aufgabenbereich geöffnet.

  4. Fügen Sie Ihrer Nachricht eine Anlage hinzu. Wenn Sie den optionalen Schritt zum Anpassen der Schaltfläche "Nicht senden " implementiert haben, verwenden Sie den Aufgabenbereich, um eine Anlage hinzuzufügen.

    Aufgabenbereich mit einer Option zum Hinzufügen einer Anlage.

  5. Senden Sie die Nachricht. Dieses Mal sollte es keine Warnung geben.

  6. Wenn Sie den lokalen Webserver beenden und das Add-In deinstallieren möchten, befolgen Sie die entsprechenden Anweisungen:

    • Führen Sie den folgenden Befehl aus, um den Server zu beenden. Wenn Sie verwendet haben npm start, sollte auch der folgende Befehl das Add-In deinstallieren.

      npm stop

    • Wenn Sie das Add-In manuell quergeladen haben, lesen Sie Entfernen eines quergeladenen Add-Ins.

Testen Sie das Überschreiben der Option "Sendemodus" zur Laufzeit (optional).

Wenn Sie den optionalen Schritt zum Überschreiben der Sendemodusoption zur Laufzeit implementiert haben, führen Sie die folgenden Schritte aus, um es auszuprobieren.

  1. Führen Sie im Stammverzeichnis Ihres Projekts aus npm start . Dadurch wird der lokale Webserver gestartet (sofern er noch nicht ausgeführt wird) und das Add-In querladen.

    Hinweis

    Wenn Ihr Add-In nicht automatisch quergeladen wurde, befolgen Sie die Anweisungen unter Querladen von Outlook-Add-Ins zum Testen , um das Add-In in Outlook manuell querzuladen.

  2. Erstellen Sie in Ihrem bevorzugten Outlook-Client eine neue Nachricht, und legen Sie den Betreff fest. Fügen Sie im Textkörper Text hinzu. Beispiel: "Hier ist ein Bild des vorgeschlagenen Logos."

  3. Wählen Sie im Menüband Contoso-Add-In>Aufgabenbereich anzeigen aus.

  4. Wählen Sie im Aufgabenbereich Inlinebild hinzufügen aus. Dem Nachrichtentext wird ein Bild hinzugefügt.

  5. Senden Sie die Nachricht. Es wird ein Dialogfeld angezeigt, in dem empfohlen wird, der Nachricht eine Kopie des Bilds anzufügen.

  6. Wählen Sie Trotzdem senden aus, um die Nachricht unverändert zu senden, oder wählen Sie Kopie anfügen aus, um vor dem Senden der Nachricht eine Kopie einzuschließen.

    Dialogfeld

Wichtig

Wenn ein Smart Alerts-Add-In, das die Außerkraftsetzungsfunktion implementiert, die Verarbeitung eines Ereignisses aufgrund eines Fehlers nicht abschließen kann oder nicht verfügbar ist, wenn das Ereignis auftritt, verwendet es die im Manifest angegebene Option für den Sendemodus.

Siehe auch