在得到答案之前：您永远不能信任客户端上传的数据-您必须始终使用用户无法访问的流程（后端流程）进行验证/转换，以确保数据的有效性：即使有适当的机制来验证接收到的网络请求是否来自您站点上经过身份验证的用户，任何用户仍然可以使用开发人员工具来执行任意JavaScript，并发送任何类型的网络请求以及他们想要的任何有效负载。
关于iOS设备和从文件输入获取JPEG而不是HEIF：你不需要自己做这些-iOS可以为你做。
<input type="file">元素支持accept属性，该属性可用于限制可上载的文件媒体类型的种类：更多信息请参阅MDN文档文章中关于<input type="file">的 * 限制可接受的文件类型 * 部分。
下面的示例显示了如何使用该属性。当iOS用户选择输入时，他们可以选择使用相机拍摄照片或从照片库中选择一张照片。在这两种情况下，iOS将自动执行必要的JPEG文件转换（例如，即使从照片库中选择的图像是HEIF格式）。当您在iOS设备上尝试使用HEIF编码的图像时，该示例演示了这一点：

const input = document.getElementById('image-upload');
const output = document.getElementById('output');

const updateDisplayedFileInfo = () => {
  const file = input.files?.[0];

  if (!file) {
    output.textContent = 'No file selected';
    return;
  }

  const dateModified = new Date(file.lastModified).toISOString();
  const {name, size, type} = file;

  const data = {
    dateModified,
    name,
    size,
    type,
  };

  const json = JSON.stringify(data, null, 2);
  output.textContent = json;
};

input.addEventListener('change', updateDisplayedFileInfo);
updateDisplayedFileInfo();

pre { background-color: hsla(0, 0%, 50%, 0.1); padding: 0.5rem; } code { font-family: monospace; }

<input id="image-upload" type="file" accept="image/jpeg" />
<pre><code id="output"></code></pre>

通过在终端中运行以下命令安装heic2jpeg库：

npm install heic2jpeg

将heic2jpeg库导入React组件：

import heic2jpeg from 'heic2jpeg';

通过调用heic2jpeg库的convert方法并将HEIC文件作为参数传入，将HEIC文件转换为JPG：

const jpegData = await heic2jpeg.convert(heicFile);

然后，您可以使用jpegData创建一个新的JPG文件或在img元素中显示它：

const jpegFile = new File([jpegData], 'image.jpg', { type: 'image/jpeg' });

// or

const imageElement = document.createElement('img');
imageElement.src = URL.createObjectURL(jpegFile);
document.body.appendChild(imageElement);

注意，heic2jpeg库要求canvas和process模块在全局上下文中可用，因此您可能也需要在应用程序中包含这些模块。