一些替代方案

Question

当检查app / public目录中是否存在文件时，此Meteor客户端代码无法返回true。

在下面的浏览器控制台中使用时，会返回sum(unlist(l)) undefined或
utility.isFileExist('http://localhost:3000/abc.gif')

为什么要现在修复它？感谢

utility.isFileExist('http://localhost:3000/public/abc.gif')

根据评论进行修改 请参阅此代码

//client/lib.js

utility = (function() {
  return {
    isFileExist: (url) => {
      $.get(url)
        .done(function() {
          return true;
        }).fail(function() {
          return false;
        })
    }
  }
})();

Answer 1

首先，让我们弄清楚出了什么问题：

您发布的utility代码不起作用，因为XHR是异步的，因此您无法使用ES5中的同步操作（例如赋值）获取其值。

围绕定义的IIFE是多余的。 isFileExist方法本身不会返回任何内容，如果是，那将是请求的jqXHR对象，它不会为您提供在调用时查找的数据。

另一个问题是，Meteor通常会针对未明确绑定到其他响应的任何URL响应页面的HTML。这意味着请求在技术上会成功（200 OK响应代码，而不是您可能预期的响应），因此在这种情况下也不会调用fail回调。

使用响应content-type标头可以是一种合理的方法，可以确定结果是文件还是HTML文档。

您可以执行以下操作：

utility = {
  doesFileExist(name, cb) {
    $.get(name).done((data, status, request) => {
      const isHtml = request.getResponseHeader('content-type') === 'text/html; charset=utf-8';
      cb(!isHtml);
    })
  }
};


// call it with file name and a callback
utility.doesFileExist('foo.png', (doesExist) => {
  if (!doesExist) {
    // do something if file does not exist
  }
});

它将独立运行，但不允许您在模板助手中使用它。您可以使用跟踪请求状态的ReactiveDict，但这会给代码增加很多复杂性。

这一切的另一个缺点是，您为要检查的每个文件调用服务器额外的时间。

一些替代方案

每个<img>代码都应具有alt属性。如果图像丢失，则显示alt文本，但这不是很美观。

幸运的是，img标记在无法加载图片时触发了error事件，因此您可以使用它来隐藏图片或执行其他操作。

Template.foo.events({
  'error img': function(e) {
    $(e.target).hide(); //or something else
  }
});

另外，您应该知道public文件夹中存在哪些图像，因为它们是在编译时静态复制和提供的。

重要的是要解释你想在问题中完成什么，而不仅仅是问“我该如何做XY？” （因为答案的第一部分在你的情况下不是很有用）。

检查Meteor公共目录中是否存在文件

1 个答案:

一些替代方案