update
Browse files- README.md +33 -33
- app/server.py +2 -2
- templates/index.html +1 -1
README.md
CHANGED
@@ -10,70 +10,70 @@ pinned: false
|
|
10 |
|
11 |
# Minimal Browser Screenshot Experiment
|
12 |
|
13 |
-
|
14 |
|
15 |
-
##
|
16 |
|
17 |
-
-
|
18 |
-
-
|
19 |
-
-
|
20 |
-
-
|
21 |
|
22 |
-
## Technologies
|
23 |
|
24 |
- **Backend**: FastAPI, Playwright
|
25 |
-
- **Frontend**: HTML/JS
|
26 |
-
- **
|
27 |
-
- **
|
28 |
|
29 |
-
## Installation
|
30 |
|
31 |
-
###
|
32 |
|
33 |
- Python 3.10+
|
34 |
- Poetry
|
35 |
-
- Docker (
|
36 |
|
37 |
-
### Installation
|
38 |
|
39 |
```bash
|
40 |
-
#
|
41 |
-
git clone [url
|
42 |
cd minimal-browser-screenshot-experiment
|
43 |
|
44 |
-
#
|
45 |
poetry install
|
46 |
|
47 |
-
#
|
48 |
poetry run playwright install chromium
|
49 |
poetry run playwright install-deps chromium
|
50 |
|
51 |
-
#
|
52 |
poetry run uvicorn app.server:app --host 0.0.0.0 --port 7860
|
53 |
```
|
54 |
|
55 |
-
###
|
56 |
|
57 |
```bash
|
58 |
-
#
|
59 |
docker build -t minimal-browser-screenshot .
|
60 |
|
61 |
-
#
|
62 |
docker run -p 7860:7860 minimal-browser-screenshot
|
63 |
```
|
64 |
|
65 |
-
##
|
66 |
|
67 |
-
|
68 |
|
69 |
-
1.
|
70 |
-
2.
|
71 |
-
3.
|
72 |
|
73 |
-
##
|
74 |
|
75 |
-
1.
|
76 |
-
2.
|
77 |
-
3.
|
78 |
-
4.
|
79 |
-
5.
|
|
|
10 |
|
11 |
# Minimal Browser Screenshot Experiment
|
12 |
|
13 |
+
This web application allows taking screenshots of websites using a headless browser and displaying them directly in the user interface.
|
14 |
|
15 |
+
## Features
|
16 |
|
17 |
+
- Simple and responsive web interface
|
18 |
+
- URL input with default value pointing to Open LLM Leaderboard
|
19 |
+
- Screenshot capture via Playwright (Chromium browser)
|
20 |
+
- Display of results in the interface
|
21 |
|
22 |
+
## Technologies Used
|
23 |
|
24 |
- **Backend**: FastAPI, Playwright
|
25 |
+
- **Frontend**: HTML/JS with Tailwind CSS
|
26 |
+
- **Dependency Management**: Poetry
|
27 |
+
- **Deployment**: Docker, Hugging Face Spaces
|
28 |
|
29 |
+
## Local Installation
|
30 |
|
31 |
+
### Prerequisites
|
32 |
|
33 |
- Python 3.10+
|
34 |
- Poetry
|
35 |
+
- Docker (optional)
|
36 |
|
37 |
+
### Installation with Poetry
|
38 |
|
39 |
```bash
|
40 |
+
# Clone the repository
|
41 |
+
git clone [repo-url]
|
42 |
cd minimal-browser-screenshot-experiment
|
43 |
|
44 |
+
# Install dependencies
|
45 |
poetry install
|
46 |
|
47 |
+
# Install Playwright browsers
|
48 |
poetry run playwright install chromium
|
49 |
poetry run playwright install-deps chromium
|
50 |
|
51 |
+
# Launch the application
|
52 |
poetry run uvicorn app.server:app --host 0.0.0.0 --port 7860
|
53 |
```
|
54 |
|
55 |
+
### Using Docker
|
56 |
|
57 |
```bash
|
58 |
+
# Build the Docker image
|
59 |
docker build -t minimal-browser-screenshot .
|
60 |
|
61 |
+
# Run the container
|
62 |
docker run -p 7860:7860 minimal-browser-screenshot
|
63 |
```
|
64 |
|
65 |
+
## Deployment on Hugging Face Spaces
|
66 |
|
67 |
+
This application is designed to be easily deployed on a Hugging Face Space.
|
68 |
|
69 |
+
1. Create a new Docker-type Space
|
70 |
+
2. Associate this GitHub repository with your Space
|
71 |
+
3. The Space will automatically use the provided Dockerfile to build and deploy the application
|
72 |
|
73 |
+
## Usage
|
74 |
|
75 |
+
1. Access the application through your browser
|
76 |
+
2. Enter the URL of the site you want to screenshot (default: Open LLM Leaderboard)
|
77 |
+
3. Click "Take a screenshot"
|
78 |
+
4. Wait a few seconds for the headless browser to load the page and take the screenshot
|
79 |
+
5. The screenshot appears in the interface
|
app/server.py
CHANGED
@@ -52,7 +52,7 @@ async def take_screenshot(url: str = Form(...)):
|
|
52 |
|
53 |
# Take the screenshot with Playwright
|
54 |
async with async_playwright() as p:
|
55 |
-
# Configuration
|
56 |
browser = await p.chromium.launch(
|
57 |
headless=True,
|
58 |
args=[
|
@@ -65,7 +65,7 @@ async def take_screenshot(url: str = Form(...)):
|
|
65 |
'--single-process',
|
66 |
'--disable-gpu'
|
67 |
],
|
68 |
-
executable_path=None #
|
69 |
)
|
70 |
|
71 |
logger.info("Browser launched successfully")
|
|
|
52 |
|
53 |
# Take the screenshot with Playwright
|
54 |
async with async_playwright() as p:
|
55 |
+
# Configuration adapted for Docker environment
|
56 |
browser = await p.chromium.launch(
|
57 |
headless=True,
|
58 |
args=[
|
|
|
65 |
'--single-process',
|
66 |
'--disable-gpu'
|
67 |
],
|
68 |
+
executable_path=None # Use default path
|
69 |
)
|
70 |
|
71 |
logger.info("Browser launched successfully")
|
templates/index.html
CHANGED
@@ -31,7 +31,7 @@
|
|
31 |
<form id="screenshot-form" class="mb-4">
|
32 |
<div class="mb-4">
|
33 |
<label for="url" class="block text-gray-700 font-medium mb-2"
|
34 |
-
>URL
|
35 |
>
|
36 |
<input
|
37 |
type="url"
|
|
|
31 |
<form id="screenshot-form" class="mb-4">
|
32 |
<div class="mb-4">
|
33 |
<label for="url" class="block text-gray-700 font-medium mb-2"
|
34 |
+
>URL to capture</label
|
35 |
>
|
36 |
<input
|
37 |
type="url"
|