Как встроить python в html

Надоел JavaScript — используй браузерный Python

Мой опыт разработки игры «Змейка» на Brython

«Погоди, что?» – думаю, большинство читателей отреагирует на заголовок именно так.

В смысле «просто использовать Python в браузере»?

Все знают, что в браузерах работает только JavaScript.

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

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

Знакомство с Brython

Brython — это реализация Python3, написанная на JavaScript, которая позволяет писать код на Python для веба.

По сути, это JavaScript-библиотека, которая преобразует ваш код на Python в эквивалентный JS и исполняет его в рантайме.

Поскольку написание браузерного кода на Python звучит круто, я решил попробовать.

Разработка «Змейки» на Brython

Вот ссылка на мой сайт, где вы можете попробовать версии «Змейки» на JavaScript и Brython. А вот ссылка на GitHub c исходным кодом.

Для того, чтобы опробовать Brython, я решил написать классическую «Змейку».

Так как я не специалист по работе с Canvas в HTML и не разработчик игр, я решил использовать эту JavaScript-реализацию в качестве отправной точки. Когда-то я уже создавал свою «Змейку» на основе Canvas, но эта реализация более аккуратная и компактная.

А еще автор написал ее менее чем за 5 минут. Надо отдать должное Крису Делеону, это очень впечатляет.

Итак, я добавил к реализации Криса подсчет очков и сохранение лучшего результата, а также немного улучшил интерфейс (добавил кнопку паузы и кнопку с инструкциями). Затем я портировал игру на Brython.

JavaScript оказался таким, и я не буду размещать этот код здесь, потому наша цель – сфокусироваться на Brython.

Несмотря на то, что большая часть кода на Brython была «дословным переводом» с JS, некоторые части (например, функционал подсчета очков) были написаны непосредственно на Brython, а затем реализованы на JS – чтобы посмотреть на отличия.

Окончательный результат выглядит следующим образом:

Итак, основываясь на этом фрагменте, давайте разберемся в базовых понятиях Brython

Подключение brython.js

Для использования Brython не требуется установка. Просто импортируйте скрипт внутри head :

Источник

CGI: пишем простой сайт на Python. Часть 2: Обработка форм, cookies

В первой части мы написали Hello world. Сегодня мы рассмотрим несколько более сложные вещи: обработку данных форм и cookies.

Получение данных из форм

Итак, во-первых разберёмся с формами. В модуле CGI есть полезный класс: FieldStorage, который содержит в себе переданную в форме информацию. По сути дела этот класс представляет из себя словарь, обладающий теми же свойствами, что и обычный словарь в python.

У класса FieldStorage есть 2 метода получения значений данных формы:

Разберём на примере: создадим в нашей папке файл index.html со следующим содержимым (это будет наша форма, данные из которой мы будем обрабатывать):

Попробуем это в действии (кто сидит на linux, не забудьте поставить права на выполнение).

Но есть нюанс.

А если попробовать так?

Это серьёзная уязвимость, поэтому от неё нужно избавляться. Для этого нужно (в самом простом случае) экранировать все опасные символы. Это можно сделать с помощью функции escape из модуля html.

Результат можете проверить сами.

Cookies

Cookies (печеньки) — небольшой фрагмент данных, отправленный веб-сервером и сохраняемый на компьютере пользователя. Браузер всякий раз при попытке открыть страницу соответствующего сайта пересылает этот фрагмент данных веб-серверу в составе HTTP-запроса.

Отправка печенек осуществляется заголовком Set-cookie:

Например, если сохранить этот скрипт в /cgi-bin/cookie.py и зайти на localhost:8000/cgi-bin/cookie.py, то вам поставится печенька с именем name и значением value. Срок её хранения до мая 2033 года, отправляется повторно на сервер только к скриптам, которые расположены в /cgi-bin/, и передается только http-запросами (её нельзя получить из браузера пользователя с помощью javascript).

Все эти параметры не являются обязательными. Можно написать так:

Тогда храниться она будет до того момента, когда закроется браузер, будет отправляться на сервер для любых документов (и для /index.html тоже, в отличие от предыдущего случая). Также её можно будет получить средствами javascript (поскольку не был установлен флаг httponly).

Обработка Cookies

Теперь научимся получать cookies. Они передаются на сервер и доступны в переменной os.environ (словарь, cookies хранятся по ключу HTTP_COOKIE). Они передаются в виде пар ключ=значение, что не очень удобно при обработке. Для упрощения работы можно использовать модуль http.cookies.

Напишем простой скрипт (/cgi-bin/cookie.py), проверяющий, установлена ли кука, и если нет, устанавливает:

Так страница выглядит после первого запроса:

И после обновления страницы:

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

Источник

Как встроить интерпретатор Python на вашем сайте?

Хотите сделать свой сайт более интерактивным? Встроить интерпретатор Python на ваш сайт! Это не только увеличивает интерактивность и удобство использования вашего сайта – и создает счастливых пользователей для вашего веб-бизнеса. Он также увеличивает среднее время, проведенное на вашем сайте, потому что люди будут пробовать вещи. Так что это на самом деле … Как встроить интерпретатор Python на вашем сайте? Читать далее “

Хотите сделать свой сайт более интерактивным? Встроить интерпретатор Python на ваш сайт!

Это не только увеличивает интерактивность и удобство использования вашего сайта – и создает счастливых пользователей для вашего веб-бизнеса. Он также увеличивает среднее время, проведенное на вашем сайте, потому что люди будут пробовать вещи.

Таким образом, это на самом деле хорошая идея с точки зрения «поисковой оптимизации», потому что Google и другие поисковые системы отслеживают время, проведенное на вашем сайте и используйте его как критерий ранжирования.

Как встроить интерпретатор Python на вашем сайте?

Вот небольшое визуальное руководство о том, как это сделать:

Вы хотите развивать навыки Хорошо округлый Python Professional То же оплачивается в процессе? Станьте питоном фрилансером и закажите свою книгу Оставляя крысиную гонку с Python На Amazon ( Kindle/Print )!

Затем мы погрузимся в больше инструментов и более подробную информацию, чтобы помочь вам понять это. Поскольку вы являетесь кодером Python, я уверен, что вы хотите знать о технических деталях встраивания интерпретатора Python на вашем сайте – как это работает? А где работает код? Может ли это разрушить свой сервер? Ответы на эти вопросы приведены ниже.

Как выглядит встроенный переводчик Python?

Вот пример встроенного интерпретатора Python:

