Как легко создать одностраничное веб-приложение? - PullRequest
Новая
       22

Как легко создать одностраничное веб-приложение?

1 голос
/ 02 августа 2020

Каков самый простой способ создать одностраничное веб-приложение, в котором будет два вводимых текста, в которые вводятся переменные a, b, и одна кнопка для доступа к сценарию python для отображения изображения в получил URL 

def get_pic(a,b):
    *magic*
    return *pic url*

Я пробовал Django, но, поскольку я новичок, я не понял, как назначить вызов функции python кнопке. Может есть способы максимально простые и без лишних хлопот, мне нужен элементарный интерфейс как на прикрепленной картинке

введите описание изображения здесь

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

1 Ответ

1 голос
/ 02 августа 2020

Если вам нужен простой пример, как просто получить значения с 2 входов и отправить их по проводам, здесь вы go .. 

var btn = document.querySelector('button') ;
var in1 = document.querySelector('#nr1') ;
var in2 = document.querySelector('#nr2') ;
var img = document.querySelector('img') ;
// event on button click
btn.addEventListener( 'click', function() {
  // bails. ..todo, security ?..?
  if( !parseInt(in1.value) || !parseInt(in2.value) ) return;
  // take values from input1 and input2 and replace attribute, browser will do ajax for you and render it
  img.setAttribute( 'src', "https://placehold.it/" + in1.value + "x" + in2.value )
});
.img, .frm{
  float: left; 
  width: 49%;
  padding-left: 1%
}
<div class="img">
  <img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAADUlEQVR42mNk+M9QDwADhgGAWjR9awAAAABJRU5ErkJggg==" />
</div>

<div class="frm">
  <input id="nr1"> <p>&nbsp;</p>
  <input id="nr2"> <p>&nbsp;</p>
  <button>Render</button>
</div>

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

Вам необходимо замените https://placehold.it/ URL-адресом вашей серверной службы и отправьте аргументы, такие как параметры URL-адреса, как, например, я. Ваш сервис должен возвращать URL-адрес изображения или типа шахты image/png et c .., это скрипты, которые отвечают за безопасность, крайние случаи, резервное изображение и т.д. c ..

...