fix

.gitignore

@@ -128,3 +128,6 @@ dist
 .yarn/build-state.yml
 .yarn/install-state.gz
 .pnp.*
+
+# build generated files
+public/antd.min.css

package.json

@@ -36,6 +36,7 @@
     "@ant-design/pro-components": "^2.4.9",
     "@ant-design/pro-layout": "^7.10.3",
     "axios": "^1.3.6",
+    "eventsource-parser": "^1.0.0",
     "midjourney": "^1.0.12",
     "next": "^13.1.1"
   },

pages/api/hello.ts

@@ -13,8 +13,11 @@ export default async function handler() {
         )
       );
       controller.enqueue(encoder.encode("Vercel Edge Functions + Streaming"));
+      setTimeout(() => {
+        controller.enqueue(encoder.encode("Vercel Edge Functions + 33333"));
+        controller.close();
+      }, 2000);
       controller.enqueue(encoder.encode("</body></html>"));
-      controller.close();
     },
   });
 

pages/api/imagine.ts

@@ -3,37 +3,38 @@ import { Midjourney } from "midjourney";
 import type { NextApiRequest, NextApiResponse } from "next";
 import { ResponseError } from "../../interfaces";
 import { Readable } from "stream";
+
+export const config = {
+  runtime: "edge",
+};
 const client = new Midjourney(
   <string>process.env.SERVER_ID,
   <string>process.env.CHANNEL_ID,
   <string>process.env.SALAI_TOKEN
 );
-export const config = {
-  runtime: "edge",
-};
-
 export default async function handler(
   req: NextApiRequest,
   res: NextApiResponse
 ) {
   const { prompt } = req.body;
   const encoder = new TextEncoder();
-  const stream = new Readable({
-    read() {},
+  const readable = new ReadableStream({
+    start(controller) {
+      client
+        .Imagine(prompt, (uri: string) => {
+          console.log("imagine.loading", uri);
+          controller.enqueue(encoder.encode(JSON.stringify({ uri })));
+        })
+        .then((msg) => {
+          console.log("imagine.done", msg);
+          controller.enqueue(encoder.encode(JSON.stringify(msg)));
+          controller.close();
+        })
+        .catch((err: ResponseError) => {
+          console.log("imagine.error", err);
+          controller.close();
+        });
+    },
   });
-  client
-    .Imagine(prompt, (uri: string) => {
-      console.log("upsale.loading", uri);
-      stream.push(encoder.encode(JSON.stringify({ uri })));
-    })
-    .then((msg) => {
-      console.log("upsale.done", msg);
-      stream.push(encoder.encode(JSON.stringify(msg)));
-      stream.push(null);
-    })
-    .catch((err: ResponseError) => {
-      console.log("upsale.error", err);
-      stream.push(null);
-    });
-  stream.pipe(res);
+  return new Response(readable, {});
 }

yarn.lock

@@ -1504,6 +1504,11 @@ esutils@^2.0.2:
   resolved "https://registry.npmjs.org/esutils/-/esutils-2.0.3.tgz"
   integrity sha512-kVscqXk4OCp68SZ0dkgEKVi6/8ij300KBWTJq32P/dYeWTSwK41WyTxalN1eRmA5Z9UU/LX9D7FWSmV9SAYx6g==
 
+eventsource-parser@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/eventsource-parser/-/eventsource-parser-1.0.0.tgz#6332e37fd5512e3c8d9df05773b2bf9e152ccc04"
+  integrity sha512-9jgfSCa3dmEme2ES3mPByGXfgZ87VbP97tng1G2nWwWx6bV2nYxm2AWCrbQjXToSe+yYlqaZNtxffR9IeQr95g==
+
 fast-deep-equal@^3.1.1, fast-deep-equal@^3.1.3:
   version "3.1.3"
   resolved "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz"