Javascript 关于文件上载的查询

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

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

我已经做了扩展验证，但在本例中它没有显示任何效果

有人能帮我解决这个问题吗？（C#编码、Jquery或javascript都可以）

编辑、更新

但我的问题是扩展是一个适当的，我需要上传 但是文件类型不是我的意思是excel表格可以用 扩展jpeg

您可以使用

FileReader

，

.readAsBinaryString（）

检查文件头；e、 g，

JFIF

用于

.jpeg

，

.jpg

PNG

用于

.PNG

<代码>PDF用于

.PDF

RegExp.prototype.test（）


使用值设置为
.jpeg、.jpg、.png、.pdf“
的
元素上的
accept
属性来排除扩展名不是
.jpeg
、
.jpg
、
.png
或
.pdf
的文件


document.querySelector（“输入[type=file]”）
.addEventListener（“更改”，功能（e）{
console.log（e.target.files[0].type）；
var reader=new FileReader（）；
reader.onload=函数（事件）{
console.log（event.target.result
，/JFIF | PNG | PDF/.test（event.target.result））
}
reader.readAsBinaryString（e.target.files[0]）
})
您能告诉我们您的验证是什么样子吗？！
有两种方法可以检查正在上载的文件的扩展名。应该是这样的：

//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
     }
 }

//在您的aspx文件中：
//在您的aspx.cs文件中：
//第一溶剂
受保护的无效Btn\u上载\u单击（对象发送者，事件参数e）
{
if（FileUploadControl.PostedFile.ContentType！=“application/pdf”）
{
//不是PDF
}
}
//第二个解决方案：
受保护的无效Btn\u上载\u单击（对象发送者，事件参数e）
{
字符串扩展名=Path.GetExtension（FileUploadControl.PostedFile.FileName）；
如果（扩展名！=“.pdf”）
{
//不是PDF
}
}

当然，在这些代码示例中，您可以为JPEG/PNG/…
添加例外，下面是如何最终使用“头代码”获得所需的验证：

要获取其他文件格式的值，请尝试上载文件并设置断点并获取标题代码。
有许多图像格式，例如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/*">


请添加一些您尝试过的代码。。。等等我只是想了解一下，我使用了第二种验证方法。但这里的问题是扩展名只能是.pdf或.jpeg，但内容是另一种类型，如excel，因此无法验证扩展名是否正确。谢谢您的回复，我明白了您的意思，但我的问题是扩展名是正确的，我需要上传，但文件类型不是。我的意思是，excel工作表可以与扩展名jpeg，但您无法使用任何图像查看器打开它，或者在上载同一文件时绘制它，即使我们使用这种类型的validation@BhanuPrakash您可以使用
FileReader
，
.readAsBinaryString
检查文件头，请参阅更新的帖子。
<input type="file" accept="application/pdf, image/*">