Meteor-files: Access Denied / 401 (Unauthorized) when trying to stream Image File

[nayayan]

Hi! I'm trying to stream (render) an image from my 'Images' FilesCollection but when I use the method '.link()' on 'imageFile' helper I got :

'GET localhost:3000/cdn/storage/Images/filename.png 401 (Unauthorized)'

Not sure what I'm doing wrong here...

[email protected]
[email protected]
ostrio:[email protected]

images.js (server) :

export const Images = new FilesCollection({

  storagePath() {
    return `${process.env.PWD}/uploads`;
  },

  collectionName: 'Images',
  chunkSize: 1024 * 2048,
  throttle: 1024 * 512,
  permissions: 0755,
  allowClientCode: true,
  cacheControl: 'public, max-age=31536000',

  onbeforeunloadMessage: function () {
    return 'Upload is still in progress! Upload will be aborted if you leave this page!';
  },

  onBeforeUpload: function (file) {
    // Allow upload files under 10MB, and only in png/jpg/jpeg formats
    // Note: You should never trust to extension and mime-type here
    // as this data comes from client and can be easily substitute
    // to check file's "magic-numbers" use `mmmagic` or `file-type` package
    // real extension and mime-type can be checked on client (untrusted side)
    // and on server at `onAfterUpload` hook (trusted side)
    if (file.size <= 10485760 && /png|jpg|jpeg/i.test(file.ext)) {
      if (this.userId) {
        if (Roles.userIsInRole(this.userId, 'admin')) {
          // Allow upload only if
          // current user is signed-in
          // and has role is `admin`
          return true;
        }
      } else {
        return 'Not enough rights to upload a file!';
      }

    } else {
      return 'Please upload image, with size equal or less than 10MB';
    }
  },

  onBeforeRemove: function () {
    if (this.userId) {
      if (Roles.userIsInRole(this.userId, 'admin')) {
        // Allow removal only if
        // current user is signed-in
        // and has role is `admin`
        return true;
      }
    }

    return false;
  },

  downloadCallback: function (fileObj) {
    if (this.params.query.download == 'true') {
      // Increment downloads counter
      Images.update(fileObj._id, { $inc: { 'meta.downloads': 1 } });
    }

    // Must return true to continue download
    return true;
  },

  protected: function (fileObj) {
    // Check if user is own this file
    if (fileObj.meta.owner === this.userId) {
      return true;
    } else {
      return false;
    }
  },
});

Images.collection.attachSchema(new SimpleSchema(Images.schema));

publication.js (server) :

Meteor.publish('files.images.all', function () {
  return Images.find().cursor;
});

user-hero-header.js (client) :

Template.User_hero_header.onRendered(function () {
  this.autorun(() => {
    this.subscribe('files.images.all');
  });
});

Template.User_hero_header.helpers({

  firstName() {
    return Meteor.user().profile.firstName;
  },

  imageFile: function () {
    return Images.findOne({ _id: Meteor.user().profile.avatar });
  },
});

user-hero-header.html (client) :

<template name="User_hero_header">
  <div class="row valign-wrapper">
    <div class="col s2">
      <img src="{{imageFile.link}}" alt="{{imageFile.name}}" class="circle responsive-img profile-pic">
    </div>
    <div class="col s10">
      <h1>Bienvenue {{ firstName }}</h1>
      <h2>#Montreal</h2>
      <p><a href="{{pathFor 'Edit_profile'}}">Modifier le profil</a></p>
    </div>
  </div>
  {{> Edit_profile_pic_modal }}
</template>

[dr-dimitru]

Hello @nayayan ,

The roots of the issue is in protected option. Try to remove it to test if it works.
Then debug what data is passed into protected to see what went wrong.

[nayayan]

Thanks for this ninja fast answer!! :D
It was exactly the problem.

[dr-dimitru]

@nayayan I'm glad it helped you :)

Please, support this project by:

• Star on GitHub
• Star on Atmosphere
• Share on Facebook and Twitter
• Donate via PayPal