Попробуй сам. Вы можете изменить код в встроенном интерпретатере. Затем вы можете бежать и играть с кодом. (Можете ли вы найти ошибку?)

Как встроить интерпретатор Python, как это в HTML?

Предыдущий встроенный интерпретатор Python был создан с отличным веб-сервисом Trinket.io Отказ

Просто следуйте пошаговой руководству, чтобы встроить свой собственный интерпретатор сделки в WordPress или любую другую веб-каркас, который позволяет изменять HTML-код.

Как встраивает встраивание переводчика Python?

Выполнение кода на самом деле происходит на машине вашего пользователя в JavaScript.

Это может спутать вас: он выполняет код Python в JavaScript? Точно! Причина в том, что любой браузер может наклонно выполнять JavaScript (но не Python).

Кроме того, это предотвращает пользователей запустить вредоносный код на вашем веб-сервере, как следующее:

Если вы позволите пользователю запустить код на вашем веб-сервере, они могут легко взломать свой сервер и удалить все данные (или даже отправлять его на свой собственный сервер).

Следовательно, он гораздо безопасен для запуска кода Python в машине вашего пользователя, используя мощные возможности браузера запущенного кода JavaScript.

Таким образом, злонамеренный пользователь Алиса не может ни взломать свой сервер через атакующий техник под названием Скрипты по перекрестному сайту Это позволяет ей выполнить код на вашем сервере, и она не может выполнять DDOS атакует Выполнение сотен тысяч фиктивных программ от сотен тысяч виртуальных машин, которые она контролирует.

Какие инструменты существуют для встраивания кода в ваш HTML-сайт?

Это все инструменты, которые позволяют вам встроить код в ваш сайт HTML:

Мы обсудим их дальше.

Вы также можете использовать другие инструменты. Один отличный инструмент, который я только что обнаружил, это reft.it Отказ Вот что похоже:

Вы можете поделиться фрагментом кода или встраивать его с помощью HTML IFrame. Просто скопируйте и вставьте код вставки в свой собственный веб-сайт. Работает так же, как Trinket.io Отказ

Вот один такой встроенный переводчик Python:

Другой мощный инструмент для встраивания вашего собственного интерпретатора с предварительно инициализированным кодом является БРИТОН Отказ Как и другие инструменты, это полностью основано на JavaScript, поэтому на вашем собственном сервере нет кода.

Лучший инструмент, который я нашел, это CreateWithCode :

Куда пойти отсюда?

Если у вас есть свой собственный веб-сайт Python, вам лучше знать, как написать код Pythonic. Есть много троллей, которые ненавидят читать код не питон. Они придут за тобой. 😉.

Поэтому, если вы хотите узнать, как быстро написать код Python, скачайте мой Python Cheat Steets. Десятки тысяч людей любят эти чит-листы и уже скачали, напечатали и поделились их!

Работая в качестве исследователя в распределенных системах, доктор Кристиан Майер нашел свою любовь к учению студентов компьютерных наук.

Чтобы помочь студентам достичь более высоких уровней успеха Python, он основал сайт программирования образования Finxter.com Отказ Он автор популярной книги программирования Python One-listers (Nostarch 2020), Coauthor of Кофе-брейк Python Серия самооставленных книг, энтузиаста компьютерных наук, Фрилансера и владелец одного из лучших 10 крупнейших Питон блоги по всему миру.

Его страсти пишут, чтение и кодирование. Но его величайшая страсть состоит в том, чтобы служить стремлению кодер через Finxter и помогать им повысить свои навыки. Вы можете присоединиться к его бесплатной академии электронной почты здесь.

Источник

Как я могу связать свой скрипт на Python с моим HTML-файлом?

По сути, я получаю некоторые данные с веб-страницы и помещаю их в массив, я хочу вывести содержимое этого массива в таблицу в файле HTML. После некоторых исследований я обнаружил, что использование шаблона мако может быть лучшим решением, но я не понимаю, как его использовать? Может ли кто-нибудь провести меня по шагам или предложить лучшее решение для выполнения этого сценария Python и вывода его результатов в Интернете?

2 ответа

В вашей задаче есть две подзадачи:

Мако может помочь вам с первым. Для второго есть различные решения, которые зависят от вашей ситуации.

Генерировать HTML

Сначала вы должны выбрать шаблон, то есть общий каркас, в котором ваши данные будут заполнены. Если вы хотите показать свои данные только без дополнительной информации, ответ будет загадочным, но если он станет более сложным, он будет полезно что-то использовать как мако. Как выглядит общий шаблон? Вот действительно простой:

Это не очень много. Это как одна строка. Итак, давайте добавим немного Python:

Этот шаблон содержит переменную, которую вам нужно будет предоставить:

Вам как минимум понадобятся петли:

Вы можете использовать произвольный HTML внутри этого. Конечно же, mako может делать более мощные вещи, но в одном посте с переполнением стека мало места для этого. Вы можете прочитать базовое использование и / или Синтаксис страницы языка mako для получения дополнительной информации. Но с представленными здесь структурами вы сможете выполнить свою задачу.

Служить HTML

Вам все еще нужно каким-то образом вывести HTML-код в Интернет или куда угодно. У вас есть несколько возможностей, которые зависят от того, что вы хотите:

Статический или динамический

Ваши данные статичны? Это означает, что ваши данные изменятся в ближайшее время? Если нет, то вы можете просто сгенерировать HTML на локальном компьютере, а затем отправить HTML на простой веб-сервер, который обслуживает HTML.

Ваши данные динамичны? Это означает, что ваши данные часто изменяются, и нецелесообразно включать питание на вашем локальном компьютере, запускать сценарий и затем передавать HTML. Вместо этого вы должны указать серверу, который обслуживает вашу веб-страницу, запускать ваш скрипт при каждом изменении данных. Существует более одной возможности сделать это: вы можете использовать CGI (веб-сервер, такой как nginx или apache, вызывает ваш скрипт на python и обслуживать вывод) или инфраструктуру wsgi, например django или фляга или другие. Конечно, их также нужно обслуживать, используя «типичный» веб-сервер, такой как apache или nginx, или что-то вроде gunicorn.

Если вам нужно только, чтобы он был доступен в локальной сети, вы можете просто запустить веб-сервер на локальном компьютере. Если вы не ожидаете большого трафика и безопасности, это не проблема, вы можете использовать http-сервер в стандартной библиотеке Python.

