Joh*_*ton 13 javascript meteor meteor-helper collectionfs
我正在尝试如何获取Image(使用CollectionFS的文件)并将Image的Id插入到我的Items imageId字段中:
LIB /收藏/ items.js
Items = new Mongo.Collection("items");
Items.attachSchema(new SimpleSchema({
name: {
type: String,
label: "Name",
},
userId: {
type: String,
regEx: SimpleSchema.RegEx.Id,
autoform: {
type: "hidden",
label: false
},
autoValue: function () { return Meteor.userId() },
},
image: {
type: String,
optional: true,
autoform: {
label: false,
afFieldInput: {
type: "fileUpload",
collection: "Images",
label: 'Select Photo',
}
}
},
imageId: {
type: String
}
}));
Run Code Online (Sandbox Code Playgroud)
LIB /收藏/ images.js
if (Meteor.isServer) {
var imageStore = new FS.Store.S3("images", {
accessKeyId: Meteor.settings.AWSAccessKeyId,
secretAccessKey: Meteor.settings.AWSSecretAccessKey,
bucket: Meteor.settings.AWSBucket,
});
Images = new FS.Collection("Images", {
stores: [imageStore],
filter: {
allow: {
contentTypes: ['image/*']
}
}
});
}
// On the client just create a generic FS Store as don't have
// access (or want access) to S3 settings on client
if (Meteor.isClient) {
var imageStore = new FS.Store.S3("images");
Images = new FS.Collection("Images", {
stores: [imageStore],
filter: {
allow: {
contentTypes: ['image/*']
},
}
});
}
Run Code Online (Sandbox Code Playgroud)
现在我的允许规则是:
服务器/ allows.js
Items.allow({
insert: function(userId, doc){return doc && doc.userId === userId;},
update: function(userId, doc){ return doc && doc.userId === userId;},
remove: function(userId, doc) { return doc && doc.userId === userId;},
})
Images.allow({
insert: function(userId, doc) { return true; },
update: function(userId,doc) { return true; },
remove: function(userId,doc) { return true; },
download: function(userId, doc) {return true;},
});
Run Code Online (Sandbox Code Playgroud)
我正在使用Autoform,所以我的表单看起来像这样:
客户机/ item_form.html
<template name="insertItemForm">
{{#autoForm collection="Items" id="insertItemForm" type="insert"}}
{{> afQuickField name="name" autocomplete="off"}}
{{> afQuickField name="image" id="imageFile"}}
<button type="submit">Continue</button>
{{/autoForm}}
</template>
Run Code Online (Sandbox Code Playgroud)
现在,当我选择浏览并选择一个图像时,它将存在于数据库中,我想把_id它带到并将其放置在Item之后创建的图像中,但是如何获取该特定图像?我认为这是引用图像的好方法.
更新1
找出文件被选中后实际隐藏的ID:
<input type="hidden" class="js-value" data-schema-key="image" value="ma633fFpKHYewCRm8">
Run Code Online (Sandbox Code Playgroud)
所以我试图让ma633fFpKHYewCRm8被置于一个String在ImageId.
更新2
也许一种方法是使用FS.File Reference?
我已经更简单地解决了同样的问题,插入文件后,我只需调用一个执行相关集合更新的方法:
客户端.html
<template name="hello">
<p>upload file for first texture: <input id="myFileInput1" type="file"> </p>
</template>
Run Code Online (Sandbox Code Playgroud)
库.js
var textureStore = new FS.Store.GridFS("textures");
TextureFiles = new FS.Collection("textures", {
stores: [textureStore]
});
Textures = new Mongo.Collection("textures");
Run Code Online (Sandbox Code Playgroud)
客户端.js
Template.hello.events({
'change #myFileInput1': function(event, template) {
uploadTextureToDb('first',event);
}
});
function uploadTextureToDb(name, event) {
FS.Utility.eachFile(event, function(file) {
TextureFiles.insert(file, function (err, fileObj) {
// Inserted new doc with ID fileObj._id, and kicked off the data upload using HTTP
console.log('inserted');
console.log(fileObj);
//after file itself is inserted, we also update Texture object with reference to this file
Meteor.call('updateTexture',name,fileObj._id);
});
});
}
Run Code Online (Sandbox Code Playgroud)
服务器.js
Meteor.methods({
updateTexture: function(textureName, fileId) {
Textures.upsert(
{
name:textureName
},
{
$set: {
file: fileId,
updatedAt: Date.now()
}
});
}
});
Run Code Online (Sandbox Code Playgroud)
当您使用 autoForm 和 simpleSchema 时,它可能不是那么容易,但我建议您首先忘记 autoForm 和 simpleSchema 并尝试使其与简单的 html 和默认集合一起使用。
一切正常后,您可以返回设置这些内容,但请注意,涉及 CollectionFS 时可能会出现更多问题,尤其是涉及 autoForm 生成的样式时。