hrefを使用して電子メールの本文にイメージを追加

Question

私は一度クリックすると、電子メールクライアントを開く私のページにリンクがあります。 私のコードは以下の通りです：

<a href="mailto:?subject=Testing&body=AttachImage"> 

私の質問は、私は電子メールの本文に画像を追加する方法です。イメージsrcを試しましたが、動作しません。助言がありますか？

Answer 1

<a>タグ内にその画像を追加します。

<a href="mailto:?subject=Testing"> 
    <img src="your image path"> 
</a> 

希望します。

Answer 2

imgの幅と高さを定義していない可能性があります。

img{ 
 
    width:100px; 
 
    height:100px; 
 
}

<a href="mailto:?subject=Testing&body=AttachImage"> 
 
<img src = "https://source.unsplash.com/random"> 
 
</a>

Answer 3

あなたのイメージは以下のように定義されていると仮定します。

<img id="myimage" src="http://www.myserver.com/images/myimage"></img> 

そして、あなたはメールでお送りしたいと、ここでエンコードされたそれと同等のbase64：

<img id="b64" src=""></img> 

次のようなbase64エンコード形式を使用できます。

function getBase64Image() { 
    //return LOGO; 
    var dataURL = ''; 
    try { 
    var img = document.getElementById('myimage'); 
    // Create an empty canvas element 
    var canvas = document.createElement("canvas"); 
    canvas.width = img.width; 
    canvas.height = img.height; 

    // Copy the image contents to the canvas 
    var ctx = canvas.getContext("2d"); 
    ctx.drawImage(img, 0, 0); 

    // Get the data-URL formatted image 
    // Firefox supports PNG and JPEG. You could check img.src to guess the 
    // original format, but be aware the using "image/jpg" will re-encode the image. 
    dataURL = canvas.toDataURL("image/jpg"); 
    } 
    catch(e) { 
    console.log('Could not retrieve Base64 image with userAgent : ' + navigator.userAgent + ' \nException : ' + e); 
    } 
    return dataURL; 

} 

var base64Image = getBase64Image(); 

そしてあなたのimg SRC設定：[本文に画像をHTMLページからメールを送信する]の

document["b64"].src = base64Image ;