Fix 1937 -Not able to use private network gateway due to 1x1.png (#1944)

* check server using more hashes

* lint

* fix: remove unnecessary variables

Co-authored-by: Yiu ming Lai <ymlai87416@gmail.com>
Co-authored-by: Russell Dempsey <1173416+SgtPooki@users.noreply.github.com>

src/bundles/gateway.js

@@ -1,7 +1,11 @@
 import { readSetting, writeSetting } from './local-storage'
 
 export const DEFAULT_GATEWAY = 'https://ipfs.io' // TODO: switch to dweb.link when https://github.com/ipfs/go-ipfs/issues/7318
-const IMG_HASH = 'bafybeibwzifw52ttrkqlikfzext5akxu7lz4xiwjgwzmqcpdzmp3n5vnbe' // 1x1px image
+const IMG_ARRAY = [
+  { id: 'IMG_HASH_1PX', name: '1x1.png', hash: 'bafybeibwzifw52ttrkqlikfzext5akxu7lz4xiwjgwzmqcpdzmp3n5vnbe' },
+  { id: 'IMG_HASH_1PXID', name: '1x1.png', hash: 'bafkqax4jkbheodikdifaaaaabveuqrcsaaaaaaiaaaaacaidaaaaajo3k3faaaaaanieyvcfaaaabj32hxnaaaaaaf2fetstabaonwdgaaaaacsjiravicgxmnqaaaaaaiaadyrbxqzqaaaaabeuktsevzbgbaq' },
+  { id: 'IMG_HASH_FAVICON', name: 'favicon.ico', hash: 'bafkreihc7efnl2prri6j6krcopelxms3xsh7undpsjqbfsasm7ikiyha4i' }
+]
 
 const readPublicGatewaySetting = () => {
   const setting = readSetting('ipfsPublicGateway')
@@ -25,14 +29,27 @@ export const checkValidHttpUrl = (value) => {
   return url.protocol === 'http:' || url.protocol === 'https:'
 }
 
+/**
+ * Check if any hashes from IMG_ARRAY can be loaded from the provided gatewayUrl
+ * @see https://github.com/ipfs/ipfs-webui/issues/1937#issuecomment-1152894211 for more info
+ */
 export const checkViaImgSrc = (gatewayUrl) => {
   const url = new URL(gatewayUrl)
-  const imgUrl = new URL(`${url.protocol}//${url.hostname}/ipfs/${IMG_HASH}?now=${Date.now()}&filename=1x1.png#x-ipfs-companion-no-redirect`)
 
-  // we check if gateway is up by loading 1x1 px image:
-  // this is more robust check than loading js, as it won't be blocked
-  // by privacy protections present in modern browsers or in extensions such as Privacy Badger
+  /**
+   * we check if gateway is up by loading 1x1 px image:
+   * this is more robust check than loading js, as it won't be blocked
+   * by privacy protections present in modern browsers or in extensions such as Privacy Badger
+   */
+  return Promise.any(IMG_ARRAY.map(element => {
+    const imgUrl = new URL(`${url.protocol}//${url.hostname}/ipfs/${element.hash}?now=${Date.now()}&filename=${element.name}#x-ipfs-companion-no-redirect`)
+    return checkImgSrcPromise(imgUrl)
+  }))
+}
+
+const checkImgSrcPromise = (imgUrl) => {
   const imgCheckTimeout = 15000
+
   return new Promise((resolve, reject) => {
     const timeout = () => {
       if (!timer) return false