feat: start proxying ipfs requests (#4242)

src/hooks/JB721Delegate/useNftCollectionMetadata.ts

@@ -1,4 +1,4 @@
-import { ipfsGatewayFetch } from 'lib/api/ipfs'
+import { ipfsFetch } from 'lib/api/ipfs'
 import { NftCollectionMetadata } from 'models/nftRewards'
 import { useQuery } from 'react-query'
 import { cidFromUrl } from 'utils/ipfs'
@@ -17,7 +17,7 @@ export function useNftCollectionMetadata(uri: string | undefined) {
         throw new Error('NFT Contract URI invalid.')
       }
 
-      const response = await ipfsGatewayFetch<NftCollectionMetadata>(cid)
+      const response = await ipfsFetch<NftCollectionMetadata>(cid)
       return response.data
     },
     {

src/hooks/useProjectMetadata.ts

@@ -1,4 +1,4 @@
-import { ipfsGatewayFetch } from 'lib/api/ipfs'
+import { ipfsFetch } from 'lib/api/ipfs'
 import { AnyProjectMetadata, consolidateMetadata } from 'models/projectMetadata'
 import { useQuery } from 'react-query'
 
@@ -10,13 +10,12 @@ export function useProjectMetadata(uri: string | null | undefined) {
         throw new Error('Project URI not specified.')
       }
 
-      const response = await ipfsGatewayFetch<AnyProjectMetadata>(uri)
+      const response = await ipfsFetch<AnyProjectMetadata>(uri)
       const metadata = consolidateMetadata(response.data)
       return metadata
     },
     {
       enabled: !!uri,
-      staleTime: 60000,
     },
   )
 }

src/lib/api/ipfs.ts

@@ -20,6 +20,20 @@ const extractJsonFromBase64Data = (base64: string) => {
   return JSON.parse(decoded.substring(jsonStart, jsonEnd + 1))
 }
 
+/**
+ * Fetch an IPFS hash from our proxy.
+ */
+export const ipfsFetch = async <T>(hash: string) => {
+  const response = await axios.get<T>(
+    `${process.env.NEXT_PUBLIC_BASE_URL}api/ipfs/${hash}`,
+  )
+
+  return response
+}
+
+/**
+ * Fetch an IPFS hash directly from the IPFS gateway.
+ */
 export const ipfsGatewayFetch = async <T>(
   hash: string,
   opts?: AxiosRequestConfig<T>,

src/pages/api/ipfs/[cid].ts

@@ -0,0 +1,27 @@
+import { ipfsGatewayFetch } from 'lib/api/ipfs'
+import { getLogger } from 'lib/logger'
+import { NextApiRequest, NextApiResponse } from 'next'
+
+const logger = getLogger('ipfs/[cid]')
+
+export default async function handler(
+  req: NextApiRequest,
+  res: NextApiResponse,
+) {
+  if (req.method !== 'GET') {
+    return res.status(405).end()
+  }
+  if (!req.query.cid) {
+    return res.status(400).json({ error: 'cid not specified' })
+  }
+
+  try {
+    const ipfsRes = await ipfsGatewayFetch(req.query.cid as string)
+    // cache for 1 day
+    res.setHeader('Cache-Control', 's-maxage=86400, stale-while-revalidate')
+    return res.status(200).json(ipfsRes.data)
+  } catch (error) {
+    logger.error(error)
+    return res.status(500).json({ error: 'failed to fetch ipfs data' })
+  }
+}