如何配置使TrustWallet显示DApp的网站图标（Favicon）？

Let's break down the key adjustments needed to get your DApp's icon showing up in TrustWallet's history and address bar—since you mentioned Pancakeswap works fine, we can align your setup with their standard practices:

• Update your manifest.json with multiple icon sizes
  TrustWallet leans heavily on PWA manifest configurations for icons. Make sure your manifest includes a range of critical sizes (192x192 and 512x512 are non-negotiable) with accurate file paths. Here's a sample configuration:

  {
    "name": "Your DApp Full Name",
    "short_name": "DApp Short Name",
    "icons": [
      {
        "src": "/img/favicon-192x192.png",
        "sizes": "192x192",
        "type": "image/png"
      },
      {
        "src": "/img/favicon-512x512.png",
        "sizes": "512x512",
        "type": "image/png"
      }
    ],
    "display": "standalone"
  }
  

  Double-check that every icon file exists at the specified path and is directly accessible via your DApp's URL (e.g., https://yourdappdomain.com/img/favicon-192x192.png should load the icon in a browser).

• Add explicit multi-size link tags for icons
  Beyond the shortcut icon you already have, add dedicated rel="icon" tags for common dimensions. TrustWallet often prioritizes these targeted tags over a single shortcut icon:

  <link rel="shortcut icon" type="image/x-icon" href="/img/favicon.ico">
  <link rel="icon" type="image/png" sizes="16x16" href="/img/favicon-16x16.png">
  <link rel="icon" type="image/png" sizes="32x32" href="/img/favicon-32x32.png">
  <link rel="icon" type="image/png" sizes="192x192" href="/img/favicon-192x192.png">
  <link rel="apple-touch-icon" href="/img/favicon.png">
  <link rel="manifest" href="/manifest.json">
  

  I switched to absolute paths here to avoid relative path confusion that can happen with nested DApp routes.

• Verify HTTPS and clear TrustWallet cache
  TrustWallet frequently restricts icon loading for HTTP-only sites, so ensure your DApp is served over HTTPS. Additionally, clear TrustWallet's cache and remove your DApp from its history, then re-access it—old cached icon data can block the new one from rendering.

• Check icon file integrity
  Confirm all your icon files are valid (no corrupted PNGs/ICOs) and meet their stated dimensions. Tools that compress icons without losing quality can also help prevent unexpected loading failures.

These steps mirror the setup used by Pancakeswap and other well-behaved DApps, so they should resolve the TrustWallet icon display issue for you.

内容的提问来源于stack exchange，提问作者Abhishek Pandey