文件上传查询

Posted 2023-02-23

【中文标题】文件上传查询

【英文标题】：Query Regarding File Upload

【发布时间】：2016-12-11 12:08:26

【问题描述】：

我正在使用“文件上传”控件和 C# 编码（后端）在我的 Web 应用程序中上传文件（.jpeg/.png/.pdf）。 通过此控件上传的文件应保存在服务器中。 一切正常，但我面临的问题是当保存 xlsx 或 doc 的文件类型并将该文件的扩展名更改为 .png 或 .jpeg 并且正在上传时，它正在上传到服务器而没有任何错误.

当我尝试在服务器中打开该图像或 pdf 文件时，它通常会显示无法打开文件的错误消息。

我已经完成了扩展验证，但在这种情况下它没有显示任何效果。

谁能帮我解决这个问题。（C#编码或Jquery或javascript都可以）

【问题讨论】：

请添加一些您尝试过的代码

***.com/questions/36910291/… ... php.net/manual/en/function.exif-imagetype.php ... 等等...只是为了得到一个想法。

【参考方案1】：

编辑、更新

但我的问题是扩展名是正确的，我需要上传 但文件类型不是我的意思是可以保存一个excel表 扩展jpeg

您可以使用FileReader、.readAsBinaryString() 来检查文件头；例如，JFIF 代表 .jpeg，.jpg； PNG 为.png； PDF 为.pdf； RegExp.prototype.test() 与 RegExp /JFIF|PNG|PDF/

---

在<input type="file"> 元素中使用accept 属性并将值设置为".jpeg,.jpg, .png,.pdf" 以排除扩展名不是.jpeg、.jpg、.png 或.pdf 的文件，使其无法被用户选择在Choose File 对话框中。

document.querySelector("input[type=file]")
  .addEventListener("change", function(e) 
    console.log(e.target.files[0].type);
    var reader = new FileReader();
    reader.onload = function(event) 
      console.log(event.target.result
                  , /JFIF|PNG|PDF/.test(event.target.result))
    
    reader.readAsBinaryString(e.target.files[0])
  )

<input type="file" accept=".jpeg,.jpg,.png,.pdf" />

【讨论】：

感谢您的回复我明白了您所说的但我的问题是扩展名是我需要上传的正确扩展名但文件类型不是我的意思是可以使用扩展名保存 Excel 工作表jpeg 但你无法使用任何图像查看器或绘图打开它即使我们使用这种类型的验证，也会上传相同的文件

@BhanuPrakash 您可以使用FileReader、.readAsBinaryString 来检查文件头，请参阅更新后的帖子。

【参考方案2】：

你能告诉我们你的验证是什么样子的吗？！ 有两种方法可以检查您正在上传的文件的扩展名。应该是这样的：

//In your aspx file :
<asp:FileUpload ID="FileUploadControl" runat="server"/>
<asp:Button runat="server" id="Btn_Upload" text="Upload" onclick="Btn_Upload_Click" />

//In your aspx.cs file :
// First soluce
protected void Btn_Upload_Click(object sender, EventArgs e)

     if (FileUploadControl.PostedFile.ContentType != "application/pdf")
     
          //Not an PDF
     


// Second soluce :
protected void Btn_Upload_Click(object sender, EventArgs e)

     string extension = Path.GetExtension(FileUploadControl.PostedFile.FileName);
     if (extension != ".pdf")
     
          //Not an PDF
     
 

当然，在这些代码示例中，您可以添加 JPEG / PNG / ... 的例外情况。

【讨论】：

我使用了第二种验证方式。但这里的问题是扩展名将是 .pdf 或 .jpeg ，但内容是另一种类型，如 excel 所以它没有验证扩展名是正确的..

【参考方案3】：

以下是最终如何使用“标题代码”获得我需要的验证：

 System.IO.BinaryReader r = new System.IO.BinaryReader(FileUpload1.PostedFile.InputStream);
                                string fileclass = "";
                                byte buffer;
                                try
                                
                                    buffer = r.ReadByte();
                                    fileclass = buffer.ToString();
                                    buffer = r.ReadByte();
                                    fileclass += buffer.ToString();
                                
                                catch
                                
                                
                                r.Close();
                                if (fileclass != "3780" || fileclass != "255216" || fileclass != "13780")    /*Header codes (3780-PDF);(255216-JPG,JPEG);(13780-PNG)*/
                                  
                                    /*Your code goes here(things to do with the file uploaded)*/
                                  

要获取其他文件格式的值，请尝试上传文件并设置断点并获取标头代码。

【参考方案4】：

图片格式有很多种，比如webp为什么不都支持呢？ 您可以在使用画布上传它们之前将它们转换为客户端...

function convertImage(image, mimetype, quality) 
  return new Promise(function(resolve)
    var canvas = document.createElement('canvas')
    canvas.width = image.width
    canvas.height = image.height
    canvas.getContext("2d").drawImage(image, 0, 0)
    canvas.toBlob(resolve, mimetype, quality)
  )


if(input.files[0].type === 'application/pdf') 
  // upload directly (not a image)
 else 
  var img = new Image
  img.onerror = function()  /* not an image */
  img.onload = function() 
    convertImage(img, 'image/png', 1).then(function(blob)
      // upload the converted image
      fetch('upload', method: 'POST', body: blob)
    )
  
  img.src = URL.createObjectURL(input.files[0])

然后你用它来帮助过滤掉你想要的接受的文件

<input type="file" accept="application/pdf, image/*">