mailto Link mit HTML-Body

319

Ich habe ein paar mailtoLinks in einem HTML-Dokument.

<a href="mailto:etc...">

Kann ich einen HTML-formatierten Text in den mailto:Teil von einfügen href?

<a href="mailto:[email protected]?subject=Me&body=<b>ME</b>">Mail me</a>

Beachten Sie, dass (2016) in iOS das Hinzufügen <i>und <b>Markieren für eine einfache kursive, fette Formatierung vollkommen in Ordnung ist .

html email mailto GxG
quelle
1
Hatte genau das Gleiche im Sinn und studierte es eine Weile. Ich habe versucht, eine eingebettete Fernbedienung <img> in den Nachrichtentext zu integrieren. Die mailto-Anweisung muss URL-codiert sein, damit sie funktioniert. Das Ergebnis von Thunderbird war, dass der HTML-Body mit all seinen <img> -Anweisungen und allem buchstäblich angezeigt wurde. Ich denke, dies ist ein Sicherheitsproblem bei Thunderbird und den meisten Mail-Clients. Sie analysieren eingehende Mail-Inhalte, damit keine verdächtigen Aktionen ausgeführt werden.
Hannes R.
4
Das Beste, was ich finden konnte, kam von dieser Seite, zaposphere.com/html-email-links-code . Unten finden Sie eine Liste: "Andere coole Anpassungen, die die meisten anderen Websites nicht erwähnen !!" Hat mir sehr geholfen.
Stu Andrews
Sie können jeden Teil einer E-Mail mit einfachem Text festlegen. In Bezug auf die Einschränkungen, dass eine HTML-Formatierung nicht möglich ist, ist hier ein Tool, das ich erstellt habe, um das Anpassen der verschiedenen Felder in einem Mailto
Dawson B

Antworten:

428

Wie Sie in RFC 6068 sehen können , ist dies überhaupt nicht möglich:

Der spezielle <hfname>"Körper" zeigt an, dass der zugeordnete <hfvalue> der Körper der Nachricht ist. Der Feldwert "body" soll den Inhalt für den ersten Text- / Klartextteil der Nachricht enthalten. Das Pseudo-Header-Feld "body" ist in erster Linie für die Erzeugung von Kurztextnachrichten für die automatische Verarbeitung vorgesehen (z. B. "Subscribe" -Nachrichten für Mailinglisten), nicht für allgemeine MIME-Body.

Alfonso Marin
quelle
4
@ JoeBlow Antwort ist immer noch korrekt. RFC 6068, der 2368 überholt, besagt immer noch, dass es sich bei dem Text um einfachen Text handelt.
Markus Laire
8
Wenn Sie von dieser Antwort enttäuscht sind, lesen Sie bitte weiter: stackoverflow.com/a/46699855/256272 (tl; dr .eml files)
Joe
94

Nein, das ist überhaupt nicht möglich.

QUentin
quelle
1
Nicht unbedingt wahr. Während die Unterstützung sehr knapp ist, haben andere Antworten gezeigt, dass in iOS und einer Kombination aus IE + ActiveX + Outlook (urgh, yuck) etwas eingeschränktes HTML möglich ist.
Simon East
89

Während es NICHT möglich ist, Ihren E-Mail-Text mit HTML zu formatieren, können Sie Zeilenumbrüche hinzufügen, wie zuvor vorgeschlagen.

Wenn Sie Javascript verwenden können, kann "encodeURIComponent ()" wie folgt von Nutzen sein ...

var formattedBody = "FirstLine \n Second Line \n Third Line";
var mailToLink = "mailto:[email protected]?body=" + encodeURIComponent(formattedBody);
window.location.href = mailToLink;
Oliver Pearmain
quelle
1
Können E-Mail-Clients eingebettetes Javascript ausführen? Das OP sagt, dass dies eine E-Mail ist, keine Webseite, auf der sich der mailto: -Link befindet.
wide_eyed_pupil
raw("text \n more text \n\n\t")
Vielen
Dies funktionierte für mich, indem ich von einem Chrome "mailto" an Outlook sendete. Beachten Sie, dass Sie nur den Textkörper codieren müssen, nicht die gesamte Mailto-Zeichenfolge. und Sie brauchen keine Leerzeichen vor / nach dem \n.
Luke
2
Ich mochte diesen Ansatz, hier ist eine jsfiddle, um ihn in Aktion zu sehen: jsfiddle.net/oligray/5uosngy4
Oliver Gray
3
Sie können% 0A auch nur für einen Zeilenumbruch verwenden, sodass Sie dies nicht über JavaScript tun müssen.
Dirk Boer
58

