0

到目前为止,我在我的 Meteor 项目中加载文件选择器包时运气不佳。

我做了什么:

$cd ~/myMeteorProject
$mrt add filepicker
>>>Done installing smart packages
$head smart.json
>>>{
  "packages": {
  "router": {},
  "filepicker": {}
 }
}
$mrt
>>>Stand back while Meteorite does its thing

Done installing smart packages

Ok, everything's ready. Here comes Meteor!

[[[[[ ~/myMeteorProject ]]]]]

=> Meteor server running on: http://localhost:3000/

所以在这一点上,一切看起来都像我预期的那样。(我什至仔细检查了 filepicker 包的内容,它包含了我所期望的所有内容,要加载的源具有与 filepicker.io 网站上相同的 URL,等等)

但是,当我尝试运行以下命令时(从 coffeescript 编译):

if (Meteor.isClient) {
   Meteor.startup(function() {
   return filepicker.setKey('A9FiXXdu5RB^GYujfDPwlz'); //not my actual key, don't worry
 });}

我得到:未捕获的 ReferenceError:未定义文件选择器

所以,这有点令人遗憾。有任何想法吗?我尝试删除并重新添加咖啡脚本和文件选择器。有一些加载顺序问题吗?我注意到如果脚本无法加载,filepicker-load.js 会发出警报,但我没有看到...

4

3 回答 3

2

我遇到了完全相同的问题,对我来说,既没有将它包装在 asetTimeout()也没有setInterval()工作。

Ink 自己在他们的文档中提供了一个很棒的非阻塞脚本,它将所有文件选择器调用排队,直到它完全加载,然后按照它们被调用的顺序执行它们。这是它的工作原理:

  1. mrt remove filepicker(如果添加)
  2. mrt remove loadpicker(如果添加)
  3. 创建新文件/lib/filepicker.js

/lib/filepicker.js

if (Meteor.isClient) {
    (function(a) {
        if (window.filepicker) {
            return
        }
        var b = a.createElement("script");
        b.type = "text/javascript";
        b.async = !0;
        b.src = ("https:" === a.location.protocol ? "https:" : "http:") + "//api.filepicker.io/v1/filepicker.js";
        var c = a.getElementsByTagName("script")[0];
        c.parentNode.insertBefore(b, c);
        var d = {};
        d._queue = [];
        var e = "pick,pickMultiple,pickAndStore,read,write,writeUrl,export,convert,store,storeUrl,remove,stat,setKey,constructWidget,makeDropPane".split(",");
        var f = function(a, b) {
            return function() {
                b.push([a, arguments])
            }
        };
        for (var g = 0; g < e.length; g++) {
            d[e[g]] = f(e[g], d._queue)
        }
        window.filepicker = d
    })(document);
    filepicker.setKey(YOUR_FILEPICKER_KEY);
}

此客户端代码是从https://developers.inkfilepicker.com/docs/web/获取的非阻塞加载程序的香草版本。使用它,您可以设置一次密钥,然后根据需要使用文件选择器,而不必担心它是否已经加载。

当然你也可以用这个来修改 loadpicker,只需将这段代码粘贴到你的 loadpicker.js 中

加载选择器.js

loadPicker = function(key) {
    (function(a) {
        if (window.filepicker) {
            return
        }
        var b = a.createElement("script");
        b.type = "text/javascript";
        b.async = !0;
        b.src = ("https:" === a.location.protocol ? "https:" : "http:") + "//api.filepicker.io/v1/filepicker.js";
        var c = a.getElementsByTagName("script")[0];
        c.parentNode.insertBefore(b, c);
        var d = {};
        d._queue = [];
        var e = "pick,pickMultiple,pickAndStore,read,write,writeUrl,export,convert,store,storeUrl,remove,stat,setKey,constructWidget,makeDropPane".split(",");
        var f = function(a, b) {
            return function() {
                b.push([a, arguments])
            }
        };
        for (var g = 0; g < e.length; g++) {
            d[e[g]] = f(e[g], d._queue)
        }
        window.filepicker = d
    })(document);
    filepicker.setKey(key)
};

希望这对你有用!

于 2013-09-10T10:57:39.610 回答
1

您的语法看起来不错,并且与我在应用程序中使用的语法相匹配 - 我认为由于 filepicker 通过注入脚本元素来加载脚本,因此您有时间问题(在加载脚本之前调用 setKey)

可能会推迟设置密钥,直到用户执行某些操作,例如

filepicker.setKey("KEY");
filepicker.pickAndStore({...},function(error){...});

或将其设置为超时

Meteor.setTimeout(function(){
  filepicker.setKey("KEY");
},1000);

您还可以使用间隔来检查是否需要(更容忍较长的加载时间) - 您可以调整它以在一定时间后放弃

var filepickerInterval = Meteor.setInterval(function(){
   if(filepicker){
     Meteor.clearInterval(filepickerInterval);
     filepicker.setKey("KEY");
   }
}, 100);
于 2013-06-20T18:36:36.760 回答
0

您还可以使用异步 javascript 片段自动排队调用文件选择器对象,直到脚本加载。请参阅https://developers.inkfilepicker.com/docs/web/#javascript

于 2013-06-20T20:36:50.317 回答