je voyais un problème semblable à ce que vous avez décrit. Quand je télécharger une image et l'afficher immédiatement, initialement seulement une partie de celui-ci montre. Je vais aller dans ce que j'ai trouvé et j'espère que ça aide.
J'ai constaté que cela se produisait uniquement lorsque j'utilisais une fonction transformWrite: personnalisée dans CollectionFS. Ce que je crois est en train de se produire, il y a une condition de concurrence qui amène les fonctions image.isUploaded() et image.hasStored() à retourner true avant que GraphicsMagick n'ait fini d'écrire le fichier entier. L'image partiellement traitée est ensuite demandée et mise en cache par le serveur Web. Comme vous l'avez dit, parfois, lorsque vous actualisez, l'image sera entièrement chargée.
À titre d'exemple:
URL de votre avatar qui affiche une image partiellement traitée: http://yourdomain.com/cfs/files/images/Bun5qheJDeaZDp5Mf/DSC_5498.JPG?&store=images
Ajouter un param faux de requête pour contourner le cache, et l'image complète doit être affichée: http://yourdomain.com/cfs/files/images/Bun5qheJDeaZDp5Mf/DSC_5498.JPG?&store=images& buste = cache
Ce que j'ai fini par faire était de définir une valeur supplémentaire sur le modèle qui a été déclenché à chaque fois que l'image a été traitée. Voici un exemple de fonction gm pour traiter une image. Une fois la fonction terminée, une autre fonction s'appelle "finishedProcessing" qui définit la valeur sur le modèle.
Exemple de code:
gm(readStream, fileObj.name())
.resize(1000).quality(75)
.stream(function(err, stdout, stderr) {
if (err) {
return err;
}
stdout.pipe(writeStream);
// Update value when processing is finished
stdout.on('end', function(){
finishedProcessing(fileObj._id);
});
});
Vous pouvez alors saisir la valeur de image.finishedProcessing avant d'afficher l'image:
avatarReady: function(){
if(this.profile && this.profile.images){
var image = Images.findOne(this.profile.images[0]._id);
return image && image.isUploaded() && image.hasStored("images") && image.finishedProcessing;
}
}
Cela semblait assez bien pour moi. Même si vous n'utilisez pas GraphicsMagick, une condition similaire peut se produire lors du traitement ou de l'enregistrement du fichier. En outre, sur une note de côté, je crois que vous devez appeler "image.isUploaded()" au lieu de "image.isUploaded" dans votre fonction d'assistance pour obtenir la bonne valeur retournée. MISE À JOUR: D'un autre côté, j'ai trouvé qu'après refactoring si vos paramètres de collection ne sont pas définis sur Autoriser la mise à jour, seul le premier segment de l'image sera sauvegardé et il peut également causer le problème que vous êtes. voyant.
Images.allow({
update: function(userId, file, fields, modifier) {
// This is to check whether or not CollectionFS is trying
// to update the Image
var validCFSUpdate = _.intersection(fields, ['chunkSize', 'chunkCount', 'chunkSize']).length > 0
// Only allow logged in users and CollectionFS to update the Image
return userId && validCFSUpdate;
}
});
