데이터과학 삼학년

pass data(arguments) from html to app.py (feat.flask) 본문

Web

pass data(arguments) from html to app.py (feat.flask)

Dan-k 2020. 1. 14. 16:54
반응형

Web browser에서 입력한 parameter를 코드로 가져와서 다시 작업하여

새로운 web을 띄울려면??

 

1. html에서 받을 인자값들을 설정해주고, 다음으로 향할 web route로 action을 정해준다

<body>
    <h1>Window data View</h1>
    <form method="POST" action="/fig">
        <h5> PARAMETER1 을 입력하세요.</h5>
        <input type="text" name="parameter1">
        </br>
        <h5> PARAMETER2 을 입력하세요. </h5>
        <input type="text" name="parameter2">
        </br>
        </br>
        <button type="submit"> 다음 작업으로 GOGOGO!!</button>
    </form>
</body>
</html>

<form>을 이용하여 html 즉, Client에서 Server로 보낼 정보를 담는다.

method는 그 방법이고, action은 client에서 보낼 정보들이 갈 도착지로 보면 된다.

method에 대한 설명은...이렇다.

source : https://amudabadmus.files.wordpress.com/2017/03/web-crawling-scraping-ajax-sites-3-638.jpg?w=638

이외에도 get, post, delete, head, put 등이 있다.

 

2. app.py 에서 method type에 맞게 파라미터를 받아와서 적용한다

@app.route('/')
@app.route('/<int:parameter1>/<parameter2>')
def inputTest(worldno=None, feature=None):
    return render_template('base.html', parameter1=parameter1, parameter2=parameter2)


@app.route('/fig',methods=['POST'])
def fig(parameter1=None, parameter2=None):
    if request.method == 'POST':
        parameter1 = request.form['parameter1']
        parameter2 = request.form['parameter2']
        print('parameter1 :',parameter1)
        print('parameter2 :',parameter2)
        -- parameter를 이용한 작업 계속 진행 --
        
        return render_template('figure.html', parameter1=parameter1, parameter2=parameter2)

위와 같은 작업을 진행하면

web에서 받아온

parameter1 과 parameter2로 figure를 생성하여

그림을 나타내 줄 수 있다.

예를 들어

parameter1 이 worldno

paramater2 가 feature라면

이런식으로 입력해 주고

버튼을 누르면 

이런식으로 그림이 나오게 할 수 있다.

 

728x90
반응형
LIST

'Web' 카테고리의 다른 글

Visualize figure using html form data on same web page  (2) 2020.01.16
Visualization tool - bokeh (feat.falsk)  (0) 2020.01.15
HTTP 응답코드와 메소드 정리  (0) 2020.01.15
flask 구구단 만들기  (0) 2020.01.13
flask 기초  (0) 2020.01.13
'Web' Related Articles more
Comments