1

这些天我是一名服务器端开发人员，正在学习纯 JS 的技巧。我正在研究的一个实际例子是图像处理。

这个问题是关于探索如何支持加载（在纯 JS 中）类型为RIFF (little-endian) data. 有关该文件类型的更多信息在这里。

例如，如果将这样的文件类型呈现给以下代码，则它永远不会加载和onerror触发：

    var fr = new FileReader();//supported
    fr.onload = function(){
      var dataURL = fr.result;
      img.onload = function()  {console.log('success')}
      img.onerror = function () {console.log('error')}
      img.src = dataURL;
    }
    fr.readAsDataURL(src_img);//supported

此外，如果通过 分析文件头readAsArrayBuffer，则返回的头签名是52494646（这既不是 PNG、GIF 也不是 JPEG）。更有趣的是，我尝试上传一个示例 .avi 视频文件（也是 RIFF 格式）。这同样具有相同的标头签名。

也就是说，通过header分析我无法判断它是否是一个图像文件。

我的问题是：是否有任何解决方法支持通过纯 JS 处理这些图像，还是不可能？我的意思是调整大小并随后通过processingAJAX 请求发送有效负载。

我问这个是因为作为服务器端开发人员，我习惯于使用 Python 的 PIL 库将这些照片上传到服务器上，而RIFF 图像文件在那里可以完美地工作。JS 实现有什么不同，我该如何克服它？很想找出这一切背后的技术细节，并且需要一个说明性的例子。

如果有必要，以下是我分析文件头的方式：

function validate_file(e) {
  var header = "";
  var arr = new Uint8Array(e.target.result);
  for(var i = 0; i < arr.length; i++) {
     header += arr[i].toString(16);
  }
  switch (header) {
    case "89504e47":    
       // process PNG
    break;
    case "47494638":
       // process GIF
    break;
    case "ffd8ffe0":
    case "ffd8ffe1":
    case "ffd8ffe2":
    case "ffd8ffe3":
    case "ffd8ffe8":
    case "ffd8ffdb":
       // process JPEG
    break;
    default:
       // throw error
    break;
    }
}
4

0 回答 0