base64を使いメール内に添付した画像の拡張子が表示されない

Question

オーダーメイド商品のシュミレーションサイトを作成しております。

流れ
①canvasで描写したものをjavascriptのtoDataURLを使いdata url化(data:image/jpeg;base64,・・・の形)
②data urlをcontact formで作成したお問い合わせのinput hiddenに渡す input fileは使わない
③メールはHTML形式で画像は <img src="渡したdata url">の形で表示。

問題
メール内の画像は問題なく表示されており、保存もできるのですが拡張子が表示されません。
添付ファイルの部分には"embed0"という表示しかされておりません。
情報を見たらjegファイルとはきちんと認定されております。
保存した後のファイルにはきちんと拡張子は表示されます。

添付ファイルの部分にも拡張子をきちんと表示させる方法はありますでしょうか。

よろしくお願いします。

補足
PCの方で拡張子表示は設定しております。

canvasからデータURIを作成し、input hiddenに渡すコード

let AttachData = getCanvas.toDataURL("image/jpeg" , 0.70);
let newAttachData = AttachData;
document.getElementById("yourPicture").value = newAttachData;

サイトで描写したcanvasを画像化、
input fileを使用せずに自動的に画像が送れたら大丈夫です。
contact form限定という制約もありません。

Answer 1

phpでformを自作しましたら
ファイル名を指定できました。

$img = $_POST['yourPicture'];//取得したbase64コード

$file_path = $img;//取得したbase64コード

$file = "tie.jpg";//ファイル名指定

//添付ファイル設定
$body .= "Content-Type: application/octet-stream; name=\"{$file}\"\n";
$body .= "Content-Disposition: attachment; filename=\"{$file}\"\n";
$body .= "Content-Transfer-Encoding: base64\n";
$body .= "\n";
$body .= chunk_split(base64_encode(file_get_contents($file_path)));
$body .= "--__BOUNDARY__\n";