Issue with media visibility in my Matrix Synapse and Element Web setup

I am encountering an issue with media visibility in my Matrix Synapse and Element Web setup, and I would appreciate your assistance in resolving it.

Issue Summary:

Images and attachments are not visible on the Element Web (desktop browser) but are visible on mobile (Element Android/iOS application) under the following conditions:

  1. Mobile to Mobile: Images are visible when sent between mobile clients.
  2. Mobile to Desktop: Images sent from mobile clients are visible on mobile, but not on the desktop browser.
  3. Desktop to Desktop: Images sent from a desktop browser are not visible to other desktop clients.

The Element Web frontend returns an “Error downloading image” message in the browser when attempting to access media.

Environment Details:

  • Matrix Synapse Server: xyz.example.com (Ubuntu Server 22.04 - Server B)
  • Element Web Client: abc.example.com (Ubuntu Server 22.04 - Server A)
  • TURN Server: Configured on xyz.example.com (Server B) – Voice/Video calling works correctly.

Findings from Investigation:

  1. Element Web attempts to load media via https://abc.example.com/_matrix/media/..., but Synapse is hosted at https://xyz.example.com, which leads to a 404 Not Found error.
  2. The expected media file is missing from the Synapse media repository:
  • Missing File: /var/lib/matrix-synapse/media does not contain hufDYvJaYOHDfPipELOvSWBW
  • Homeserver Log: Shows successful upload of media (mxc://xyz.example.com/hufDYvJaYOHDfPipELOvSWBW)
  • Database Entry: Present in local_media_repository (Size: 46302 bytes; Uploaded by: @kachavan:xyz.example.com; Timestamp: 2025-07-18 06:12:55)

This suggests the file was either not written to disk correctly or was deleted afterward.

Attempts to Resolve:

I have reviewed related discussions and documentation, and tried several solutions including adjusting media URLs and reverse proxy settings, but the issue persists.

Request:

Could you please advise on the correct approach to:

  • Ensure media URLs resolve properly from Element Web to Matrix Synapse
  • Confirm that uploaded media is reliably written and retained in the Synapse media store
  • Properly configure Element Web and Synapse when hosted on different domains/servers

Any assistance or recommended configuration guidelines would be greatly appreciated.