【问题标题】:Unable to recognise deletion of profile image and show gravatar无法识别删除个人资料图像并显示 gravatar
【发布时间】:2017-05-30 04:51:06
【问题描述】:

我正在使用 Meteor 和 Cloudinary 来显示上传和显示个人资料图片。

问题 删除个人资料图像后(通过图像 id),字段 profilepicId 仍然存在,但显示未定义。因此,助手似乎无法确定 profilepicId 是否存在,并不断显示 Gravatar(尽管有上传的图像),或者在删除图像时不显示任何 gravatar。

使用蒙古语,字段显示"profilepicId": {}

上传图片时的控制台(显示长度但值未定义?)


图片被删除时的控制台(全部未定义)

个人资料 html

{{#with currentUser}}
   {{#if profilepicId}}
       <img src="{{c.url profilepicId format=format gravity='faces' mode='thumb' crop='thumb' width=60 height=60}}">
   {{else}} 
       <div class="avatar" style="background: url({{avatar 40}}); height: 50px; width: 50px; float:left;"></div>
   {{/if}}
{{/with}}

个人资料 js

Template.profile.onCreated(function(){
   var self = this;
   self.autorun(function(){
      self.subscribe('user', Meteor.userId());
      $.cloudinary.config({ cloud_name: "XX", api_key: 'XX' }); 
   });
});

Template.profile.helpers({
   user: function () {
      return Meteor.user(); 
   },
   profilepicId: function (){ 
      var u = Meteor.user().profile; 
      if( u.profilepicId === undefined || u.profilepicId === null){ 
         return false
      }
   }
});

【问题讨论】:

  • 删除图片后为什么不unset那个字段?
  • @Khang 你是什么意思,我应该如何解除它?

标签: javascript html meteor cloudinary


【解决方案1】:

您指出的第一件事是:

使用 Mongol,字段显示“profilepicId”:{}

...但是您正在检查是否未定义,如果我明白您在说什么。你是说,一旦图像被删除,该字段就是一个空的 JSON 对象?因为那是 not 未定义的。在这种情况下,删除图像时更新配置文件的代码在哪里?

除此之外,您的代码可以大大简化。

首先,我认为您不需要帮助者来获取 profilepicId。您可以在 Blaze 中使用 currentUser 完成所有操作:

{{#with currentUser}}
   {{#if profile.profilepicId}}
       <img src="{{c.url profile.profilepicId format=format gravity='faces' mode='thumb' crop='thumb' width=60 height=60}}">
   {{else}} 
       <!-- gravatar -->
   {{/if}}
{{/with}}

让我们看看你的 onCreated():

Template.profile.onCreated(function(){
   var self = this;
   self.autorun(function(){
      self.subscribe('user', Meteor.userId());
      $.cloudinary.config({ cloud_name: "XX", api_key: 'XX' }); 
   });
});
  1. 当用户更改时,此模板是否会更新到位?如果没有,为什么会有自动运行?
  2. 这个“用户”订阅是什么?它做了普通用户发布不做的事情吗?
  3. 为什么要配置 cloudinary 这么多次?只需执行一次(例如在客户端启动时)
  4. 你为什么要把你的 api_key 放在客户端上?仅服务器配置需要该数据。客户端配置只需要 cloud_name。客户端上的 api_key 不安全。

除非有什么我不明白的地方(很可能是因为#2),否则我认为你不需要任何东西。 (当然,配置会移至客户端启动)。

我也没有在你需要的助手中看到任何东西,因为你可以在 Blaze 中将所有内容从 currentUser 中移除。

所以,简而言之,当删除个人资料图像时,Meteor.user().profile 会是什么样子,该代码在做什么?即该字段是真正未定义的,还是一个空的 JSON 对象?

更新

对于 Cloudinary 配置,我在客户端 (client/index.js) 上有这个:

Meteor.startup(() => {
    $.cloudinary.config({
        cloud_name: Meteor.settings.public.cloudinary.cloud_name
    });
}

我从设置文件中提取信息,但您可以对其进行硬编码以开始使用。

在服务器上(server/startup/cloudinaryConfig.js):

Meteor.startup(() => {
    Cloudinary.config({
        cloud_name: Meteor.settings.private.cloudinary.cloud_name,
        api_key: Meteor.settings.private.cloudinary.api_key,
        api_secret: Meteor.settings.private.cloudinary.api_secret
    });
});

要进行设置,我的 settings.json 具有以下结构:

{
    "public": {
        "cloudinary": {
            "cloud_name": "foo"
        }
    },
    "private": {
        "cloudinary": {
            "cloud_name": "foo",
            "api_key": "xxx",
            "api_secret": "yyy"
        },
    }
}

哦,值得一提的是我正在使用这个包(我认为你使用的是相同的):https://atmospherejs.com/lepozepo/cloudinary

【讨论】:

  • 谢谢@Zim。蒙古语在删除后显示profilepicId: { }(即字段中不再存储id字符串)。我说错了。在控制台日志中(见图 2),该字段显示对象,但它的值和计数显示未定义。不知何故,html 建议的更改不起作用。没有助手和 html,Gravatar 不会出现。对于 OnCreated,[1] 当前用户没有变化。所有其他用户都有一个单独的 html,它们会随着用户而改变。 [2] 没用,删掉了。 [3] 我应该把它放在哪里?在库文件夹中? [4] 认为我在服务器文件夹中的 config.js 中尝试了 api,但不知何故没有工作?
  • 抱歉,在进行更改并包括@Khang 的建议后,它现在确实可以工作。由于你的是主要的,所以将你的作为答案。谢谢。感谢您是否可以回答#1的回复(如果不是自动运行,我应该怎么写?)和3.您知道如何预览图像和上传进度条吗?我关注了文档,但现在它有点混乱。
  • 对于进度条,我不知道如何,抱歉。我只是展示了一个通用的页面微调器。对于 autorun() 问题,我不明白。如果 cloudinary 设置被移动,并且您摆脱了订阅,那么您的 autorun() 现在是空的。那你为什么需要它? html 中的“currentUser”是完全独立的。
  • 好点,我有一些 console.log 在页面加载时检查正确的用户 ID。至于settings.json,我是个新手。无法在 settings.json 上设置和运行应用程序。出于安全目的,我已经在公钥和私钥上阅读过它。也是的,我正在使用相同的 lepozos 包。
  • 你现在可以硬编码了。但如果你想让它继续运行,你可以复制/粘贴所有三个更新的 sn-ps 并将其放入我指定的文件名中。然后,而不是“流星”开始,它是“流星--settings settings.json”
【解决方案2】:

删除图像后,您还应该使用$unset 运算符删除profilepicId 字段:

Meteor.users.update({
  _id: userId
}, {
  $unset: {
    'profile.profilepicId': '',
  },
});

【讨论】:

  • 谢谢我有一个$set : { 'profilepicId': {}} 并创建了一个空数组。
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2019-11-18
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多