Apply permissive CORS headers to API (#115)

* Take cors package as dependency

* Apply permissive CORS headers to all API routes

web/lib/api/cors.ts

@@ -0,0 +1,20 @@
+import Cors from 'cors'
+import { NextApiRequest, NextApiResponse } from 'next'
+
+export function applyCorsHeaders(
+  req: NextApiRequest,
+  res: NextApiResponse,
+  params: object
+) {
+  // This cors module is made as express.js middleware, so it's easier to promisify it for ourselves.
+  return new Promise((resolve, reject) => {
+    Cors(params)(req, res, (result) => {
+      if (result instanceof Error) {
+        return reject(result)
+      }
+      return resolve(result)
+    })
+  })
+}
+
+export const CORS_UNRESTRICTED = {}

web/package.json

@@ -22,6 +22,7 @@
     "@nivo/core": "0.74.0",
     "@nivo/line": "0.74.0",
     "clsx": "1.1.1",
+    "cors": "^2.8.5",
     "daisyui": "1.16.4",
     "dayjs": "1.10.7",
     "firebase": "9.6.0",

web/pages/api/v0/market/[id].ts

@@ -3,11 +3,13 @@ import { Bet, listAllBets } from '../../../../lib/firebase/bets'
 import { listAllComments } from '../../../../lib/firebase/comments'
 import { getContractFromId } from '../../../../lib/firebase/contracts'
 import { FullMarket, ApiError, toLiteMarket } from '../_types'
+import { applyCorsHeaders, CORS_UNRESTRICTED } from '../../../../lib/api/cors'
 
 export default async function handler(
   req: NextApiRequest,
   res: NextApiResponse<FullMarket | ApiError>
 ) {
+  await applyCorsHeaders(req, res, CORS_UNRESTRICTED)
   const { id } = req.query
   const contractId = id as string
 

web/pages/api/v0/markets.ts

@@ -2,6 +2,7 @@
 import type { NextApiRequest, NextApiResponse } from 'next'
 import { listAllContracts } from '../../../lib/firebase/contracts'
 import { toLiteMarket } from './_types'
+import { applyCorsHeaders, CORS_UNRESTRICTED } from '../../../lib/api/cors'
 
 type Data = any[]
 
@@ -9,6 +10,7 @@ export default async function handler(
   req: NextApiRequest,
   res: NextApiResponse<Data>
 ) {
+  await applyCorsHeaders(req, res, CORS_UNRESTRICTED)
   const contracts = await listAllContracts()
   // Serve from Vercel cache, then update. see https://vercel.com/docs/concepts/functions/edge-caching
   res.setHeader('Cache-Control', 's-maxage=1, stale-while-revalidate')

web/pages/api/v0/slug/[slug].ts

@@ -3,11 +3,13 @@ import { Bet, listAllBets } from '../../../../lib/firebase/bets'
 import { listAllComments } from '../../../../lib/firebase/comments'
 import { getContractFromSlug } from '../../../../lib/firebase/contracts'
 import { FullMarket, ApiError, toLiteMarket } from '../_types'
+import { applyCorsHeaders, CORS_UNRESTRICTED } from '../../../../lib/api/cors'
 
 export default async function handler(
   req: NextApiRequest,
   res: NextApiResponse<FullMarket | ApiError>
 ) {
+  await applyCorsHeaders(req, res, CORS_UNRESTRICTED)
   const { slug } = req.query
 
   const contract = await getContractFromSlug(slug as string)