Ich habe dies verwendet und es scheint mit Outlook zu funktionieren, nicht mit HTML, aber Sie können den Text mit Zeilenumbrüchen formatieren, zumindest wenn der Text als Ausgabe hinzugefügt wird.

<a href="mailto:[email protected]?subject=Hello world&body=Line one%0DLine two">Email me</a>
Andy
quelle
2
"% 0D" ist also Newline. Was entspricht dem Code eines codierten Tabs?
wide_eyed_pupil
3
% 0D ist eine neue Zeile mit Strg-m, eine Registerkarte mit Strg-i mit% 09. Schauen Sie sich ein ASCII-Diagramm wie dieses an [ asciitable.com/index/asciifull.gif] . Die Steuerzeichen sind von 1 bis 31. @wide_eyed_pupil
Jim Bergman
2
Jede Signatur scheint dabei entfernt zu werden.
Valentin Despa
% 0A wäre \ n
Klemen Tušar
3
Das ist kein HTML-Body!
Chloe
46

Es ist nicht ganz das, was Sie wollen, aber es ist möglich, mit modernem Javascript eine EML-Datei auf dem Client zu erstellen und diese an das Dateisystem des Benutzers zu streamen, das eine umfangreiche E-Mail mit HTML in seinem E-Mail-Programm wie Outlook öffnen sollte:

https://stackoverflow.com/a/27971771/8595398

Hier ist eine jsfiddle einer E-Mail mit Bildern und Tabellen: https://jsfiddle.net/seanodotcom/yd1n8Lfh/

HTML

<!-- https://jsfiddle.net/seanodotcom/yd1n8Lfh -->
<textarea id="textbox" style="width: 300px; height: 600px;">
To: User <user@domain.demo>
Subject: Subject
X-Unsent: 1
Content-Type: text/html

<html>
<head>
<style>
    body, html, table {
        font-family: Calibri, Arial, sans-serif;
    }
    .pastdue { color: crimson; }
    table {
        border: 1px solid silver;
        padding: 6px;
    }
    thead {
        text-align: center;
        font-size: 1.2em;
        color: navy;
        background-color: silver;
        font-weight: bold;
    }
    tbody td {
        text-align: center;
    }
</style>
</head>
<body>
<table width=100%>
    <tr>
        <td><img src="http://www.laurell.com/images/logo/laurell_logo_storefront.jpg" width="200" height="57" alt=""></td>
        <td align="right"><h1><span class="pastdue">PAST DUE</span> INVOICE</h1></td>
    </tr>
</table>
<table width=100%>
    <thead>
        <th>Invoice #</th>
        <th>Days Overdue</th>
        <th>Amount Owed</th>
    </thead>
    <tbody>
    <tr>
        <td>OU812</td>
        <td>9</td>
        <td>$4395.00</td>
    </tr>
    <tr>
        <td>OU812</td>
        <td>9</td>
        <td>$4395.00</td>
    </tr>
    <tr>
        <td>OU812</td>
        <td>9</td>
        <td>$4395.00</td>
    </tr>
    </tbody>
</table>
</body>
</html>
</textarea> <br>
<button id="create">Create file</button><br><br>
<a download="message.eml" id="downloadlink" style="display: none">Download</a>

Javascript

(function () {
var textFile = null,
  makeTextFile = function (text) {
    var data = new Blob([text], {type: 'text/plain'});
    if (textFile !== null) {
      window.URL.revokeObjectURL(textFile);
    }
    textFile = window.URL.createObjectURL(data);
    return textFile;
  };

  var create = document.getElementById('create'),
    textbox = document.getElementById('textbox');
  create.addEventListener('click', function () {
    var link = document.getElementById('downloadlink');
    link.href = makeTextFile(textbox.value);
    link.style.display = 'block';
  }, false);
})();
Matthew
quelle
8
Nun, das ist eine ausgefallene Idee
Greg
2
Gute Idee, aber nur zur Veranschaulichung: In der neuesten Apple Mail wird diese Datei geöffnet, kann aber nicht bearbeitet / gesendet werden. Sie verhält sich wie eine gesendete E-Mail-Aufzeichnung
pmarreck
1
Mit Apple Mail (11.2) können Sie nach dem Öffnen der EML-Datei im Menü (Shift-Cmd-D) die Option Nachricht / Erneut senden auswählen, um die E-Mail in den Bearbeitungsmodus zu versetzen.
Jeff Collier
30