Если вам нужно, чтобы он был доступен в Интернете, вам нужно искать веб-сервер. Есть несколько услуг, которые бесплатны для низкого трафика. Вот некоторые из них: heroku, которая ориентирована на python, поэтому она подходит для динамического варианта использования. страницы Github, где вы можете напрямую обслуживать HTML из репозитория github. Я думаю, что это может служить только статический HTML.

Источник

Brython: Python в вашем браузере

Если вы веб‑разработчик, который предпочитает Python, а не JavaScript, то Brython (реализация Python, работающая в браузере) может быть привлекательным вариантом.

JavaScript де‑факто является языком интерфейса веб‑разработки. Сложные механизмы JavaScript являются неотъемлемой частью всех современных интернет‑браузеров и, естественно, побуждают разработчиков кодировать интерфейсные веб‑приложения на JavaScript. Brython предлагает лучшее из обоих миров, делая Python равноправным гражданином в браузере, который имеет доступ ко всем существующим библиотекам JavaScript и API, доступным в браузере.

В этом уроке вы узнаете, как:

Как разработчик Python среднего уровня, знакомый с веб‑разработкой, вы получите максимальную отдачу от этого урока, если у вас также есть некоторые знания HTML и JavaScript. Чтобы освежить в памяти JavaScript, посмотрите Python против JavaScript для Pythonistas.

Содержание

Запуск Python в браузере: преимущества ↑

Хотя JavaScript является повсеместным языком интерфейсной веб‑разработки, к вам могут относиться следующие моменты:

Какова бы ни была причина, многие разработчики предпочли бы альтернативу JavaScript на основе Python для использования возможностей браузера. Запуск Python в браузере дает несколько преимуществ, что позволяет:

Одним из побочных эффектов использования Python в браузере является потеря производительности по сравнению с тем же кодом в JavaScript. Однако, этот недостаток не перевешивает ни одного из перечисленных выше достоинств.

Реализация изоморфной веб‑разработки ↑

Изоморфный JavaScript или Universal JavaScript (универсальный JavaScript), подчеркивает, что приложения JavaScript должны работать как на клиенте, так и на сервере. Предполагается, что серверная часть основана на JavaScript, а именно на сервере Node. Разработчики Python, использующие Flask или Django, также могут применять принципы изоморфизма к Python,при условии, что они могут запускать Python в браузере.

Brython позволяет создавать интерфейс на Python и обмениваться модулями между клиентом и сервером. Например, вы можете поделиться функциями проверки, такими как следующий код, который нормализует и проверяет номера телефонов в США:

Доступ к веб‑API ↑

Интернет-браузеры предоставляют стандартизированные Веб‑API для JavaScript. Эти стандарты являются частью стандарта жизни HTML. Вот некоторые примеры веб‑API:

Brython позволяет не только использовать веб‑API, но и взаимодействовать с JavaScript. С некоторыми веб‑API мы будем работать в следующем разделе.

Библиотеки прототипов и JavaScript ↑

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

Откройте онлайн-редактор и введите следующий код:

Вот как работает этот код:

Обратите внимание, что при выполнении этого кода в редакторе Brython блокировка может иметь значение True или False. Он должен иметь значение True, если вы выполняете тот же код в консоли Brython.
Щелкните Выполнить над панелью вывода, чтобы увидеть следующий результат:

Попробуйте изменить язык с fr на es и посмотрите на результат. Коды языков, поддерживаемые этим API, перечислены в документации HelloSalut.

Примечание. HelloSalut — один из общедоступных API-интерфейсов, доступных в Интернете и перечисленных в проекте GitHub Public APIs.

Вы можете изменить фрагмент кода в онлайн-редакторе, чтобы использовать другой общедоступный API. Например, попробуйте получить случайный общедоступный API из проекта Public APIs:

Скопируйте приведенный выше код в онлайн-редактор Brython и нажмите «Выполнить», чтобы отобразить результат. Вот пример в формате JSON:

Поскольку конечная точка получает случайный проект, вы, вероятно, получите другой результат. Дополнительные сведения о формате JSON см. В статье Working With JSON Data in Python (Работа с данными JSON в Python).

Вы можете использовать прототипирование для проверки обычного кода Python, как в интерпретаторе Python. Поскольку вы находитесь в контексте браузера, Brython также предоставляет способы:

В качестве ярлыка вы можете воспользоваться большинством функций, описанных выше, открыв консоль или редактор, доступный на веб‑сайте Brython. Для этого не требуется ничего устанавливать или запускать на локальном компьютере. Вместо этого он дает вам онлайн-площадку для взаимодействия как с Python, так и с веб‑технологиями.

Обучение студентов Python ↑

Brython — это и компилятор Python, и интерпретатор, написанный на JavaScript. В результате вы можете компилировать и запускать код Python в браузере. Хороший пример этой функции демонстрирует онлайн-редактор, доступный на веб‑сайте Brython.

В онлайн-редакторе Python работает в браузере. Нет необходимости устанавливать Python на машину, нет необходимости отправлять код на сервер для выполнения. Пользователь получает немедленную обратную связь, и такой подход не подвергает серверную часть вредоносным скриптам. Студенты могут экспериментировать с Python на любом устройстве с работающим браузером, например на телефонах или Chromebook, даже при нестабильном подключении к Интернету.

Учет эффективности ↑

На сайте Brython отмечается, что скорость выполнения реализации сопоставима с CPython. Но Brython выполняется в браузере, и ссылка в этой среде — это JavaScript, встроенный в движок браузера. В результате ожидайте, что Brython будет медленнее, чем написанный вручную, хорошо настроенный JavaScript. Brython компилирует код Python в JavaScript, а затем выполняет сгенерированный код. Эти шаги влияют на общую производительность, и Brython не всегда может соответствовать вашим требованиям к производительности. В некоторых случаях вам может потребоваться делегировать выполнение кода JavaScript или даже WebAssembly. Вы увидите, как создавать WebAssembly и как использовать полученный код на Python в разделе, посвященном WebAssembly.

Однако не позволяйте воспринимаемой производительности отвлекать вас от использования Brython. Например, импорт модулей Python может привести к загрузке соответствующего модуля с сервера. Чтобы проиллюстрировать эту ситуацию,откройте консоль Brython и выполните следующий код:

Заметна задержка до появления подсказки (390 мс на тестовой машине). Это связано с тем, что Brython необходимо загрузить uuid и его зависимости, а затем скомпилировать загруженные ресурсы. Однако с этого момента нет задержки при выполнении функций, доступных в uuid. Например, вы можете сгенерировать случайный универсальный уникальный идентификатор, UUID версии 4, с помощью следующего кода:

