fix: dockerfile

Signed-off-by: Animesh Pathak <kurosakiichigo.songoku@gmail.com>

Dockerfile

@@ -9,7 +9,6 @@ COPY package.json package-lock.json* ./
 
 # Install dependencies
 RUN npm install --legacy-peer-deps
-RUN npm ci
 # Copy the rest of the application files
 COPY . .
 
@@ -22,12 +21,11 @@ FROM builder AS runner
 # Set the working directory
 WORKDIR /app
 COPY --from=builder /app/public ./public
-COPY --from=builder --chown=nextjs:nodejs /app/.next/standalone ./
 COPY --from=builder --chown=nextjs:nodejs /app/.next/static ./.next/static
 
 # Expose the application port
 EXPOSE 3100
 
 # Start the application on port 3100
 ENV PORT=3100
-CMD ["npm", "run", "dev"]
+CMD ["npm", "run", "dev"]

src/app/api/generateWallpaper/route.ts

@@ -1,7 +1,17 @@
 import { NextResponse } from 'next/server';
 import axios from 'axios';
 
+// Define allowed origins
+const ALLOWED_ORIGINS = [
+  'http://localhost:3000', 
+  'https://wallpaper-ai-navy.vercel.app'
+];
+
 export async function POST(request: Request) {
+  // Check the origin of the request
+  const origin = request.headers.get('origin') || '';
+  const isAllowedOrigin = ALLOWED_ORIGINS.includes(origin);
+
   try {
     const { prompt, n, size } = await request.json();
 
@@ -15,6 +25,7 @@ export async function POST(request: Request) {
       n,
       size,
     };
+
     // Make the POST request to the image generation API
     const response = await axios.post(apiUrl, body, {
       headers: {
@@ -23,16 +34,53 @@ export async function POST(request: Request) {
       }
     });
 
+    // Prepare the response with CORS headers
+    const responseHeaders = {
+      'Access-Control-Allow-Origin': isAllowedOrigin ? origin : '',
+      'Access-Control-Allow-Methods': 'POST, OPTIONS',
+      'Access-Control-Allow-Headers': 'Content-Type, Authorization',
+    };
+
     // Return the image URL from the API response
-    return NextResponse.json({ images: response.data.data.map((img: any) => img.url) });
+    return NextResponse.json(
+      { images: response.data.data.map((img: any) => img.url) }, 
+      { headers: responseHeaders }
+    );
   } catch (error) {
     console.error('Error generating images:', error);
-    return NextResponse.json({ error: 'Failed to generate images' }, { status: 500 });
+
+    // Include CORS headers in error response as well
+    const responseHeaders = {
+      'Access-Control-Allow-Origin': isAllowedOrigin ? origin : '',
+      'Access-Control-Allow-Methods': 'POST, OPTIONS',
+      'Access-Control-Allow-Headers': 'Content-Type, Authorization',
+    };
+
+    return NextResponse.json(
+      { error: 'Failed to generate images' }, 
+      { 
+        status: 500,
+        headers: responseHeaders 
+      }
+    );
   }
 }
 
+// Handle OPTIONS requests for CORS preflight
+export async function OPTIONS(request: Request) {
+  const origin = request.headers.get('origin') || '';
+  const isAllowedOrigin = ALLOWED_ORIGINS.includes(origin);
+
+  // Prepare CORS headers for preflight request
+  const responseHeaders = {
+    'Access-Control-Allow-Origin': isAllowedOrigin ? origin : '',
+    'Access-Control-Allow-Methods': 'POST, OPTIONS',
+    'Access-Control-Allow-Headers': 'Content-Type, Authorization',
+    'Access-Control-Max-Age': '86400', // Cache preflight response for 24 hours
+  };
 
-    // // Validate environment variables
-    // const endpoint = process.env.AZURE_OPENAI_ENDPOINT;
-    // const key = process.env.AZURE_OPENAI_KEY;
-    // const apiVersion = '2024-02-01';
+  return new NextResponse(null, {
+    status: 204,
+    headers: responseHeaders
+  });
+}

src/components/ImageGenerator.tsx

@@ -33,7 +33,7 @@ const ImageGenerator = () => {
     setError(null);
 
     try {
-      const response = await fetch('/api/generateWallpaper', {
+      const response = await fetch('https://wallpaper-ai-latest.onrender.com/api/generateWallpaper', {
         method: 'POST',
         headers: {
           'Content-Type': 'application/json',