Я пытаюсь визуализировать HTML-форму, используя данные из файла JSON с помощью JavaScript, чтобы сохранить заполненную форму в формате PDF. Когда я открываю файл index.html непосредственно из файловой системы (используя протокол file://), он не может получить данные JSON, необходимые для заполнения формы. Javascript также не запустился.
У меня есть сценарий Playwright, который переходит к локальному HTML-файлу и пытается его отобразить.
with sync_playwright() as p:
browser = p.chromium.launch(headless=False)
page = browser.new_page()
current_directory = os.getcwd()
index_html_path = os.path.join(current_directory, 'temp', 'index.html')
index_html_url = f'file://{index_html_path}'
page.goto(index_html_url)
page.pdf(path='formoffline.pdf')
print('Saved formoffline.pdf')
browser.close()
Я ожидал, что данные JSON будут загружены и обработаны без проблем. Вместо этого выходные данные представляют собой простой HTML без загрузки Javascript или JSON. Эта проблема возникает, когда я использую Playwright для открытия файла HTML. Когда я запускаю сервер с помощью liveserver или node, он правильно работает в том же каталоге. Я не уверен, что вызывает эту проблему и как ее решить.
РЕДАКТИРОВАТЬ: Я хочу избежать запуска сервера для этого, это будет работать и у меня есть решение, но я хочу максимально сократить накладные расходы.
Минимально воспроизводимый пример:
gen.py
import os
from playwright.sync_api import sync_playwright
def generate_pdf():
with sync_playwright() as p:
browser = p.chromium.launch(headless=True)
page = browser.new_page()
current_directory = os.getcwd()
index_html_path = os.path.join(current_directory, 'index.html')
index_html_url = f'file://{index_html_path}'
page.goto(index_html_url)
page.pdf(path='output.pdf')
browser.close()
generate_pdf()
index.html
Minimal Reproducible Example
script.js
document.addEventListener("DOMContentLoaded", function () {
const contentDiv = document.getElementById("content");
fetch("data.json")
.then(response => response.json())
.then(data => {
const message = data.message;
contentDiv.innerHTML = `
${message}
`;
})
.catch(error => console.error("Error loading JSON:", error));
});
data.json
{
"message": "This is dynamic content loaded from a JSON file."
}
Подробнее здесь: https://stackoverflow.com/questions/785 ... javascript
