javascript - 在 TypeScript 或 JavaScript 中过滤图像

Question

我正在制作一个表单来获取应用程序网络中的用户数据，我可以在其中通过输入文件添加头像。这个过滤带有图像扩展名的文件，但我担心的是我是否可以用 script 创建一个文件并给它一个 .jpg 扩展名。

我可以分析的图像

const reader = new FileReader();
    reader.onload = (event: any) => {
      console.log(event);
      this.avatarUrl = event.target.result;
      console.log(this.avatarUrl);
    };
    reader.readAsDataURL(this.avatarSelected);

但是我找不到任何东西 区分真实图像和隐藏的脚本。

感谢您的回答。

Answer 1

如果我理解:你想检测文件是否是图像。

特别是在重命名为 script.jpg 的 script.js 文件的情况下，您希望将其检测为不是图像。

方法是:

1. 创建图像元素。
2. 载入
3. 错误拒绝/成功解决

4. 添加超时:如果它在 X 秒后没有加载，将 url 更改为假 url 以停止加载。

   function testImage(url) {
   
       return new Promise((resolve, reject) => {
         let timer;
         const image = new Image();
         image.onerror = image.onabort = () => {
             clearTimeout(timer);
             reject("error");
         };
         image.onload = function() {
              clearTimeout(timer);
              resolve("success");
          };
          timer = setTimeout(function() {
             img.src = "fakeUrl"; // stop loading
             reject("timeout");
          }, 3000); 
          img.src = url;
       });
   }