Javascript 将JPEG从html5画布保存到服务器时出现问题

我有一个图像加载到浏览器的HTML画布包装

<canvas id="image1" class="" width="213" height="213" style="width: 213px; height: 213px;"></canvas>

这是我的php

<?php
define('UPLOAD_DIR', 'images/');
$img = $_POST['imgBase64'];
$img = str_replace('data:image/png;base64,', '', $img);
$img = str_replace(' ', '+', $img);
$data = base64_decode($img);
$file = UPLOAD_DIR . uniqid() . '.png';
$success = file_put_contents($file, $data);
echo $file;
?>

如果图像是png文件，则重定向有效，但如果是JPEG，则返回到同一页面

如果我在ajax调用之前提醒'dataURL'，它将返回一个数组，第一部分为'data:image/png；base64'无论文件扩展名是什么类型

---

我对base64的知识还不够了解，无法理解这一点。

由于javascript是异步的，ajax在文件上传完成之前就启动了，这就是它失败的原因

使用此代码示例从字符串创建图像，这将解决此问题

imagecreatefromstring($n) then imagejpeg($r,$y) or imagepng($r,$y);

及

---

文件扩展名不会更改文件类型。即使你称它为

foo.jpg

它仍然是一个PNG，它是一个不同的图像和不同的文件类型，我认为它可能与文件大小有关。如果你不向我们展示失败的代码，我们很难帮助你。上面只保存了一个png，而不是jpg。看看您当前的代码，这个答案没有什么意义，因为实际上是ajax上传了文件？在请求完成之前，

done（）

-promise不会执行。

imagecreatefromstring($n) then imagejpeg($r,$y) or imagepng($r,$y);

imagedestroy($r);