Вызов uuid.uuid4() генерирует объект UUID, строковое представление которого печатается в консоли. Вызов uuid.uuid4() немедленно возвращается и выполняется намного быстрее, чем первоначальный импорт модуля uuid.

Развлечение ↑

Вы, если ещё читаете сей труд, вероятно, заинтересованы в написании кода Python в браузере. Наблюдение за выполнением кода Python в браузере «щекочет» большинство питонистов, пробуждая веселье от бесконечных возможностей.

Автор Brython, Пьер Кентель и все участники проекта, взяв на себя огромную задачу по обеспечению совместимости этого языка с веб‑браузером, как и вы, помнили об удовольствии от Python.

Чтобы доказать это, вызовите в браузере интерактивную консоль Brython и в командной строке Python введите следующее:

Подобно Python на вашем локальном компьютере, Brython компилирует и выполняет инструкции на лету и печатает The Zen of Python. Это происходит в браузере, и выполнение кода Python не требует какого-либо взаимодействия с внутренним сервером:

Можете попробовать еще одно классическое пасхальное яйцо Python в той же среде браузера со следующим кодом:

В Brython присутствует тот же юмор, который вы найдете в эталонной реализации Python.

Теперь, когда вы знакомы с основами работы с Brython, познакомитесь с более продвинутыми функциями в следующих разделах.

Установка Brython

Поэкспериментировать с онлайн-консолью Brython — хорошее начало, но оно не позволит вам развернуть код Python. Есть несколько различных вариантов установки Brython в локальной среде:

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

Установка CDN ↑

Content Delivery Network એ (CDN) — это сеть серверов, которая позволяет повысить производительность и скорость загрузки онлайн-контента. Вы можете установить библиотеки Brython из нескольких разных CDN:

Вы можете выбрать эту установку, если хотите развернуть статический веб‑сайт и добавить динамическое поведение на свои страницы с минимальными накладными расходами. Вы можете рассматривать этот вариант как замену jQuery, за исключением использования Python, а не JavaScript.

Чтобы проиллюстрировать использование Brython с CDN, вы воспользуетесь CDNJS. Создайте файл со следующим HTML‑кодом:

Вот ключевые элементы этой HTML‑страницы:

Сохраните файл как index.html, затем дважды щелкните файл, чтобы открыть его в интернет‑браузере по умолчанию. Браузер отображает окно сообщения с надписью «Hello Real Python!» Нажмите ОК, чтобы закрыть окно сообщения:

Чтобы уменьшить размер загружаемого файла, особенно в производственной среде, рассмотрите возможность использования минимизированной версии brython.js:

Уменьшенная версия сократит время загрузки и предполагаемую задержку с точки зрения пользователя. Изучив принцип работы Brython, вы узнаете, как браузер загружает Brython и как выполняется приведенный выше код Python.

Установка GitHub ↑

Установка GitHub очень похожа на установку CDN, но позволяет реализовать приложения Brython с последней версией разработки. Вы можете скопировать предыдущий пример и изменить URL-адрес в элементе head, чтобы получить следующий index.html:

После сохранения этого файла в локальном каталоге дважды щелкните index.html, чтобы отобразить в браузере ту же страницу, которую вы получили при установке CDN.

Установка PyPI ↑

Пока что вам не нужно было ничего устанавливать в локальной среде. Вместо этого вы указали в HTML‑файле, где браузер может найти пакет Brython. Когда браузер открывает страницу, он загружает файл JavaScript Brython из соответствующей среды, либо из CDN, либо из GitHub. Brython также доступен для локальной установки на PyPI. Установка PyPI для вас, если:

При установке Brython из PyPI устанавливается brython‑cli, где используется командная строка, который можно автоматизировать такие функций, как создание шаблона проекта или упаковка и объединение модулей для упрощения развертывания проекта Brython.

Для получения дополнительных сведений обратитесь к документации по локальной установке, чтобы узнать о возможностях brython‑cli, доступных в вашей среде после установки. brython‑cli доступен только при этом типе установки. Он недоступен, если вы устанавливаете из CDN или с помощью npm. brython‑cli в действии вы увидите позже в этом руководстве.

Перед установкой Brython вы хотите создать виртуальную среду Python для этого проекта.

В Linux или macOS выполните следующие команды:

В Windows вы можете поступить следующим образом:

Вы только что создали специальную среду Python для своего проекта и обновили pip до последней версии.

На следующих шагах вы установите Brython и создадите проект по умолчанию. Команды одинаковы в Linux, macOS и Windows:

Вы установили Brython из PyPI, создали пустую папку с именем web и сгенерировали скелет проекта по умолчанию, выполнив brython‑cli, скопированный в вашу виртуальную среду во время установки.

Для проверки этого недавно созданного веб‑проекта, можете запустить локальный веб‑сервер Python с помощью следующих команд:

При таком подходе файлы JavaScript Brython загружаются непосредственно из вашей локальной среды. Обратите внимание на атрибут src в элементе head index.html:

В HTML‑файле продемонстрированы несколько новых функций Brython:

Оператор используется для добавления дочернего узла к элементу DOM. Вы увидите более подробную информацию об использовании операторов, специфичных для Brython, в DOM API в Brython.

Установка npm ↑

Если вы хорошо разбираетесь в экосистеме JavaScript, то установка npm может вам понравиться. Перед установкой требуются Node.js и npm.

Установка с помощью npm сделает модули JavaScript Brython доступными в вашем проекте, как и любые другие модули JavaScript. После этого вы сможете воспользоваться преимуществами своего любимого инструментария JavaScript для тестирования, упаковки и развертывания интерпретатора и библиотек Brython. Эта установка идеальна, если у вас уже есть существующие библиотеки JavaScript, установленные с npm.

Примечание. Если в вашей системе не установлены Node.js и npm, прочтите оставшуюся часть этого раздела только для информации, так как вы можете спокойно пропустить саму установку. Дальнейшая часть руководства не зависит от метода установки npm для любого из примеров.

Чтобы интегрировать Brython в свой проект, выполните следующую команду:

Вы можете игнорировать предупреждения и отметить, что Brython был добавлен в ваш проект. Для подтверждения откройте package.json и убедитесь, что у вас есть свойство dependencies, указывающее на объект, содержащий запись brython:

Что касается предыдущих примеров, вы можете создать следующий index.html и открыть его в своем браузере. веб‑сервер для этого примера не нужен, потому что браузер может загружать файл JavaScript node_modules/brython/brython.js локально:

