fix(gtm-architect): Stabilize Docker environment and fix frontend
- Refactor Docker build process for gtm-app to ensure reliability - Correct volume mounts and build context in docker-compose.yml to prevent stale code - Fix frontend 404 error by using relative paths in index.html - Ensure API key is correctly mounted into the container - Stabilize Node.js to Python data passing via explicit --data argument - Update gtm_architect_documentation.md with extensive troubleshooting guide
This commit is contained in:
@@ -696,7 +696,7 @@ ${prompt.prompt}\n\
|
||||
<div>
|
||||
<h3 className="text-sm font-bold uppercase tracking-wider text-slate-500 mb-2">{labels.features}</h3>
|
||||
<ul className="space-y-2">
|
||||
{state.phase1Result?.features.map((f, i) => (
|
||||
{(state.phase1Result?.phase1_technical_extraction?.features || []).map((f, i) => (
|
||||
<li key={i} className="flex justify-between items-center group text-sm p-2 rounded border bg-slate-50 dark:bg-robo-900 border-slate-200 dark:border-robo-700">
|
||||
<span>{f}</span>
|
||||
<button onClick={() => removeFeature(i)} className="opacity-0 group-hover:opacity-100 text-red-500"><X size={14}/></button>
|
||||
@@ -711,7 +711,7 @@ ${prompt.prompt}\n\
|
||||
<div>
|
||||
<h3 className="text-sm font-bold uppercase tracking-wider text-slate-500 mb-2">{labels.constraints}</h3>
|
||||
<ul className="space-y-2">
|
||||
{state.phase1Result?.constraints.map((c, i) => (
|
||||
{(state.phase1Result?.phase1_technical_extraction?.constraints || []).map((c, i) => (
|
||||
<li key={i} className="flex justify-between items-center group text-sm p-2 rounded border bg-red-50 dark:bg-robo-900 border-red-200 dark:border-red-900/30">
|
||||
<span>{c}</span>
|
||||
<button onClick={() => removeConstraint(i)} className="opacity-0 group-hover:opacity-100 text-red-600"><X size={14}/></button>
|
||||
|
||||
@@ -82,10 +82,10 @@
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<link rel="stylesheet" href="/index.css">
|
||||
<link rel="stylesheet" href="./index.css">
|
||||
</head>
|
||||
<body>
|
||||
<div id="root"></div>
|
||||
<script type="module" src="/index.tsx"></script>
|
||||
<script type="module" src="./index.tsx"></script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -1,85 +1,93 @@
|
||||
const express = require('express');
|
||||
const { spawn } = require('child_process');
|
||||
const fs = require('fs');
|
||||
const path = require('path');
|
||||
const app = express();
|
||||
const port = 3005; // Port for the GTM Architect service
|
||||
console.log("--- GTM Architect Server starting ---");
|
||||
|
||||
app.use(express.json({ limit: '50mb' }));
|
||||
try {
|
||||
const express = require('express');
|
||||
const { spawn } = require('child_process');
|
||||
const fs = require('fs');
|
||||
const path = require('path');
|
||||
const app = express();
|
||||
const port = 3005; // Port for the GTM Architect service
|
||||
|
||||
// Determine Environment and Paths
|
||||
const distPath = path.join(__dirname, 'dist');
|
||||
const isProduction = fs.existsSync(distPath);
|
||||
const staticDir = isProduction ? distPath : __dirname;
|
||||
app.use(express.json({ limit: '50mb' }));
|
||||
|
||||
console.log(`[Init] Serving static files from: ${staticDir}`);
|
||||
app.use(express.static(staticDir));
|
||||
// Determine Environment and Paths
|
||||
const distPath = path.join(__dirname, 'dist');
|
||||
const isProduction = fs.existsSync(distPath);
|
||||
const staticDir = isProduction ? distPath : __dirname;
|
||||
|
||||
// Determine Python Script Path
|
||||
// In Docker (optimized), script is in same dir. Locally, it might be one level up.
|
||||
let pythonScriptPath = path.join(__dirname, 'gtm_architect_orchestrator.py');
|
||||
if (!fs.existsSync(pythonScriptPath)) {
|
||||
pythonScriptPath = path.join(__dirname, '../gtm_architect_orchestrator.py');
|
||||
}
|
||||
console.log(`[Init] Using Python script at: ${pythonScriptPath}`);
|
||||
console.log(`[Init] Serving static files from: ${staticDir}`);
|
||||
app.use(express.static(staticDir));
|
||||
|
||||
|
||||
function callPythonScript(mode, data, res) {
|
||||
const pythonProcess = spawn('python3', [pythonScriptPath, '--mode', mode]);
|
||||
|
||||
let pythonData = '';
|
||||
let errorData = '';
|
||||
|
||||
pythonProcess.stdout.on('data', (data) => {
|
||||
pythonData += data.toString();
|
||||
});
|
||||
|
||||
pythonProcess.stderr.on('data', (data) => {
|
||||
errorData += data.toString();
|
||||
});
|
||||
|
||||
pythonProcess.on('close', (code) => {
|
||||
if (code !== 0) {
|
||||
console.error(`Python script exited with code ${code}`);
|
||||
console.error('Stderr:', errorData);
|
||||
return res.status(500).json({ error: 'Python script execution failed.', details: errorData });
|
||||
}
|
||||
try {
|
||||
const result = JSON.parse(pythonData);
|
||||
res.json(result);
|
||||
} catch (e) {
|
||||
console.error('Failed to parse Python script output:', e);
|
||||
console.error('Raw output:', pythonData);
|
||||
res.status(500).json({ error: 'Failed to parse Python script output.', details: pythonData });
|
||||
}
|
||||
});
|
||||
|
||||
pythonProcess.stdin.write(JSON.stringify(data));
|
||||
pythonProcess.stdin.end();
|
||||
}
|
||||
|
||||
// API endpoint to handle requests from the frontend
|
||||
app.post('/api/gtm', (req, res) => {
|
||||
const { mode, data } = req.body;
|
||||
if (!mode || !data) {
|
||||
return res.status(400).json({ error: 'Missing mode or data in request body' });
|
||||
// Determine Python Script Path
|
||||
// In Docker (optimized), script is in same dir. Locally, it might be one level up.
|
||||
let pythonScriptPath = path.join(__dirname, 'gtm_architect_orchestrator.py');
|
||||
if (!fs.existsSync(pythonScriptPath)) {
|
||||
pythonScriptPath = path.join(__dirname, '../gtm_architect_orchestrator.py');
|
||||
}
|
||||
callPythonScript(mode, data, res);
|
||||
});
|
||||
|
||||
// Serve the main index.html for any other requests to support client-side routing
|
||||
app.get('*', (req, res) => {
|
||||
res.sendFile(path.join(staticDir, 'index.html'));
|
||||
});
|
||||
console.log(`[Init] Using Python script at: ${pythonScriptPath}`);
|
||||
|
||||
|
||||
const VERSION = "1.1.1_Fix"; // Add a version for debugging
|
||||
function callPythonScript(mode, data, res) {
|
||||
const dataString = JSON.stringify(data);
|
||||
const pythonProcess = spawn('python3', [pythonScriptPath, '--mode', mode, '--data', dataString]);
|
||||
|
||||
const server = app.listen(port, () => {
|
||||
console.log(`GTM Architect server listening at http://localhost:${port} (Version: ${VERSION})`);
|
||||
});
|
||||
let pythonData = '';
|
||||
let errorData = '';
|
||||
|
||||
pythonProcess.stdout.on('data', (data) => {
|
||||
pythonData += data.toString();
|
||||
});
|
||||
|
||||
pythonProcess.stderr.on('data', (data) => {
|
||||
errorData += data.toString();
|
||||
});
|
||||
|
||||
pythonProcess.on('close', (code) => {
|
||||
if (code !== 0) {
|
||||
console.error(`Python script exited with code ${code}`);
|
||||
console.error('Stderr:', errorData);
|
||||
return res.status(500).json({ error: 'Python script execution failed.', details: errorData });
|
||||
}
|
||||
try {
|
||||
const result = JSON.parse(pythonData);
|
||||
res.json(result);
|
||||
} catch (e) {
|
||||
console.error('Failed to parse Python script output:', e);
|
||||
console.error('Raw output:', pythonData);
|
||||
res.status(500).json({ error: 'Failed to parse Python script output.', details: pythonData });
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
// API endpoint to handle requests from the frontend
|
||||
app.post('/api/gtm', (req, res) => {
|
||||
const { mode, data } = req.body;
|
||||
if (!mode || !data) {
|
||||
return res.status(400).json({ error: 'Missing mode or data in request body' });
|
||||
}
|
||||
callPythonScript(mode, data, res);
|
||||
});
|
||||
|
||||
// Serve the main index.html for any other requests to support client-side routing
|
||||
app.get('*', (req, res) => {
|
||||
res.sendFile(path.join(staticDir, 'index.html'));
|
||||
});
|
||||
|
||||
|
||||
const VERSION = "1.1.1_Fix_20260101_1200_FINAL"; // Add a version for debugging
|
||||
|
||||
const server = app.listen(port, () => {
|
||||
console.log(`GTM Architect server listening at http://localhost:${port} (Version: ${VERSION})`);
|
||||
});
|
||||
|
||||
// Prevent 502 Bad Gateway by increasing Node.js server timeouts to match Nginx
|
||||
server.setTimeout(600000);
|
||||
server.keepAliveTimeout = 610000;
|
||||
server.headersTimeout = 620000;
|
||||
|
||||
} catch (e) {
|
||||
console.error("!!! A CRITICAL ERROR OCCURRED ON STARTUP !!!");
|
||||
console.error(e);
|
||||
process.exit(1);
|
||||
}
|
||||
|
||||
// Prevent 502 Bad Gateway by increasing Node.js server timeouts to match Nginx
|
||||
server.setTimeout(600000);
|
||||
server.keepAliveTimeout = 610000;
|
||||
server.headersTimeout = 620000;
|
||||
|
||||
Reference in New Issue
Block a user