Problem
Three frontend pages fall back to token.token_uri as an image URL when image_url is null:
NFTContractPage.tsx:85 — token.image_url || token.token_uri || null
NFTTokenPage.tsx:16 — token?.image_url || token?.token_uri || null
AddressPage.tsx:335 — t.image_url || t.token_uri || null
token_uri is a URL to a JSON metadata document, not an image. The browser fetches JSON, fails to render it as an image, and shows a broken image icon — worse than the # placeholder shown when both are null.
Data confirms the fallback never helps. On Eden testnet across 114,951 indexed NFT tokens, there are zero cases where token_uri is a direct image URL:
| token_uri type |
count |
has image_url |
https:// (JSON metadata) |
114,660 |
114,636 |
data:application/json;base64,... |
127 |
0 |
| NULL / empty |
164 |
0 |
The backend already handles the one edge case where token_uri might point directly to an image: it checks content-type on fetch and stores it as image_url if image/* (metadata.rs:431-450). So by the time the frontend sees the data, image_url is always the correct field.
Fix
In all three locations, change:
const imageUrl = token.image_url || token.token_uri || null;
to:
const imageUrl = token.image_url || null;
Related
The tokens currently showing image_url = null are caused by separate backend bugs (#65, #66), not by missing frontend fallback logic.
Problem
Three frontend pages fall back to
token.token_urias an image URL whenimage_urlis null:NFTContractPage.tsx:85—token.image_url || token.token_uri || nullNFTTokenPage.tsx:16—token?.image_url || token?.token_uri || nullAddressPage.tsx:335—t.image_url || t.token_uri || nulltoken_uriis a URL to a JSON metadata document, not an image. The browser fetches JSON, fails to render it as an image, and shows a broken image icon — worse than the#placeholder shown when both are null.Data confirms the fallback never helps. On Eden testnet across 114,951 indexed NFT tokens, there are zero cases where
token_uriis a direct image URL:https://(JSON metadata)data:application/json;base64,...The backend already handles the one edge case where
token_urimight point directly to an image: it checkscontent-typeon fetch and stores it asimage_urlifimage/*(metadata.rs:431-450). So by the time the frontend sees the data,image_urlis always the correct field.Fix
In all three locations, change:
to:
Related
The tokens currently showing
image_url = nullare caused by separate backend bugs (#65, #66), not by missing frontend fallback logic.