[Bug] Can't see image attachments (sometimes)

Question

[Bug] Can't see image attachments (sometimes)

edwardloveall opened this issue 4 years ago · comments

On one of my Slack groups, when someone attaches an image in a message, it shows up a long, empty white box (inline). If I click the icon similar to 👁️‍🗨️ it opens a pop up with a spinner that spins forever. Oddly, it doesn't happen on a different slack.

Helge Heß · Answer 1 · Mon Jun 15 2020 04:13:01 GMT+0800 (China Standard Time)

That sounds like it can't retrieve the image URL. Would be interesting to see whether anything is special about those image URLs. You don't happen to have a tool like Charles to have a look?
Is anything special about the workspace itself? E.g. is it some kind of enterprise account, or is the channel with the images a shared channel (from a different workspaces)?

Edward Loveall · Answer 2 · Mon Jun 15 2020 08:16:22 GMT+0800 (China Standard Time)

I used Proxyman to get the response for the message. It looks like this:

JSON Message Response

{
  "type": "message",
  "text": "[REDACTED]",
  "files": [
    {
      "id": "F015JK94220",
      "created": 1592054782,
      "timestamp": 1592054782,
      "name": "Image from iOS.jpg",
      "title": "Image from iOS",
      "mimetype": "image/jpeg",
      "filetype": "jpg",
      "pretty_type": "JPEG",
      "user": "U8EBMAERL",
      "editable": false,
      "size": 118160,
      "mode": "hosted",
      "is_external": false,
      "external_type": "",
      "is_public": true,
      "public_url_shared": false,
      "display_as_bot": false,
      "username": "",
      "url_private": "https://files.slack.com/files-pri/T024HFHU3-F015JK94220/image_from_ios.jpg",
      "url_private_download": "https://files.slack.com/files-pri/T024HFHU3-F015JK94220/download/image_from_ios.jpg",
      "thumb_64": "https://files.slack.com/files-tmb/T024HFHU3-F015JK94220-1e7e052e85/image_from_ios_64.jpg",
      "thumb_80": "https://files.slack.com/files-tmb/T024HFHU3-F015JK94220-1e7e052e85/image_from_ios_80.jpg",
      "thumb_360": "https://files.slack.com/files-tmb/T024HFHU3-F015JK94220-1e7e052e85/image_from_ios_360.jpg",
      "thumb_360_w": 234,
      "thumb_360_h": 360,
      "thumb_480": "https://files.slack.com/files-tmb/T024HFHU3-F015JK94220-1e7e052e85/image_from_ios_480.jpg",
      "thumb_480_w": 311,
      "thumb_480_h": 480,
      "thumb_160": "https://files.slack.com/files-tmb/T024HFHU3-F015JK94220-1e7e052e85/image_from_ios_160.jpg",
      "thumb_720": "https://files.slack.com/files-tmb/T024HFHU3-F015JK94220-1e7e052e85/image_from_ios_720.jpg",
      "thumb_720_w": 467,
      "thumb_720_h": 720,
      "thumb_800": "https://files.slack.com/files-tmb/T024HFHU3-F015JK94220-1e7e052e85/image_from_ios_800.jpg",
      "thumb_800_w": 800,
      "thumb_800_h": 1233,
      "thumb_960": "https://files.slack.com/files-tmb/T024HFHU3-F015JK94220-1e7e052e85/image_from_ios_960.jpg",
      "thumb_960_w": 623,
      "thumb_960_h": 960,
      "thumb_1024": "https://files.slack.com/files-tmb/T024HFHU3-F015JK94220-1e7e052e85/image_from_ios_1024.jpg",
      "thumb_1024_w": 664,
      "thumb_1024_h": 1024,
      "original_w": 1080,
      "original_h": 1665,
      "thumb_tiny": "AwAwAB9ZGcM58xgMnvULSS5x5j9fWn3BIlIGOpIqJMs4BJ9TUGl9RGnmViPMfj3qS1lkaddzuQc9T7VCGCytn9akgkBu0wM8f0qrktFt7Vmdt2wjPek+ysOmwfnV0gFu/wCVGwetFkHMzMewkbJ3Jk+5/wAKdb2EqTK5ZCB6E1o7BS4A6CmSJt5J3Nz70oHfcT+NI3TI7Uq9KAFJA6nFFNcdOAfrSj7ooA//2Q==",
      "permalink": "https://thoughtbot.slack.com/files/U8EBMAERL/F015JK94220/image_from_ios.jpg",
      "permalink_public": "https://slack-files.com/T024HFHU3-F015JK94220-b423b3c6e7",
      "is_starred": false,
      "has_rich_preview": false
    }
  ],
  "upload": true,
  "blocks": [
    {
      "type": "rich_text",
      "block_id": "45S",
      "elements": [
        {
          "type": "rich_text_section",
          "elements": [
            {
              "type": "text",
              "text": "[REDACTED]"
            }
          ]
        }
      ]
    }
  ],
  "user": "U8EBMAERL",
  "display_as_bot": false,
  "ts": "1592054795.195000",
  "client_msg_id": "DA9E7E1B-5B39-4485-A644-747A6514E33B",
  "thread_ts": "1592054795.195000",
  "reply_count": 1,
  "reply_users_count": 1,
  "latest_reply": "1592142644.197800",
  "reply_users": [
    "UGKTZ89FH"
  ],
  "subscribed": false,
  "reactions": [
    {
      "name": "ab",
      "users": [
        "U0AH007U3"
      ],
      "count": 1
    },
    {
      "name": "crying-face-with-heart-eyes-and-open-mouth",
      "users": [
        "UL90Y3MEG"
      ],
      "count": 1
    }
  ]
}