Браузер отображает index.html и загружает brython.js из URL-адреса скрипта в index.html. В этом примере вы увидели другой способ установки Brython, который использует преимущества экосистемы JavaScript. В оставшейся части руководства вы напишете код, основанный на установке CDN или установке PyPI.

Обзор вариантов установки Brython ↑

Брайтон одной ногой находится в мире Python, а другой — в JavaScript. Различные варианты установки иллюстрируют эту кросс-технологическую ситуацию. Выберите инсталляцию, которая кажется вам наиболее привлекательной, исходя из вашего опыта.

В следующей таблице приведены некоторые рекомендации:

В таблице перечислены различные доступные варианты установки. В следующем разделе вы узнаете больше о том, как работает Brython.

Общие сведения о том, как работает Brython ↑

Тур по различным способам установки Brython дал некоторые общие сведения о том, как работает реализация. Вот краткое изложение некоторых характеристик, которые описаны в этом уроке:

В следующих разделах вы подробнее узнаете, как работает Brython.

Основные компоненты Brython ↑

Ядро Brython содержится в brython.js или brython.min.js, минимизированной версии движка Brython. Оба включают следующие ключевые компоненты:

Вы увидите каждый из этих компонентов в действии, проработав примеры этого урока.

Стандартная библиотека Brython ↑

Теперь, когда у вас есть общее представление об основном файле Brython, brython.js, вы узнаете о его сопутствующем файле brython_stdlib.js.

brython_stdlib.js есть стандартная библиотека Python. По мере создания этого файла Brython компилирует стандартную библиотеку Python в JavaScript и объединяет результат в пакет brython_stdlib.js.
Предполагается, что Brython максимально приближен к CPython, эталонной реализации Python. Для получения дополнительной информации о CPython ознакомьтесь с вашим руководством по исходному коду CPython и внутренним компонентам CPython.

Поскольку Brython работает в контексте веб‑браузера, у него есть некоторые ограничения. Например,браузер не разрешает прямой доступ к файловой системе, поэтому открыть файл с помощью os.open() невозможно. Функции, не относящиеся к веб‑браузеру, могут быть не реализованы. Например, приведенный ниже код работает в среде Brython:

os.unlink() вызывает исключение, поскольку удаление локального файла из среды браузера небезопасно, а API записей файлов и каталогов — это только черновик предложения.

Brython поддерживает только собственные модули Python. Он не поддерживает модули Python, созданные на C, если они не были повторно реализованы в JavaScript. Например, hashlib написан на C в CPython и реализован на JavaScript в Brython. Вы можете ознакомиться со списком модулей в дистрибутиве Brython для сравнения с реализацией CPython.

Вам необходимо включить brython_stdlib.js или brython_stdlib.min.js для импорта модулей из стандартной библиотеки Python.

Brython в действии ↑

На этом этапе вам может быть интересно, как Brython ведет себя в браузере, который знает только о своем движке JavaScript. Повторно используя предыдущие примеры и инструменты, доступные в браузере, вы узнаете о процессе, участвующем в выполнении кода Python в браузере.

В разделе, посвященном установке сервера CDN, вы видели следующий пример:

После загрузки и анализа HTML‑страницы brython() выполняет следующие шаги:

Другой вариант — загрузить код Python из отдельного файла:

В этом случае файл Python будет выглядеть так:

Отделение кода Python от кода HTML — это более чистый подход, который позволяет вам воспользоваться преимуществами и функциональными возможностями редакторов кода. Большинство редакторов поддерживают встроенный JavaScript в HTML, но не поддерживают встроенный Python в HTML.

Внутреннее устройство Brython ↑

В этом разделе более подробно рассматривается процесс преобразования кода Python в JavaScript. Если вас не интересуют эти подробности, пропустите этот раздел, так как он не требуется для понимания остальной части урока. Чтобы проиллюстрировать этот процесс и заглянуть внутрь Brython, выполните следующие действия:

В браузере JavaScript REPL введите и выполните следующий код:

python_to_js() анализирует и компилирует предоставленный код Python в JavaScript, а затем выполняет JavaScript в веб‑браузере. У вас должен получиться следующий результат:

Когда вы создаете приложение Brython, вам не нужно явно вызывать функцию в модуле __BRYTHON__ JavaScript.
Этот пример предназначен только для демонстрации того, как Brython работает за кулисами. Знание __BRYTHON__ может помочь вам прочитать код Brython и даже внести свой вклад в проект по мере того, как вы набираетесь опыта. Это также поможет вам лучше понять исключения, которые могут отображаться в консоли браузера.
Объект JavaScript __BRYTHON__ доступен в глобальной области JavaScript, и вы можете получить к нему доступ с помощью консоли JavaScript браузера.

Использование Brython в браузере ↑

На данный момент у вас достаточно понимания Brython, чтобы работать с более подробными примерами. В этом разделе мы собираемся реализовать калькулятор Base64, чтобы поэкспериментировать в браузере с DOM API и другими функциями, которые обычно доступны только в JavaScript.

Мы начнём с изучения того, как управлять DOM с помощью Python и HTML.

DOM API в Brython ↑

Чтобы поэкспериментировать с манипуляциями с DOM, доступными в Brython, создадим форму для кодирования строки в Base64. Готовая форма будет выглядеть так:

Создайте следующий HTML‑файл и назовите его index.html:

HTML‑код выше загружает статические ресурсы, определяет макет пользовательского интерфейса и запускает компиляцию Python:

Соответствующий код Python, в main.py, выглядит следующим образом:

Код Python показывает определение функций обратного вызова и механизм для управления DOM:

Для управления DOM Brython использует два оператора:

Вы можете увидеть оба оператора в следующем операторе, взятом из display_map() :

Вы можете прочитать приведенный выше код как «добавить к элементу таблицы элемент заголовка таблицы, содержащий элемент строки таблицы, состоящий из двух смежных элементов ячеек данных таблицы. Он отображается в браузере как следующий HTML‑код:

Код HTML показывает вложенную структуру для строки заголовка элемента таблицы. Вот более читаемый формат того же кода:

Чтобы увидеть результат в консоли Brython, вы можете ввести следующий блок кода:

Чтобы выполнить полный код, вам необходимо запустить веб‑сервер. Как и раньше, вы запускаете встроенный веб‑сервер Python в том же каталоге, что и два файла index.html и main.py:

Мы расширим возможности этого примера в разделе Веб‑API браузера, разрешив сохранение данных между перезагрузками страницы.