Einige Dinge sind möglich, aber nicht alle, zum Beispiel möchten Sie Zeilenumbrüche, anstatt die Verwendung zu <br />verwenden%0D%0A

Beispiel: 

<a href="mailto:?subject=&body=Hello,%0D%0A%0D%0AHere is the link to the PDF Brochure.%0D%0A%0D%0ATo view the brochure please click the following link: http://www.uyslist.com/yachts/brochure.pdf"><img src="images/email.png" alt="EMail PDF Brochure" /></a>
Stephen Kaufman
quelle
7
Das ist kein HTML ... immer noch Text.
Brad
nicht, wenn Sie Ihre E-Mail mit $ mailheader formatieren. = "Inhaltstyp: text / html; charset = iso-8859-1 \ r \ n";
Stephen Kaufman
12
@StephenKaufman - Sie sind nicht derjenige, der die E-Mail sendet, sondern die Kunden, die auf den Link klicken. Das heißt, Sie wissen nicht, wie der E-Mail-Client eingestellt ist. Sie wissen nicht, wie die Überschriften gesetzt sind. Dies funktioniert auf einigen E-Mail-Clients und auf anderen nicht.
Narxx
1
danke, dies war die zweitbeste Option für mich, wenn ich kein HTML kann, dann kann ich zumindest Wagenrücklauf machen. für mich in Ordnung.
Hamish
16

Es ist erwähnenswert, dass auf Safari auf dem iPhone, zumindest grundlegende HTML - Tags wie Einfügen <b>, <i>und <img>(was im Idealfall nicht mehr sowieso unter anderen Umständen verwendet werden soll, lieber CSS) in den Körper Parameter in dem mailto:erscheint Arbeit - sie werden im E-Mail-Client geehrt. Ich habe keine umfassenden Tests durchgeführt, um festzustellen, ob dies von anderen Kombinationen aus mobilen oder Desktop-Browsern / E-Mail-Clients unterstützt wird. Es ist auch zweifelhaft, ob dies wirklich standardkonform ist. Könnte jedoch nützlich sein, wenn Sie für diese Plattform bauen.

Wie bereits in anderen Antworten erwähnt, sollten Sie encodeURIComponent auch für den gesamten Text verwenden, bevor Sie ihn in den mailto:Link einbetten .

Andrew Ferrier
quelle
Ja, es funktioniert perfekt, um einfache fette, kursive Tags hinzuzufügen - in iOS sowieso.
Fattie
Unter iOS kann ich mit <img src = 'mybase64' /> keine korrekten E-Mails senden. In Google Mail wird base64 in meiner Nachricht angezeigt.
Vitaly Zdanevich
0

Ich habe das gleiche Problem beim Teilen von HTML. Ich mache unten HTML-Arbeit für mich. Ersetzen Sie <durch <&> durch>.

<a href="mailto:?subject=link Share&body=&lt;a href='www.google.com'&gt;google&lt;/a&gt;">Email</a>

Hinweis: Es funktioniert nur in Ubuntu. In Windows funktioniert es nicht.

Rajan Kashiyani
quelle
-1

Jeder kann Folgendes versuchen (die Mailto-Funktion akzeptiert nur Klartext, aber hier zeige ich, wie HTML-Innertext-Eigenschaften verwendet werden und wie ein Anker als Mailto-Body-Parameter hinzugefügt wird): 

//Create as many html elements you need.

const titleElement = document.createElement("DIV");
titleElement.innerHTML = this.shareInformation.title; // Just some string

//Here I create an <a> so I can use href property
const titleLinkElement = document.createElement("a");
titleLinkElement.href = this.shareInformation.link; // This is a url

...

let mail = document.createElement("a");

// Using es6 template literals add the html innerText property and anchor element created to mailto body parameter
mail.href = 
  `mailto:?subject=${titleElement.innerText}&body=${titleLinkElement}%0D%0A${abstractElement.innerText}`;
mail.click();

// Notice how I use ${titleLinkElement} that is an anchor element, so mailto uses its href and renders the url I needed
Miguel Ballén
quelle
-3

Es ist möglich, Unicode-Werte einzugeben, um Zeilenumbrüche einzufügen (dh :), \u0009aber HTML-Tags werden unterschiedlich unterstützt und sollten vermieden werden.

Ryan Dunphy
quelle
-11

Ich habe so gearbeitet:

var newLine = escape("\n");
var body = "Hello" + newLine +"World";

Ausgabe wäre:

Hello
World
Ravi Solanki
quelle