git add backend/src/server.js git commit -m "Allow embedding in HF iframe: disable helmet frameguard + relax CSP" git push hf HEAD:main --force

backend/src/server.js

@@ -1,5 +1,4 @@
-// ESM server (Node 20+). Serves API + built React app from frontend/dist
-
+// backend/src/server.js
 import 'dotenv/config';
 import express from 'express';
 import cors from 'cors';
@@ -9,27 +8,45 @@ import mongoose from 'mongoose';
 import path from 'node:path';
 import { fileURLToPath } from 'node:url';
 
-// ---- paths / __dirname ----
 const __filename = fileURLToPath(import.meta.url);
 const __dirname = path.dirname(__filename);
 
-// ---- env & port ----
 const MONGODB_URI = process.env.MONGODB_URI;
-const PORT = Number(process.env.PORT) || 7860; // HF uses $PORT (7860)
+const PORT = Number(process.env.PORT) || 7860;
 
-// ---- basic app ----
 const app = express();
 app.set('trust proxy', 1);
-app.use(helmet());
-app.use(cors());
+
+// ✅ Allow embedding in Hugging Face iframe
+app.use(
+  helmet({
+    // HF embeds your app in an iframe; disable frameguard so it can load.
+    frameguard: false,
+
+    // Keep CSP off unless you author a custom policy that permits hf.co ↔ hf.space.
+    contentSecurityPolicy: false,
+
+    // These can block some asset loads; relax for SPA builds.
+    crossOriginEmbedderPolicy: false,
+    crossOriginOpenerPolicy: { policy: 'same-origin-allow-popups' },
+  })
+);
+
+app.use(
+  cors({
+    origin: true, // reflect request origin
+    credentials: true,
+  })
+);
 app.use(express.json({ limit: '1mb' }));
 app.use(morgan('tiny'));
 
-// ---- DB connect ----
 if (!MONGODB_URI) {
   console.error('❌ Missing MONGODB_URI environment variable.');
   process.exit(1);
 }
+
+// Mongo
 mongoose.set('strictQuery', true);
 try {
   await mongoose.connect(MONGODB_URI);
@@ -39,30 +56,27 @@ try {
   process.exit(1);
 }
 
-// ---- routes ----
-// import your existing router (already created earlier)
+// Routes
 import productsRouter from './routes/products.routes.js';
 
-// Health check first (before static fallback)
 app.get('/health', (_req, res) => {
   const conn = mongoose.connection.readyState === 1 ? 'connected' : 'disconnected';
   res.json({ ok: conn === 'connected', db: conn });
 });
 
-// API
 app.use('/api/products', productsRouter);
 
-// ---- static frontend build ----
+// Static frontend
 const clientDir = path.join(__dirname, '../../frontend/dist');
 app.use(express.static(clientDir));
 
-// Fallback to index.html for SPA routes (but not for /api/*)
+// SPA fallback (but not for /api/*)
 app.get('*', (req, res) => {
   if (req.path.startsWith('/api/')) return res.status(404).json({ error: 'Not found' });
   res.sendFile(path.join(clientDir, 'index.html'));
 });
 
-// ---- start ----
+// Start
 app.listen(PORT, '0.0.0.0', () => {
   console.log(`🚀 API running on http://0.0.0.0:${PORT}`);
 });