updates

package-lock.json

@@ -11,6 +11,7 @@
             "dependencies": {
                 "@barba/core": "^2.9.7",
                 "contentful": "^9.1.32",
+                "cors": "^2.8.5",
                 "datasquirel": "^1.1.82",
                 "gsap": "^3.10.4",
                 "next": "^13.4.10",
@@ -21,6 +22,7 @@
                 "three": "^0.138.3"
             },
             "devDependencies": {
+                "@types/cors": "^2.8.13",
                 "@types/node": "^20.4.2",
                 "@types/react": "^18.2.15",
                 "autoprefixer": "^10.4.14",
@@ -295,6 +297,15 @@
                 "tslib": "^2.4.0"
             }
         },
+        "node_modules/@types/cors": {
+            "version": "2.8.13",
+            "resolved": "https://registry.npmjs.org/@types/cors/-/cors-2.8.13.tgz",
+            "integrity": "sha512-RG8AStHlUiV5ysZQKq97copd2UmVYw3/pRMLefISZ3S1hK104Cwm7iLQ3fTKx+lsUH2CE8FlLaYeEA2LSeqYUA==",
+            "dev": true,
+            "dependencies": {
+                "@types/node": "*"
+            }
+        },
         "node_modules/@types/node": {
             "version": "20.4.2",
             "resolved": "https://registry.npmjs.org/@types/node/-/node-20.4.2.tgz",
@@ -629,6 +640,18 @@
                 "node": ">=12"
             }
         },
+        "node_modules/cors": {
+            "version": "2.8.5",
+            "resolved": "https://registry.npmjs.org/cors/-/cors-2.8.5.tgz",
+            "integrity": "sha512-KIHbLJqu73RGr/hnbrO9uBeixNGuvSQjul/jdFvS/KFSIH1hWVd1ng7zOHx+YrEfInLG7q4n6GHQ9cDtxv/P6g==",
+            "dependencies": {
+                "object-assign": "^4",
+                "vary": "^1"
+            },
+            "engines": {
+                "node": ">= 0.10"
+            }
+        },
         "node_modules/cssesc": {
             "version": "3.0.0",
             "resolved": "https://registry.npmjs.org/cssesc/-/cssesc-3.0.0.tgz",
@@ -1332,7 +1355,6 @@
             "version": "4.1.1",
             "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz",
             "integrity": "sha512-rJgTQnkUnH1sFw8yT6VSU3zD3sWmu6sZhIseY8VX+GRu3P6F7Fu+JNDoXfklElbLJSnc3FUQHVe4cU5hj+BcUg==",
-            "dev": true,
             "engines": {
                 "node": ">=0.10.0"
             }
@@ -1933,6 +1955,14 @@
             "integrity": "sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw==",
             "dev": true
         },
+        "node_modules/vary": {
+            "version": "1.1.2",
+            "resolved": "https://registry.npmjs.org/vary/-/vary-1.1.2.tgz",
+            "integrity": "sha512-BNGbWLfd0eUPabhkXUVm0j8uuvREyTh5ovRa/dyow/BqAbZJyC+5fU+IzQOzmAKzYqYRAISoRhdQr3eIZ/PXqg==",
+            "engines": {
+                "node": ">= 0.8"
+            }
+        },
         "node_modules/watchpack": {
             "version": "2.4.0",
             "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-2.4.0.tgz",

package.json

@@ -27,6 +27,7 @@
     "dependencies": {
         "@barba/core": "^2.9.7",
         "contentful": "^9.1.32",
+        "cors": "^2.8.5",
         "datasquirel": "^1.1.82",
         "gsap": "^3.10.4",
         "next": "^13.4.10",
@@ -37,6 +38,7 @@
         "three": "^0.138.3"
     },
     "devDependencies": {
+        "@types/cors": "^2.8.13",
         "@types/node": "^20.4.2",
         "@types/react": "^18.2.15",
         "autoprefixer": "^10.4.14",

pages/api/test-route.ts

@@ -1,12 +1,33 @@
 import { NextApiHandler, NextApiRequest, NextApiResponse } from "next";
+import Cors from "cors";
+
+const cors = Cors({
+    methods: ["POST", "GET", "HEAD"],
+});
+
+// Helper method to wait for a middleware to execute before continuing
+// And to throw an error when an error happens in a middleware
+function runMiddleware(req: NextApiRequest, res: NextApiResponse, fn: Function) {
+    return new Promise((resolve, reject) => {
+        fn(req, res, (result: any) => {
+            if (result instanceof Error) {
+                return reject(result);
+            }
+
+            return resolve(result);
+        });
+    });
+}
 
 /**
  * @type {NextApiHandler}
  */
-export default function handler(req: NextApiRequest, res: NextApiResponse) {
+export default async function handler(req: NextApiRequest, res: NextApiResponse) {
-    res.setHeader("Access-Control-Allow-Origin", "*");
+    // res.setHeader("Access-Control-Allow-Origin", "*");
-    res.setHeader("Access-Control-Allow-Methods", "*");
+    // res.setHeader("Access-Control-Allow-Methods", "*");
-    res.setHeader("Access-Control-Allow-Headers", "*");
+    // res.setHeader("Access-Control-Allow-Headers", "*");
+
+    await runMiddleware(req, res, cors);
 
     res.status(200).json({
         title: "Hello There",