working with everything but preview and photourl broken

pengyu · pengyu · commit 4d055b02626f · 2025-04-10T20:49:12.000-04:00
diff --git a/backend/src/project/dto/project.input.ts b/backend/src/project/dto/project.input.ts
@@ -124,6 +124,9 @@ export class FetchPublicProjectsInputs {
 
   @Field()
   size: number;
+
+  @Field()
+  currentUserId: string;
 }
 
 @InputType()
diff --git a/backend/src/project/project.resolver.ts b/backend/src/project/project.resolver.ts
@@ -103,12 +103,14 @@ export class ProjectsResolver {
     const { buffer, mimetype } = await validateAndBufferFile(file);
 
     // Call the service with the extracted buffer and mimetype
-    return this.projectService.updateProjectPhotoUrl(
+    const project1= await this.projectService.updateProjectPhotoUrl(
       userId,
       projectId,
       buffer,
       mimetype,
     );
+    this.logger.debug('project1', project1.photoUrl);
+    return project1;
   }
 
   @Mutation(() => Project)
@@ -152,8 +154,10 @@ export class ProjectsResolver {
    */
   @Query(() => [Project])
   async fetchPublicProjects(
+    @GetUserIdFromToken() userId: string,
     @Args('input') input: FetchPublicProjectsInputs,
   ): Promise<Project[]> {
+    input.currentUserId = userId;
     return this.projectService.fetchPublicProjects(input);
   }
 
diff --git a/backend/src/project/project.service.ts b/backend/src/project/project.service.ts
@@ -644,9 +644,8 @@ export class ProjectService {
     const limit = input.size > 50 ? 50 : input.size;
 
     const whereCondition = {
-      isPublic: true,
       isDeleted: false,
-      photoUrl: Not(IsNull()),
+      userId: Not(input.currentUserId), // Exclude current user's projects
     };
 
     if (input.strategy === 'latest') {
@@ -808,7 +807,7 @@ export class ProjectService {
     this.logger.log(
       'check if the github project exist: ' + project.isSyncedWithGitHub,
     );
-    // 2) Check user’s GitHub installation
+    // 2) Check user's GitHub installation
     if (!user.githubInstallationId) {
       throw new Error('GitHub App not installed for this user');
     }
@@ -819,7 +818,7 @@ export class ProjectService {
     );
     const userOAuthToken = user.githubAccessToken;
 
-    // 4) Create the repo if the project doesn’t have it yet
+    // 4) Create the repo if the project doesn't have it yet
     if (!project.githubRepoName || !project.githubOwner) {
       // Use project.projectName or generate a safe name
 
diff --git a/frontend/src/app/api/runProject/route.ts b/frontend/src/app/api/runProject/route.ts
@@ -517,10 +517,12 @@ export async function GET(req: Request) {
       existingContainer.containerId
     );
     if (isRunning) {
+      logger.info(`Using existing container with port: ${existingContainer.port}`);
       return NextResponse.json({
         message: 'Docker container already running',
         domain: existingContainer.domain,
         containerId: existingContainer.containerId,
+        port: existingContainer.port,
       });
     } else {
       // Remove non-running container from state
@@ -547,12 +549,14 @@ export async function GET(req: Request) {
   processingRequests.add(projectPath);
 
   try {
-    const { domain, containerId } = await runDockerContainer(projectPath);
+    const { domain, containerId, port } = await runDockerContainer(projectPath);
+    logger.info(`Successfully started container on port: ${port}`);
 
     return NextResponse.json({
       message: 'Docker container started',
       domain,
       containerId,
+      port,
     });
   } catch (error: any) {
     logger.error(`Failed to start Docker container:`, error);
diff --git a/frontend/src/app/api/screenshot/route.ts b/frontend/src/app/api/screenshot/route.ts
@@ -22,6 +22,7 @@ export async function GET(req: Request) {
   const { searchParams } = new URL(req.url);
   const url = searchParams.get('url');
   let page = null;
+  const MAX_RETRIES = 3;
 
   if (!url) {
     return NextResponse.json(
@@ -30,93 +31,130 @@ export async function GET(req: Request) {
     );
   }
 
-  try {
-    // Get browser instance
-    const browser = await getBrowser();
-
-    // Create a new page
-    page = await browser.newPage();
-
-    // Set viewport to a reasonable size
-    await page.setViewport({
-      width: 1280,
-      height: 720,
-    });
-
-    // Navigate to URL with increased timeout and more reliable wait condition
-    await page.goto(url, {
-      waitUntil: 'domcontentloaded', // Less strict than networkidle0
-      timeout: 60000, // Increased timeout to 60 seconds
-    });
-
-    // 等待额外的时间让页面完全渲染
-    await page.waitForTimeout(3000);
-
-    // 尝试等待页面上的内容加载，如果失败也继续处理
+  for (let attempt = 0; attempt < MAX_RETRIES; attempt++) {
     try {
-      // 等待页面上可能存在的主要内容元素
-      await Promise.race([
-        page.waitForSelector('main', { timeout: 2000 }),
-        page.waitForSelector('#root', { timeout: 2000 }),
-        page.waitForSelector('.app', { timeout: 2000 }),
-        page.waitForSelector('h1', { timeout: 2000 }),
-      ]);
-    } catch (waitError) {
-      // 忽略等待选择器的错误，继续截图
-      logger.info('Unable to find common page elements, continuing with screenshot');
-    }
+      logger.info(`Screenshot attempt ${attempt + 1} for ${url}`);
+      
+      // Get browser instance
+      const browser = await getBrowser();
+
+      // Create a new page
+      page = await browser.newPage();
+
+      // Set viewport to a reasonable size
+      await page.setViewport({
+        width: 1280,
+        height: 720,
+      });
+
+      // Navigate to URL with increased timeout and more reliable wait condition
+      await page.goto(url, {
+        waitUntil: 'networkidle2', // 更改为等待网络空闲状态，确保页面完全加载
+        timeout: 90000, // 增加超时时间到90秒
+      });
+
+      // 等待额外的时间让页面完全渲染
+      await page.waitForTimeout(8000); // 增加等待时间到8秒
+
+      // 尝试等待页面上的内容加载，如果失败也继续处理
+      try {
+        // 等待页面上可能存在的主要内容元素
+        await Promise.race([
+          page.waitForSelector('main', { timeout: 5000 }),
+          page.waitForSelector('#root', { timeout: 5000 }),
+          page.waitForSelector('.app', { timeout: 5000 }),
+          page.waitForSelector('h1', { timeout: 5000 }),
+          page.waitForSelector('div', { timeout: 5000 }), // 添加更通用的选择器
+        ]);
+      } catch (waitError) {
+        // 忽略等待选择器的错误，继续截图
+        logger.info('Unable to find common page elements, continuing with screenshot');
+      }
 
-    // Take screenshot
-    const screenshot = await page.screenshot({
-      type: 'png',
-      fullPage: false,
-    });
+      // 检查页面是否有内容
+      const contentCheck = await page.evaluate(() => {
+        return {
+          bodyContent: document.body.innerText.length,
+          elements: document.querySelectorAll('*').length
+        };
+      });
+
+      logger.info(`Page content: ${contentCheck.bodyContent} chars, ${contentCheck.elements} elements`);
+      
+      if (contentCheck.elements < 5) {
+        logger.warn('Page seems empty, possibly not fully loaded');
+        if (attempt < MAX_RETRIES - 1) {
+          await page.close();
+          continue; // 重试
+        }
+      }
 
-    // Always close the page when done
-    if (page) {
-      await page.close();
-    }
+      // Take screenshot with full page height
+      const screenshot = await page.screenshot({
+        type: 'png',
+        fullPage: false,
+      });
 
-    // Return the screenshot as a PNG image
-    return new Response(screenshot, {
-      headers: {
-        'Content-Type': 'image/png',
-        'Cache-Control': 's-maxage=3600',
-      },
-    });
-  } catch (error: any) {
-    logger.error('Screenshot error:', error);
-
-    // Ensure page is closed even if an error occurs
-    if (page) {
-      try {
+      // Always close the page when done
+      if (page) {
         await page.close();
-      } catch (closeError) {
-        logger.error('Error closing page:', closeError);
       }
-    }
 
-    // If browser seems to be in a bad state, recreate it
-    if (
-      error.message.includes('Target closed') ||
-      error.message.includes('Protocol error') ||
-      error.message.includes('Target.createTarget')
-    ) {
-      try {
-        if (browserInstance) {
-          await browserInstance.close();
-          browserInstance = null;
+      // Return the screenshot as a PNG image
+      return new Response(screenshot, {
+        headers: {
+          'Content-Type': 'image/png',
+          'Cache-Control': 's-maxage=3600',
+        },
+      });
+    } catch (error: any) {
+      logger.error(`Screenshot error on attempt ${attempt + 1}:`, error);
+
+      // Ensure page is closed even if an error occurs
+      if (page) {
+        try {
+          await page.close();
+        } catch (closeError) {
+          logger.error('Error closing page:', closeError);
         }
-      } catch (closeBrowserError) {
-        logger.error('Error closing browser:', closeBrowserError);
       }
-    }
 
-    return NextResponse.json(
-      { error: error.message || 'Failed to capture screenshot' },
-      { status: 500 }
-    );
+      // If browser seems to be in a bad state, recreate it
+      if (
+        error.message.includes('Target closed') ||
+        error.message.includes('Protocol error') ||
+        error.message.includes('Target.createTarget')
+      ) {
+        try {
+          if (browserInstance) {
+            await browserInstance.close();
+            browserInstance = null;
+          }
+        } catch (closeBrowserError) {
+          logger.error('Error closing browser:', closeBrowserError);
+        }
+      }
+
+      // 如果这不是最后一次尝试，则继续
+      if (attempt < MAX_RETRIES - 1) {
+        // 等待一会儿再重试
+        await new Promise(resolve => setTimeout(resolve, 3000));
+        continue;
+      }
+
+      // 最后一次尝试失败
+      return NextResponse.json(
+        { error: error.message || 'Failed to capture screenshot after multiple attempts' },
+        { status: 500 }
+      );
+    }
   }
+
+  // 如果重试都失败
+  return NextResponse.json(
+    { error: 'Failed to capture screenshot after exhausting all retries' },
+    { status: 500 }
+  );
 }
 
 // Handle process termination to close browser
diff --git a/frontend/src/components/global-project-poller.tsx b/frontend/src/components/global-project-poller.tsx
@@ -65,8 +65,17 @@ const GlobalToastListener = () => {
             if (project.id && project.projectPath) {
               logger.info(`Taking screenshot for project ${project.id}`);
               // 获取项目URL并进行截图
-              const { domain } = await getWebUrl(project.projectPath);
-              const baseUrl = `${URL_PROTOCOL_PREFIX}://${domain}`;
+              const { domain, port } = await getWebUrl(project.projectPath);
+              
+              // 使用端口直接访问
+              let baseUrl;
+              if (port) {
+                baseUrl = `${URL_PROTOCOL_PREFIX}://localhost:${port}`;
+              } else {
+                baseUrl = `${URL_PROTOCOL_PREFIX}://${domain}`;
+              }
+              
+              logger.info(`Using URL for screenshot: ${baseUrl}`);
               
               // 等待5秒钟让服务完全启动
               logger.info(`Waiting for service to fully start before taking screenshot for project ${project.id}`);
diff --git a/frontend/src/components/root/expand-card.tsx b/frontend/src/components/root/expand-card.tsx
diff --git a/frontend/src/components/root/projects-section.tsx b/frontend/src/components/root/projects-section.tsx
diff --git a/frontend/src/graphql/schema.gql b/frontend/src/graphql/schema.gql

Original file line number	Diff line number	Diff line change
`@@ -124,6 +124,9 @@ export class FetchPublicProjectsInputs {`
`124`	`124`
`125`	`125`	`@Field()`
`126`	`126`	`size: number;`
	`127`	`+`
	`128`	`+ @Field()`
	`129`	`+ currentUserId: string;`
`127`	`130`	`}`
`128`	`131`
`129`	`132`	`@InputType()`