Update app.py
Browse files
app.py
CHANGED
|
@@ -27,25 +27,23 @@ def render_fullpage_screenshot(html_code):
|
|
| 27 |
try:
|
| 28 |
driver = webdriver.Chrome(options=options)
|
| 29 |
|
| 30 |
-
# 3)
|
| 31 |
driver.set_window_size(1200, 800)
|
| 32 |
driver.get("file://" + tmp_path)
|
| 33 |
|
| 34 |
-
# 4)
|
| 35 |
WebDriverWait(driver, 10).until(
|
| 36 |
EC.presence_of_element_located((By.TAG_NAME, "body"))
|
| 37 |
)
|
| 38 |
-
#
|
| 39 |
-
time.sleep(2)
|
| 40 |
|
| 41 |
-
# 5) スクロールバーを写したくない場合はCSS
|
| 42 |
driver.execute_script(
|
| 43 |
"document.documentElement.style.overflow = 'hidden';"
|
| 44 |
"document.body.style.overflow = 'hidden';"
|
| 45 |
)
|
| 46 |
|
| 47 |
-
# 6)
|
| 48 |
-
# bodyとdocumentElementの値を比較し、より大きい方を使用
|
| 49 |
scroll_width = driver.execute_script(
|
| 50 |
"return Math.max("
|
| 51 |
"document.body.scrollWidth, document.documentElement.scrollWidth)"
|
|
@@ -55,14 +53,15 @@ def render_fullpage_screenshot(html_code):
|
|
| 55 |
"document.body.scrollHeight, document.documentElement.scrollHeight)"
|
| 56 |
)
|
| 57 |
|
| 58 |
-
# 7)
|
| 59 |
-
#
|
| 60 |
-
|
| 61 |
-
|
| 62 |
-
|
|
|
|
| 63 |
time.sleep(2) # レイアウトが変わるので少し待つ
|
| 64 |
|
| 65 |
-
#
|
| 66 |
driver.execute_script("window.scrollTo(0, 0)")
|
| 67 |
time.sleep(1)
|
| 68 |
|
|
@@ -86,8 +85,8 @@ iface = gr.Interface(
|
|
| 86 |
fn=render_fullpage_screenshot,
|
| 87 |
inputs=gr.Textbox(lines=15, label="HTMLコード入力"),
|
| 88 |
outputs=gr.Image(type="pil", label="ページ全体のスクリーンショット"),
|
| 89 |
-
title="Full Page Screenshot
|
| 90 |
-
description="HTML
|
| 91 |
)
|
| 92 |
|
| 93 |
if __name__ == "__main__":
|
|
|
|
| 27 |
try:
|
| 28 |
driver = webdriver.Chrome(options=options)
|
| 29 |
|
| 30 |
+
# 3) とりあえずある程度のウィンドウサイズでページを開く
|
| 31 |
driver.set_window_size(1200, 800)
|
| 32 |
driver.get("file://" + tmp_path)
|
| 33 |
|
| 34 |
+
# 4) ページのロード完了を待機
|
| 35 |
WebDriverWait(driver, 10).until(
|
| 36 |
EC.presence_of_element_located((By.TAG_NAME, "body"))
|
| 37 |
)
|
| 38 |
+
time.sleep(2) # 外部リソース読み込みなどを待つ
|
|
|
|
| 39 |
|
| 40 |
+
# 5) スクロールバーを写したくない場合はCSSで非表示に
|
| 41 |
driver.execute_script(
|
| 42 |
"document.documentElement.style.overflow = 'hidden';"
|
| 43 |
"document.body.style.overflow = 'hidden';"
|
| 44 |
)
|
| 45 |
|
| 46 |
+
# 6) ページ全体の幅・高さを取得 (body と documentElement の大きい方を使用)
|
|
|
|
| 47 |
scroll_width = driver.execute_script(
|
| 48 |
"return Math.max("
|
| 49 |
"document.body.scrollWidth, document.documentElement.scrollWidth)"
|
|
|
|
| 53 |
"document.body.scrollHeight, document.documentElement.scrollHeight)"
|
| 54 |
)
|
| 55 |
|
| 56 |
+
# 7) ウィンドウサイズをページ全体 + 5%上下左右マージン (=幅・高さ共に10%拡大) に設定
|
| 57 |
+
margin_factor = 0.10 # 上下左右それぞれ5%を足す => 合計で10%増やすイメージ
|
| 58 |
+
adjusted_width = int(scroll_width * (1 + margin_factor))
|
| 59 |
+
adjusted_height = int(scroll_height * (1 + margin_factor))
|
| 60 |
+
|
| 61 |
+
driver.set_window_size(adjusted_width, adjusted_height)
|
| 62 |
time.sleep(2) # レイアウトが変わるので少し待つ
|
| 63 |
|
| 64 |
+
# 念のためページ最上部にスクロールしてからキャプチャ
|
| 65 |
driver.execute_script("window.scrollTo(0, 0)")
|
| 66 |
time.sleep(1)
|
| 67 |
|
|
|
|
| 85 |
fn=render_fullpage_screenshot,
|
| 86 |
inputs=gr.Textbox(lines=15, label="HTMLコード入力"),
|
| 87 |
outputs=gr.Image(type="pil", label="ページ全体のスクリーンショット"),
|
| 88 |
+
title="Full Page Screenshot with Margin",
|
| 89 |
+
description="HTMLをヘッドレスブラウザでレンダリングし、ページ全体+5%のマージンをつけて1枚の画像として取得します。"
|
| 90 |
)
|
| 91 |
|
| 92 |
if __name__ == "__main__":
|