tomo2chin2 commited on
Commit
ccc6222
·
verified ·
1 Parent(s): a1a59cd

Update app.py

Browse files
Files changed (1) hide show
  1. app.py +26 -26
app.py CHANGED
@@ -10,7 +10,11 @@ import tempfile
10
  import time
11
  import os
12
 
13
- def render_fullpage_screenshot(html_code):
 
 
 
 
14
  # 1) HTMLコードを一時ファイルに保存
15
  tmp_file = tempfile.NamedTemporaryFile(suffix=".html", delete=False)
16
  tmp_path = tmp_file.name
@@ -27,7 +31,7 @@ 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
 
@@ -35,60 +39,56 @@ def render_fullpage_screenshot(html_code):
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)"
52
  )
53
  scroll_height = driver.execute_script(
54
- "return Math.max("
55
- "document.body.scrollHeight, document.documentElement.scrollHeight)"
56
  )
57
 
58
- # 上下方向に4%の余裕を加えた高さを計算
59
- # (上下に2%ずつ、合計4%を足すイメージ)
60
- adjusted_height = int(scroll_height * 1.04)
61
-
62
- # 7) ウィンドウサイズを (幅はそのまま, 高さのみ4%増し) に設定
63
  driver.set_window_size(scroll_width, adjusted_height)
64
- time.sleep(2) # レイアウトが変わるので少し待つ
65
 
66
- # 念のためページ最上部にスクロール
67
  driver.execute_script("window.scrollTo(0, 0)")
68
  time.sleep(1)
69
 
70
- # 8) スクリーンショットを取得
71
  png = driver.get_screenshot_as_png()
72
 
73
  except Exception as e:
74
- # 失敗時は1x1の黒画像を返す
75
  return Image.new('RGB', (1, 1), color=(0, 0, 0))
76
-
77
  finally:
78
  driver.quit()
79
  if os.path.exists(tmp_path):
80
  os.remove(tmp_path)
81
 
82
- # 9) PNGバイナリをPIL.Imageに変換して返す
83
  return Image.open(BytesIO(png))
84
 
85
- # Gradioインターフェース
86
  iface = gr.Interface(
87
  fn=render_fullpage_screenshot,
88
- inputs=gr.Textbox(lines=15, label="HTMLコード入力"),
 
 
 
89
  outputs=gr.Image(type="pil", label="ページ全体のスクリーンショット"),
90
- title="Full Page Screenshot App (上下4%余裕)",
91
- description="HTMLをヘッドレスブラウザでレンダリングし、ページ全体を1枚の画像として取得します。上下にだけ4%の余裕を加えます。"
92
  )
93
 
94
  if __name__ == "__main__":
 
10
  import time
11
  import os
12
 
13
+ def render_fullpage_screenshot(html_code, extension_percentage):
14
+ """
15
+ html_code: HTMLのソースコード文字列
16
+ extension_percentage: 上下に追加する余裕の% (例: 4なら合計4%の余裕)
17
+ """
18
  # 1) HTMLコードを一時ファイルに保存
19
  tmp_file = tempfile.NamedTemporaryFile(suffix=".html", delete=False)
20
  tmp_path = tmp_file.name
 
31
  try:
32
  driver = webdriver.Chrome(options=options)
33
 
34
+ # 3) 初期ウィンドウサイズでページを読み込む
35
  driver.set_window_size(1200, 800)
36
  driver.get("file://" + tmp_path)
37
 
 
39
  WebDriverWait(driver, 10).until(
40
  EC.presence_of_element_located((By.TAG_NAME, "body"))
41
  )
42
+ time.sleep(2) # 外部リソースの読み込み待機
 
43
 
44
+ # 5) スクロールバーがキャプチャに写らないようCSSで非表示
45
  driver.execute_script(
46
  "document.documentElement.style.overflow = 'hidden';"
47
  "document.body.style.overflow = 'hidden';"
48
  )
49
 
50
+ # 6) ページ全体の幅・高さを正確に取得 (bodyとdocumentElementの両方から)
 
51
  scroll_width = driver.execute_script(
52
+ "return Math.max(document.body.scrollWidth, document.documentElement.scrollWidth)"
 
53
  )
54
  scroll_height = driver.execute_script(
55
+ "return Math.max(document.body.scrollHeight, document.documentElement.scrollHeight)"
 
56
  )
57
 
58
+ # 7) 上下方向にだけユーザー指定の余裕(%)を加えた高さを計算
59
+ adjusted_height = int(scroll_height * (1 + extension_percentage/100))
60
+
61
+ # 8) ウィンドウサイズを、幅はそのまま、縦はadjusted_heightに変更
 
62
  driver.set_window_size(scroll_width, adjusted_height)
63
+ time.sleep(2) # レイアウトの安定化待機
64
 
65
+ # 念のため最上部にスクロール
66
  driver.execute_script("window.scrollTo(0, 0)")
67
  time.sleep(1)
68
 
69
+ # 9) スクリーンショット取得
70
  png = driver.get_screenshot_as_png()
71
 
72
  except Exception as e:
73
+ # エラー時は1x1の黒画像を返す
74
  return Image.new('RGB', (1, 1), color=(0, 0, 0))
 
75
  finally:
76
  driver.quit()
77
  if os.path.exists(tmp_path):
78
  os.remove(tmp_path)
79
 
 
80
  return Image.open(BytesIO(png))
81
 
82
+ # Gradioインターフェースの定義
83
  iface = gr.Interface(
84
  fn=render_fullpage_screenshot,
85
+ inputs=[
86
+ gr.Textbox(lines=15, label="HTMLコード入力"),
87
+ gr.Slider(minimum=0, maximum=20, step=0.5, value=4, label="上下高さ拡張率(%)")
88
+ ],
89
  outputs=gr.Image(type="pil", label="ページ全体のスクリーンショット"),
90
+ title="Full Page Screenshot App (高さ拡張調整可能)",
91
+ description="HTMLをヘッドレスブラウザでレンダリングし、ページ全体を1枚の画像として取得します。上下のみユーザー指定の余裕(%)を追加します。"
92
  )
93
 
94
  if __name__ == "__main__":