Импорт в Brython ↑

Вы можете использовать импорт для доступа к модулям Python или модулям Brython, скомпилированным в JavaScript.

Модули Python — это файлы с расширением .py в корневой папке вашего проекта или для пакета Python, во вложенной папке, содержащей файл __init__.py. Чтобы импортировать модули Python в код Brython, вам необходимо запустить веб‑сервер.
Чтобы узнать больше о модулях Python, ознакомьтесь с уроком Архитектура приложений на Python — модули и пакеты.

Чтобы изучить, как импортировать модули Python в код Brython, следуйте инструкциям, описанным в разделе об установке с помощью PyPI, создайте и активируйте виртуальную среду Python, установите Brython и измените index.html следующим образом:

В HTML‑файле выше представлены модули, импортированные из основного движка (браузера), из стандартной библиотеки (sys) и из локального модуля Python (функциональный). Вот содержание function.py:

Если вы попытаетесь открыть index.html из файловой системы в браузере, в консоли браузера появится следующая ошибка:

Для импорта модуля Python требуется запуск локального веб‑сервера. Запустите локальный веб‑сервер и укажите в браузере адрес http://localhost:8000. Вы должны увидеть следующую HTML‑страницу:

При работающем веб‑сервере браузер смог получить модуль function.py при выполнении функции импорта. Результаты обоих значений, sys.version и чисел, вставляются в файл HTML двумя последними строками встроенного скрипта Python и отображаются браузером.

Уменьшить размер импорта ↑

В каталоге проекта из предыдущего примера, чтобы уменьшить размер импортированных модулей JavaScript и предварительно скомпилировать модули Python в JavaScript, вы можете использовать brython-cli с параметром —modules:

Это сгенерирует brython_modules.js, и вы можете изменить элемент заголовка index.html следующим образом:

Строка 4 изменяет исходный источник скрипта с brython_stdlib.js на brython_modules.js.

Открытие index.html в браузере или указание в браузере локального сервера отображает ту же HTML‑страницу. Обратите внимание на следующие моменты:

Примечание. Как и при импорте модуля Python, загрузка модуля Python с элементом сценария HTML требует запуска веб‑сервера. Рассмотрим следующий элемент сценария HTML:

Когда функция Brython выполняется и загружает содержимое скрипта, указывающее на файл Python, он пытается выполнить вызов Ajax, который может быть выполнен только при работающем веб‑сервере. Если вы попытаетесь открыть файл из файловой системы, то в консоли JavaScript браузера отобразится ошибка, подобная следующей:

