python) 쿼리스트링을 사용하여 데이터를 동적으로 표현하기

jun_legend·2021년 5월 10일
0

Python-Web Application

목록 보기
2/11
post-thumbnail

"쿼리스트링 (QueryString)"

url주소 뒤에 입력 데이터를 함께 제공하는 데이터 전달방법
데이터를 넘길 때 주소창을 이용해 넘기는 방법 정도로 기억하자

쿼리스트링은 url주소 뒤에 ?를 붙이고
key1=value1&key2=value2&key3=value3... 방식으로 데이터를 요청한다.

https://junlegend.github.io/?id=intro

위와 같은 url주소는 id=intro 라는 데이터를 전달한 것이다.


"쿼리스트링을 사용해서 데이터를 동적으로 표현하기"

#!/usr/local/bin/python3
print("Content-Type: text/html")
print()
print('''<!doctype html>
<html>
<head>
  <title>WEB1 - Welcome</title>
  <meta charset="utf-8">
</head>
<body>
  <h1><a href="index.html">WEB</a></h1>
  <ol>
    <li><a href="1.html">HTML</a></li>
    <li><a href="2.html">CSS</a></li>
    <li><a href="3.html">JavaScript</a></li>
  </ol>
  <h2>WEB</h2>
  <p>The World Wide Web (abbreviated WWW or the Web) is an information space where documents and other web resources are identified by Uniform Resource Locators (URLs), interlinked by hypertext links, and can be accessed via the Internet.[1] English scientist Tim Berners-Lee invented the World Wide Web in 1989. He wrote the first web browser computer program in 1990 while employed at CERN in Switzerland.[2][3] The Web browser was released outside of CERN in 1991, first to other research institutions starting in January 1991 and to the general public on the Internet in August 1991.
  </p>
</body>
</html>
''')


웹페이지에서 메인 타이틀(h1태그) WEB 과

서브타이틀(li태그) HTML, CSS, Javascript 를 클릭했을 때,

글의 제목이(h2태그) 그에 맞는 타이틀로 변경되는 동적인 표현을 해보자.


1) 각 타이들의 href 값을 쿼리스트링 형태로 변경 (qs-index.py?id=ㅇㅇ)

<h1><a href="index.py?id=WEB">WEB</a></h1>
<ol>
  <li><a href="index.py?id=HTML">HTML</a></li>
  <li><a href="index.py?id=CSS">CSS</a></li>
  <li><a href="index.py?id=JavaScript">JavaScript</a></li>
</ol>

웹페이지에서 WEB 을 누르면

http://localhost:8080/index.py?id=WEB

HTML 을 누르면

http://localhost:8080/index.py?id=HTML

CSS 를 누르면

http://localhost:8080/index.py?id=CSS

JavaScript 를 누르면

http://localhost:8080/index.py?id=JavaScript

웹페이지 주소창에서 위와 같은 url들을 확인할 수 있다.


2) 포매팅을 사용해서 글의 제목이 변경될 수 있도록 코드를 변경해보자.

<h2>{title}</h2>
  <p>The World Wide Web (abbreviated WWW or the Web) is an information space where documents and other web resources are identified by Uniform Resource Locators (URLs), interlinked by hypertext links, and can be accessed via the Internet.[1] English scientist Tim Berners-Lee invented the World Wide Web in 1989. He wrote the first web browser computer program in 1990 while employed at CERN in Switzerland.[2][3] The Web browser was released outside of CERN in 1991, first to other research institutions starting in January 1991 and to the general public on the Internet in August 1991.
  </p>
</body>
</html>
'''.format(title = "Hello"))

웹페이지를 리로드하면 WEB 이었던 글의 제목이 Hello 로 변경된 것을 확인할 수 있다.

즉, 쿼리스트링 값(id= )이 format() 의 매개변수가 될 수 있게 한다면,

웹페이지의 주소가 변경될 때 마다 글의 제목을 쿼리스트링 값으로 변하게 할 수 있다.


3) CGI를 이용해서 쿼리스트링 값을 파이썬의 방식으로 알아 낼 수 있는 방법 찾기

구글에 command gateway interface python 으로 검색하면, 아래와 같은 정보를 알아낼 수 있다.

이는 아래와 같이 코드에 적용할 수 있다고 한다.

#!/usr/local/bin/python3
print("Content-Type: text/html")
print()

import cgi
form = cgi.FieldStorage()  
pageId = form["id"].value  

print('''<!doctype html>
<html>
<head>
  <title>WEB1 - Welcome</title>
  <meta charset="utf-8">
</head>
<body>
  <h1><a href="index.py?id=WEB">WEB</a></h1>
  <ol>
    <li><a href="index.py?id=HTML">HTML</a></li>
    <li><a href="index.py?id=CSS">CSS</a></li>
    <li><a href="index.py?id=JavaScript">JavaScript</a></li>
  </ol>
  <h2>{title}</h2>
  <p>The World Wide Web (abbreviated WWW or the Web) is an information space where documents and other web resources are identified by Uniform Resource Locators (URLs), interlinked by hypertext links, and can be accessed via the Internet.[1] English scientist Tim Berners-Lee invented the World Wide Web in 1989. He wrote the first web browser computer program in 1990 while employed at CERN in Switzerland.[2][3] The Web browser was released outside of CERN in 1991, first to other research institutions starting in January 1991 and to the general public on the Internet in August 1991.
  </p>
</body>
</html>
'''.format(title = pageId))

코드 저장 후 웹페이지의 타이틀들을 클릭해보면,

url주소와 함께 글의 제목도 같이 변하는 것을 확인할 수 있다.




[출처] 생활코딩 WEB2 - Python
https://opentutorials.org/module/3357

0개의 댓글