A little bit about the Slack group (team?), it's a paid account for my workplace, but as far as I know nothing else special about it. The channel is a normal, public channel with no sharing.

One thought maybe: as I said a different team doesn't experience this issue. I added the team with file display problems back before purchasing, and the team with no problems afterward. Could it be a cache bug? Artifact of registration?

Anyway, thanks for working on this app! I'd be more than happy to test anything else.

Helge Heß · Answer 3 · Mon Jun 15 2020 08:51:42 GMT+0800 (China Standard Time)

Careful with posting payload in a public forum, rather send them to support@shrugs.app (doesn't look to contain anything critical, but still). I have an idea what might cause that, need to check it.

The Shrugs license itself has nothing to do with this, it doesn't affect any data (all data is synchronized licensed or not).

However, I did fix an issue related to image downloads in 1.0.1 already. It may be worth a try to re-add the account and check whether that fixes the issue. 50/50

Edward Loveall · Answer 4 · Mon Jun 15 2020 08:57:03 GMT+0800 (China Standard Time)

Thanks, I did scrub the message for any PII or sensitive data, but you're right. I'll send them to that email address in the future. 🙂 I removed and re-added the team and it's still got the same problem.

Helge Heß · Answer 5 · Tue Jun 16 2020 04:33:24 GMT+0800 (China Standard Time)

Since you have Proxyman running anyways, can you check whether Shrugs is trying to grab an image, and how that turns out (I suspect it gets a 401, because I don't include credentials in an image query, which may be necessary here).

The easiest way would be to start the proxy, then Shrugs, and then post some new image in that workspace. Shrugs should than at least download the thumbnail.

Edward Loveall · Answer 6 · Tue Jun 16 2020 05:29:04 GMT+0800 (China Standard Time)

I'm not 100% sure what I'm looking for. I uploaded an image (in a DM to myself) and I did get a couple of API calls, one to https://slack.com/api/chat.postMessage and one to https://slack.com/api/files.upload

The postMessage endpoint didn't seem to helpful but the files.upload had a bunch of URLs. I checked a few and they all seem fine. Is there anything more specific I should be looking for?

BTW, The image did show up in my DM!

Helge Heß · Answer 7 · Tue Jun 16 2020 05:36:03 GMT+0800 (China Standard Time)

It's not the postMessage I'm interested in, but the way messages w/ image references are received. When a new image arrives, Shrugs gets that message, which refers to a file, and then it should try to download it (first the thumbnail).
I'd expect that those download attempts show up as some kind of HTTP error (most likely a 401/Unauthorized)

Hm. 🤔

Thanks for testing! I'll try to reproduce it somehow.