Вставьте статический HTML в шаблон Jinja2 в CKAN - PullRequest
Новая
       41

Вставьте статический HTML в шаблон Jinja2 в CKAN

0 голосов
/ 17 января 2019

Я очень новичок в области html, jinja2, шаблонов и создания веб-сайтов в целом, но мой работодатель попросил меня выполнить эту работу с внешним заказом, поэтому я стараюсь изо всех сил.

Я создаю веб-сайт в рамках CKAN, который использует Jinja2 для шаблонов. На некоторых страницах наш клиент просит включить статический файл .html (предоставленный им). Файл должен быть отображен, то есть не показывать необработанный код. Последняя страница должна выглядеть следующим образом:

structure of the page

«Внешняя часть» обрабатывается Jinja2 и следует заданному макету и шаблону, одинаковым для всех страниц. Вместо этого «внутреннее поле» должно отображать пользовательский файл .html, предоставленный клиентом (разные файлы для каждой страницы).

С целью извлечения правильного имени для настраиваемого файла .html в будущем я пока пытаюсь просто отобразить .html файл. Я уже пробовал с добавлением блока в шаблон, как 

{% block static_html_desc %}
    <script type="text/html", src="my_file.html">>/script>
{% endblock %}

но это ничего не дает (т. Е. В месте, где это должно отображаться, есть только белое пространство). Тогда я попробовал с 

{% block static_html_desc %}
    {# include 'my_file.html' %}
{% endblock %}

который работает, то есть my_file.html отображается только в том случае, если сам файл находится внутри папки /templates/, в противном случае jinja вылетает с ошибкой «шаблон не найден». Учитывая, что этот файл не динамический, неправильно помещать его в папку шаблонов; таких файлов будет несколько, поэтому более логично хранить их в общедоступной папке и получать оттуда мой шаблон jinja2.

Как уже говорилось, я совсем новичок в этом деле, поэтому любая помощь и подробности очень важны для Jinja2 или CKAN.

1 Ответ

0 голосов
/ 18 января 2019

Нашел хороший ответ сам, публикуя здесь на тот случай, если другим интересно то же самое.

Нижеследующее основано на превосходном учебнике в W3School: https://www.w3schools.com/howto/howto_html_include.asp

Я создал файл javascript custom_include_html.js и поместил его в папку /templates моего плагина CKAN. (Я считаю, что это не файл шаблона, но он имеет непосредственное отношение к шаблонам, и в настоящее время меня не беспокоит изменение пути к загрузчику jinja2, поэтому я согласен с тем, чтобы он оставался в этой папке). Содержимое файла следующее, скопировано из учебника W3School, но размещено здесь для вашей собственной справки: 

function includeHTML() {
    var x, i, elem, file, xhttp;
    z = document.getElementByTagName("*");
    for (i=0; i<z.length; i++) {
        elem = z[i];
        file = elem.getAttribute("custom-include-html");
        if (file) {
            xhttp = new XMLHttpRequest();
            xhttp.onreadystatechange = function() {
                if (this.readystate == 4) {
                    if (this.status == 200) {elem.innerHTML = this.responseText;}
                    if (this.status == 400) {elem.innerHTML = "Page not found, sorry."}
                    elem.removeAttribute("custom-include-html");
                    includeHTML();
                }
            }
            xhttp.open("GET", file, true);
            xhttp.send();
            return;
        }
    }
};

Затем в шаблоне Jinja2, определяющем страницу, в которую мне нужно вставить файл my_file.html, я сделал блок как 

{% block static_html_desc %}
    <div custom-include-html="/my_file.html"></div>
{% endblock %}

Обратите внимание, что этот файл находится в общей папке CKAN , именно так, как я хотел в моем вопросе выше.

В нижней части шаблона я называю скрипт javascript следующим образом: 

{% block custom_javascript %}
    <script type="text/javascript">

        {% include custom_include_html.js" %}

        includeHTML();

    </script>
{% endblock %}

Файл my_file.html затем обрабатывается в блоке {% block static_html_desc %}.

На этом этапе нужно всего лишь заменить вызов на my_file.html чем-то не жестко закодированным, чтобы разные страницы загружали соответствующие файлы *.html. Это легко сделать с помощью вспомогательных функций шаблонов.

...