IOError: невозможно загрузить внешний скрипт в file:///project/main.py
(Вызовы Ajax не поддерживаются протоколом file:///)

Защита безопасности предотвращает загрузку main.py из локальной файловой системы. Вы можете решить эту проблему, запустив локальный файловый сервер. Дополнительные сведения об этом поведении см. В документации Brython.

Взаимодействие с JavaScript ↑

JavaScript ↑

Вы можете увидеть предупреждение в действии в следующих трех примерах, запущенных в консоли Brython, а не в стандартной оболочке интерпретатора CPython:

Или вы можете использовать окно:

Или вы можете написать так:

Вот основные модули Brython, обеспечивающие доступ к функциям JavaScript:

Помимо функций JavaScript и API-интерфейсов, доступных в браузере, вы также можете получить доступ к написанным вами функциям JavaScript. В следующем примере показано, как получить доступ к пользовательской функции JavaScript из Brython:

Вот как это работает:

Вы можете использовать ту же функцию для доступа к библиотекам JavaScript. Вы увидите, как это сделать, в разделе Web UI Framework, где вы будете взаимодействовать с Vue.js, популярным фреймворком веб‑интерфейса.

Веб‑API браузера ↑

Браузеры предоставляют веб‑API, к которым вы можете получить доступ из JavaScript, а Brython имеет доступ к тем же API. В этом разделе расширим возможности калькулятора Base64 для хранения данных между перезагрузками страницы браузера.

Вы можете получить доступ ко всем функциям веб‑API из браузера и других подмодулей. Документация высокого уровня по доступу к веб‑API доступна в документации Brython. Для получения дополнительной информации вы можете обратиться к документации по веб‑API и использовать консоль Brython для экспериментов с веб‑API.

Вы можете проверить оба варианта в онлайн-консоли. Использование window.btoa() будет работать только в контексте Brython, тогда как base64.b64encode() может выполняться с помощью обычной реализации Python, такой как CPython. Обратите внимание, что в версии CPython base64.b64encode() принимает массив байтов в качестве типа аргумента, тогда как JavaScript window.btoa() принимает строку.

Если производительность вызывает беспокойство, рассмотрите возможность использования версии JavaScript.

Структура веб‑интерфейса ↑

Популярные JavaScript-фреймворки UI, такие как Angular, React, Vue.js или Svelte, стали важной частью набора инструментов фронтенд-разработчика, и Brython легко интегрируется с некоторыми из этих фреймворков. В этом разделе мы создадим приложение, используя Vue.js версии 3 и Brython.

Приложение, которое мы создадим, представляет собой форму, которая вычисляет hash એ строки. Вот скриншот работающей HTML‑страницы:

Тело HTML‑страницы декларативно определяет привязки и шаблоны:

Если вы не знакомы с Vue, ниже вы быстро расскажете о некоторых вещах, но не стесняйтесь обращаться к официальной документации за дополнительной информацией:

Соответствующий код Python описывает Vue и прилагаемую бизнес-логику:

Декларативный характер Vue.js отображается в файле HTML с директивами и шаблонами Vue. Это также продемонстрировано в коде Python с объявлением компонента Vue в строке 11 и строках 28–35. Этот декларативный метод связывает значения узлов DOM с данными Vue, обеспечивая реактивное поведение фреймворка.

В Python для доступа к полям объекта Vue необходимо обратиться к объекту Vue с помощью javascript.this() :

Если это введение Vue в сочетании с Brython вызвало у вас интерес, тогда вы можете посмотреть проект vuepy, который предоставляет полные привязки Python для Vue.js и использует Brython для запуска Python в браузере.

WebAssembly ↑

В следующем примере, демонстрирующем способ использования WebAssembly, вы реализуете функцию в Rust и вызываете ее из Python.

Это не является исчерпывающим руководством по Rust. Это только царапает поверхность. Для получения дополнительных сведений о Rust ознакомьтесь с документацией по Rust.

Начните с установки Rust с помощью rustup. Для компиляции файлов Wasm вам также необходимо добавить цель wasm32:

Создайте проект с помощью Cargo, который устанавливается при установке Rust:

Приведенная выше команда создает скелет проекта в папке с именем op. В этой папке вы найдете Cargo.toml, файл конфигурации сборки Rust, который вам нужно изменить, чтобы указать, что вы хотите создать динамическую библиотеку. Это можно сделать, изменив файл следующим обрахом:

Измените src/lib.rs, заменив его содержимое следующим:

В корне проекта, где находится Cargo.toml, скомпилируйте свой проект:

Затем создайте веб‑каталог со следующим index.html:

Строка 6 выше загружает следующий файл main.py из того же каталога:

В том же веб‑каталоге скопируйте op.wasm из target/wasm32-unknown-unknown/debug/op.wasm:

Макет папки проекта выглядит так:

Это показывает структуру папок проекта Rust, созданного с помощью Cargo new. Для наглядности цель частично опущена.

Теперь запустим сервер в сети:

Наконец, укажите в своем интернет‑браузере http://localhost:8000. Ваш браузер должен отобразить страницу, подобную следующей:

В этом проекте показано, как создать WebAssembly, который можно использовать из JavaScript или Brython. Из-за значительных накладных расходов, связанных с созданием файла Wasm, это не должно быть вашим первым подходом к решению конкретной проблемы.

Если JavaScript не соответствует вашим требованиям к производительности, возможно, вам подойдет Rust. В основном, это полезно, если у уже есть код Wasm для взаимодействия: либо ваш код, либо существующие библиотеки Wasm.

Применение асинхронной разработки в Brython ↑

Представьте себе такую ​​технику, в которой сначала выполняется А, B будет вызван, но не выполнен немедленно, а затем будет выполнен C. Вы можете думать о B как об обещании быть выполненным в будущем. Поскольку B не блокируется, он считается асинхронным. Дополнительные сведения об асинхронном программировании можно найти в статье Приступая к работе с асинхронными функциями в Python. JavaScript является однопоточным и полагается на асинхронную обработку, в частности, когда задействованы сетевые коммуникации. Например, для получения результата API не требуется блокировать выполнение других функций JavaScript.

С Brython у вас есть доступ к асинхронным функциям через ряд компонентов:

Promise JavaScript в Brython ↑

Вот пример, показывающий, как использовать объект JavaScript Promise из Brython. Вы можете работать с этим примером в онлайн-консоли:

В веб‑консоли вы можете сразу увидет, как выполняется код Python:

В приведенном выше примере тайм-аут искусственно имитирует длительную функцию. Реальное использование обещания может включать сетевой вызов. Через 3 секунды Promise успешно завершается со значением «Будущее сообщение».

Вы можете увидеть результат успешного выполнения обещания на подобном изображении:

Когда вы запускаете код в консоли, вы можете видеть, что сначала создается объект Promise, а затем, по истечении тайм-аута, отображается окно сообщения.

Ajax в Brython ↑

Чтобы вызвать HTTP GET асинхронно, вызовите ajax.get() следующим образом:

Чтобы получить API в режиме блокировки, установите для параметра блокировки значение True:

Следующий код показывает разницу между блокирующим вызовом Ajax и неблокирующим вызовом Ajax:

Приведенный выше код иллюстрирует оба поведения, синхронное и асинхронное:

Когда вы запустите полный пример и нажмете Async Get и Blocking Get, вы увидите следующий экран:

Асинхронный ввод-вывод в Brython ↑

С asyncio у Python 3.4 появились новые асинхронные возможности. В Python 3.5 асинхронная поддержка была расширена синтаксисом async/await. Из-за несовместимости с циклом событий браузера Brython реализует browser.aio как замену стандартному asyncio.

Сопрограммы

Вы можете использовать run() и sleep() для создания сопрограмм. Чтобы проиллюстрировать поведение сопрограмм, реализованных в Brython, воспользуемся примером сопрограммы из документации CPython:

За исключением первой строки импорта, код такой же, как в документации CPython. Он демонстрирует использование ключевых слов async и await и показывает run() и sleep() в действии:

Сначала выполняется сценарий, затем отображается «hello» и, наконец, отображается «world».

Дополнительные сведения о сопрограммах в Python можно найти в статье «Асинхронный ввод-вывод в Python: полное пошаговое руководство».

Специфические веб‑функции

Чтобы выполнить асинхронный вызов API, как в предыдущем разделе, можyj написать функцию, подобную следующей:

Вот пример того, как вызвать process_get() :

Более полный пример кода показывает, как использовать ключевые слова async и await и как aio.run() и aio.get() дополняют друг друга:

Как и в самых последних версиях Python 3, вы можете использовать ключевые слова async и await :

На снимке экрана показана последовательность шагов, выполняемых после нажатия Async Get. Комбинация использования модуля aio и ключевых слов async и await показывает, как можно использовать модель асинхронного программирования, которую продвигает JavaScript.

Распространение и упаковка проекта Brython
Метод, который вы используете для установки Brython, может повлиять на то, как и где вы можете развернуть свой проект Brython. В частности, для развертывания в PyPI лучше всего сначала установить Brython из PyPI, а затем создать свой проект с помощью brython-cli. Но при типичном веб‑развертывании на частном сервере или у облачного провайдера можно использовать любой метод установки по вашему выбору.

У вас есть несколько вариантов развертывания:

Вы изучите каждый из них в следующих разделах.

Ручное и автоматическое веб‑развертывание ↑

Ваше приложение содержит все статические зависимости CSS, JavaScript, Python и файлы изображений, необходимые для вашего веб‑сайта. Brython является частью ваших файлов JavaScript. Все файлы могут быть развернуты «как есть» у выбранного вами поставщика. Вы можете обратиться к Руководствам по веб‑разработке и автоматизации развертывания Django с помощью Fabric и Ansible для получения подробной информации о развертывании ваших приложений Brython.

Развертывание в PyPI ↑

Следуя инструкциям в разделе по установке из PyPI, выполните следующую команду в своем новом веб‑проекте:

Вы можете протестировать установку этого нового пакета локально следующим образом:

Развертывание в CDN ↑

Создание расширений Google Chrome

Общедоступные расширения доступны в интернет‑магазине Chrome. Учить, устанавливаете расширения Google Chrome из локальных файлов:

Прежде чем приступить к реализации расширения Google Chrome в Brython, вы сначала реализуете версию JavaScript, а затем переведете ее в Brython.

Расширение Hello World в JS ↑

Для начала вы реализуете расширение, которое будет выполнять следующие действия:

На следующем снимке экрана показано это поведение:

В пустой папке создайте файл manifest.json для настройки расширения:

Важным полем для этого примера является всплывающий файл по умолчанию popup.html, который вам также необходимо создать. Для получения информации о других полях и многом другом, вы можете обратиться к документации по формату файла манифеста.

В той же папке создайте файл popup.html, используемый для определения пользовательского интерфейса расширения:

HTML‑файл включает ссылку на бизнес-логику JavaScript расширения и описывает его пользовательский интерфейс:

Также необходимо создать popup.js:

Перед установкой этого расширения выполните следующие действия:

На экране отобразятся ваши установленные в настоящее время расширения, если таковые имеются. Это может выглядеть так:

Чтобы установить новое расширение, вам необходимо выполнить следующие действия:

Если во время установки или выполнения возникают какие-либо ошибки, вы должны увидеть красную кнопку ошибки справа от кнопки удаления карты расширения:

Расширение Hello World в Python ↑

Если вы дошли до этого момента, значит, вы уже выполнили самые сложные шаги, в основном для ознакомления с процессом создания расширения Chrome и его установки. Шаги будут аналогичны с Brython, но с некоторыми отличиями, о которых вы сейчас узнаете.

Файл манифеста будет отличаться,с другим именем расширения и, для удобства, другим описанием:

HTML‑файл также будет иметь несколько обновлений, а именно:

Код HTML очень похож на тот, который вы использовали для создания расширения Chrome в JavaScript. Стоит отметить несколько деталей:

Наконец, вы можете увидеть основную логику этого приложения в следующем коде Python:

После этого вы готовы приступить к установке и тестированию, как и для расширения Chrome для JavaScript.

Тестирование и отладка Brython ↑

Модульные тесты Python ↑

Фреймворки модульного тестирования Python, такие как встроенный unittest и pytest, не работают в браузере. Вы можете использовать эти фреймворки для модулей Python, которые также могут выполняться в контексте CPython. Никакие специфичные для Brython модули, такие как браузер, не могут быть протестированы с такими инструментами из командной строки. Для получения дополнительной информации о модульном тестировании Python, ознакомьтесь с Getting Started With Testing in Python.

Selnium ↑

Модульные тесты JavaScript ↑

Существует множество фреймворков для тестирования, ориентированных на JavaScript, таких как Mocha, Jasmine и QUnit, которые хорошо работают в полной экосистеме JavaScript. Но они не обязательно хорошо подходят для модульного тестирования кода Python, работающего в браузере. Один из вариантов требует глобального доступа к функциям Brython для JavaScript, что противоречит лучшим практикам. Чтобы проиллюстрировать вариант предоставления функции Brython для JavaScript, вы воспользуетесь QUnit, набором модульных тестов JavaScript, который может выполняться автономно в файле HTML:

В одном файле HTML вы написали код Python, код JavaScript и тесты JavaScript для проверки функций на обоих языках, выполняемых в браузере:

Для выполнения модульного теста не нужно запускать веб-сервер. Откройте index.html в браузере, и вы должны увидеть следующее:

Представление функции Python для JavaScript показывает, как можно использовать среду модульного тестирования JavaScript для выполнения Python в браузере. Хотя это возможно для тестирования, в целом не рекомендуется, поскольку может конфликтовать с существующими именами JavaScript.

Отладка в Brython ↑

На момент написания этой статьи не существовало удобных инструментов для отладки вашего приложения Brython. Вы не смогли сгенерировать файл исходной карты, который позволил бы вам выполнять отладку шаг за шагом в инструментах разработки браузера.

Это не должно мешать вам использовать Brython. Вот несколько советов, которые помогут с отладкой и устранением неполадок вашего кода Brython:

Изучение альтернатив Brython

Каждая реализация подходит к проблеме с разных сторон. Brython пытается заменить JavaScript, предоставляя доступ к тому же веб-API и манипуляциям с DOM, что и JavaScript, но с привлекательным синтаксисом и идиомами Python. Он упакован как небольшая загрузка по сравнению с некоторыми альтернативами, которые могут иметь другие цели.

Как сравнить эти фреймворки?

Skulpt ↑

Skulpt компилирует код Python в JavaScript в браузере. Компиляция происходит после загрузки страницы, тогда как в Brython компиляция происходит во время загрузки страницы.

Хотя у него нет встроенных функций для управления DOM, Skulpt очень близок к Brython в своих возможностях. Он включает в себя использование в образовательных целях и полно‑функциональное приложения Python, как показано у Anvil.

Transcrypt ↑

Transcrypt включает инструмент командной строки для компиляции кода Python в код JavaScript. Компиляция считается опережающей (AOT). Полученный код затем можно загрузить в браузер. Transcrypt занимает мало места, около 100 КБ. Это быстро и поддерживает манипуляции с DOM. Отличие от Skulpt и Brython заключается в том, что Transcrypt компилируется в JavaScript перед загрузкой и использованием в браузере с помощью компилятора Transcrypt, что обеспечивает скорость и небольшой размер. Однако, при этом невозможно использовать Transcrypt в качестве платформы для обучения, как и другие платформы.

Pyodide ↑

PyPy.js ↑

PyPy.js использует интерпретатор Python PyPy, скомпилированный в JavaScript с помощью emscripten, что делает его совместимым для работы в браузере.

На текущий момент проекта PyPy.js, представляющий собой большой пакет, около 10 МБ, что совершенно недопустимо для типичных веб-приложений, не развивается. Однако, PyPy.js все еще можно использовать в качестве платформы для изучения Python в браузере, открыв домашнюю страницу PyPy.js.

PyPy.js компилируется в JavaScript с помощью emscripten. Pyodide делает еще один шаг вперед, используя emscripten и Wasm, в частности, для компиляции расширений Python C, таких как NumPy, в WebAssembly.

На момент написания этой статьи PyPy.js не поддерживался. Что-то в том же духе относительно процесса компиляции рассмотрим Pyodide.

Заключение ↑

В этом уроке вы глубоко погрузились в несколько аспектов написания кода Python в браузере. Возможно, это вызвало у вас интерес к использованию Python для интерфейсной разработки.

В этом руководстве вы узнали, как:

Опубликовано Вадим В. Костерин

ст. преп. кафедры ЦЭиИТ. Автор более 130 научных и учебно-методических работ. Лауреат ВДНХ (серебряная медаль). Посмотреть больше записей

Источник