기본 콘텐츠로 건너뛰기

python - Web8

python - Web8

python flask8
html1

1. flask 에서 html 태그 사용하기

@app.route('/')
def home():
return '<h2>hello world3</h2>'
:브라우저가 파싱을 통해 html 태그 해석해 화면 구성. <hn></hn>(1<=n<=4)는 헤드라인 태그로 글씨를 써준다. 글씨 크기는 n이 작을수록 커진다.

2. 주소에 html 파일 불러오기

from flask import Flask, render_template
@app.route('/login')
def login():
return render_template('login.html')
:flask모듈의 render_template() 함수를 활용한다. 이 함수는 템플릿 폴더로부터 템플릿을 만들어준다. 인자로 html파일 이름 혹은 리스트를 줘 해당 파일을 찾을 수 있게 한다.  html파일의 위치는 templates라는 폴더 내부에 있어야 한다.


3. 리다이렉션(redirection)

리다이렉션은 우회하는 것을 말하는데 웹에서는 화면을 다른 방향을 돌려 보여주는 것을 의미한다. 아래의 코드를 보면 알 수 있는데 원래 주소에서 화면이 실행되는 것이 아니라 다음 페이지로 화면을 넘겨 보여준다는 걸 알 수 있다. 

from flask import Flask, request, redirect
@app.route('/loginProc')
def loginProc():
userID = request.args.get('uid')
userPW = request.args.get('upw')
if (userID == 'n') and (userPW == '1'):
return redirect('/main')
else:
return '''
<script>
alert("아이디와 비번을 확인해주세요");
history.back();
</script>
'''

@app.route('/main')
def mianService():
return 'main service'
:flask모듈에서 redirect함수를 불러온다. get방식(python - Web7참고)를 통해 전달된 데이터를 request로 받아 변수에 저장한다. if문에서 미리 지정한 아이디와 비밀번호가 전달된 데이터와 같을 때 새로운 /main 주소에서 화면을 보여주고(redirect) 아닐 경우 javascript를 통해 팝업창을 띄운(alert("아이디와 비번을 확인해주세요");) 후 입력 창으로 돌아가게(history.back();) 만든다.
/main이란 주소는 로그인을 성공했을 때만 갈 수 있는 페이지로 main service라는 문자열을 을 보여준다.


4. 로그인 작동 원리(이론)

로그인을 성공했을 경우 세션을 생성한다. 세션은 사용자의 벙보를 저장하면서 로그인의 판별 여부를 돕는다. 3번 코드를 기준으로 세션은 if 문 안에서 생겨야 하며 /main페이지는 세션을 판단해 보여줘야 한다.
(보조자료: https://ko.wikipedia.org/wiki/세션_(컴퓨터_과학))


5. html 기초

html은 웹페이지의 화면을 만드는 언어다. 이벤트 처리를 할 수 없고 각종 태그를 통해 화면을 꾸민다. html은 태그로 이루어졌는데 반드시 먼저 열린 태그는 나중에 닫혀야 하고 시작 태그와 종료 태그 총 2개지만 단일 태그로 존재하기도 한다.
(보조자료: https://ko.wikipedia.org/wiki/HTML)

6. login.html파일

<!DOCTYPE html>
<html>
<head></head>
<body>
<h3>로그인 페이지</h3>
<form action = "/loginProc", method="GET">
<input type='text' name='uid' placeholder="ID"/> <br>
<input type='password' name='upw' placeholder="PASSWORD"/> <br>
<input type='submit' value="로그인"/>
</form>
</body>
</html>
:form 태그는 데이터를 서버로 전송해주는 역할을 한다. 사용한 옵션은 action: 데이터를 전송할 곳, method: 데이터의 전송 방식 을 의미한다.  form 태그 안에는 input을 사용해 사용자로부터 데이터를 입력받을 수 있다. type에 따라서 입력 받는 방식이 달라지고 name은 해당 input의 이름을 주는 것이다. placeholder은 입력 창에 흐릿하게 써진 글씨를 지정해주고 value는 submit이 보여주는 문자열을 의미한다.
(보조 자료: http://www.nextree.co.kr/p8428/)

전체 코드


1. python

from flask import Flask, request, render_template, redirect

app = Flask(__name__)

@app.route('/')
def home():
return '<h2>hello world3</h2>'

@app.route('/login')
def login():
return render_template('login.html')

@app.route('/loginProc')
def loginProc():
userID = request.args.get('uid')
userPW = request.args.get('upw')
if (userID == 'n') and (userPW == '1'):
return redirect('/main')
else:
return '''
<script>
alert("아이디와 비번을 확인해주세요");
history.back();
</script>
'''

@app.route('/main')
def mianService():
return 'main service'

if __name__ == '__main__':
app.run(debug=True)

2. login.html

<!DOCTYPE html>
<html>
<head>
</head>
<body>
<h3>로그인1111</h3>
<form action = "/loginProc", method="GET">
<input type='text' name='uid' placeholder="ID"/> <br>
<input type='password' name='upw' placeholder="PASSWORD"/> <br>
<input type='submit' value="로그인"/>
</form>
</body>
</html>

실행화면

1. url: http://127.0.0.1:5000/


2. url: http://127.0.0.1:5000/login


3. url: http://127.0.0.1:5000//loginProc?uid=n&upw=1 --> http://127.0.0.1:5000/main





4. url: http://127.0.0.1:5000/longinProc?uid=n&upw=0 --> http://127.0.0.1:5000/?uid=n&upw=0




























라벨:

댓글

댓글 쓰기

이 블로그의 인기 게시물

C언어 - 1~100 사이의 소수 구하기

  C 문제 정수 값을 인자로 받아서 소수인지 판단하는 IsPrime 함수를 정의하고 이 함수를 이용해 1 부터 100 사이의 소수를 모두 구해서 출력하는 프로그램을 작성하시오 .   1.main 함수 만들기 IsPrime 이라는 함수에 인자를 2 부터 99 로 넣어주는 함수를 만들어야 한다 . 반복을 위해 for 함수를 사용한다 . main 함수의 타입이 int 이기 때문에 return 값을 적어줘야 함 .   2.IsPrime 함수 만들기 딱히 반환해야 할 값이 없기 때문에 타입은 void 경우를 2 가지로 나눔 . ①if  인자가 2 일 경우 --> 2 는 소수이기 때문에 2 를 출력함 ②else  인자가 2 가 아닐 경우 --> 2 부터 ( 인자 -1) 까지의 수로 인자를 나눠서 모든 경우에 나머지가 0 이 아니면 소수임 . 즉 어떤 숫자로 나눠 떨어지면 소수가 아니라는 의미로 더이상의 경우를 확인할 필요가 없음 . 따라서 반복하던 for 문을 빠져나옴 . for 문이 끝난 후 인자의 값과 count 의 값이 같다면 count 의 어떠한 숫자로도 인자가 나누어지지 못했다는 의미이다 . 이는 소수라는 뜻과 마찬가지이기 때문에 이 경우에 인자를 출력한다 .   3. 기타 출력한 후 모습을 살펴보는데 IsPrime 에서의 출력이 숫자 끝에 콤마 (,) 가 붙기 때문에 모든 출력이 끝나도 마지막 숫자 뒤에 콤마가 붙어 있다 . 이를 없애기 위해서는 이스케이프 문자 ‘\ b’ 를 사용했다 . 출력 화면이 더 편하게 보이도록 ‘\b\n’ 를 썼으나 이럴 경우 '\b' 의 효과가 사라졌다 . ‘\b\b\n’ 처럼 사용했으나 결과는 역시나 \ n 의 효과만 나타날 뿐 \ b 의 효과는 없었다 . 이를 해결하기 위해 구글링도 했지만 적절한 답을...
댓글 쓰기
자세한 내용 보기

C언어 - 입력받은 숫자의 이진수 표현에서 1의 개수를 세는 코드를 짜기

C 언어 문제: 입력받은 숫자의 이진수 표현에서 1의 개수를 세는 코드를 짜기 이 문제를 해결하기 위해서는 시프트 연산자에 대해 알아야 한다. 컴퓨터에서는 숫자를 2진수로 표현하는데 정수는 32비트로 나타낸다. 가장 앞쪽에 있는 비트는 음수와 양수를 구분해 주는 비트이고 이 이하가 숫자를 의미한다. 시프트 연산자는 숫자를 이진수로 표현했을 때 연산을 편리하게 해 주는 연산자이다. 연산자에 대해 자세히 알고 싶으면 ( http://rockykim5581.tistory.com/19 )을 참고하길 바란다. 여기에서는 필요한 부분만 다룰 예정이다. 1. 숫자 입력받기 입력한 숫자를 변수에 대입해야 한다. 2.입력한 숫자의 이진수 표현에서 1의 개수 구하기 이진수에서도 비교 연산자를 사용할 수 있다. AND를 의미하는 &는 두 수가 모두 1일 때만 1(참)을 나타낸다. 이 성징을 이용하면 입력받은 숫자의 이진수를 셀 수 있다. 비트는 1부터 31가지 비교해야 한다.(32비트-사인비트-는 제외) 이 과정을 하기 위해서는 반복문이 필요하다. 여기서는 조건과 초기화, 반복후 실행하는 문이 있어서 for를 사용했다. 비교는 입력은 숫자(이진수 표현)의 n번째(이는 0아니면 1이다)와  n번째가 1인 숫자를 &으로 비교해서 둘 다 모두 1인 경우만 count라는 변수를 하나씩 올려준다. 그러면 입력받은 수의 이진수 표현 1을 셀 수 있게된다. 그러면 n번째가 1이라는 숫자를 어떻게 만들까? 이는 변수(one)를 하나 잡아 반복문의 실행에 따라 1을 시프트 연산자로 이동시킨 수를 대입한다. 예를 들어 처음일 때는 입력받은 수와 1을 옯기지 않은 상태로 비교, 두번째 자리를 비교할 땐 입력받은 수와 1을 한칸 옮긴 상태로 비교하는 식이다. 여기서 주의해야 할 점은 (비교하려는 자리의 수-1)만큼 시프트 연산자로 밀어줘야 한다는 것이다. 1이 한 자리도 차지하기 때문이다. <전체 코드> ...
댓글 쓰기
자세한 내용 보기

C언어 - 입력된 정수 홀수와 짝수로 나눠 크기순으로 출력하기

2 번째 주 - C 언어 문제 길이가 10 인 배열을 만들고 그 배열에 10 개의 정수를 입력 받는다 . 이 때 입력받은 정수가 홀수면 배열의 앞부터 채워나가고 짝수면 배열의 맨 뒤에서부터 채워나가는 프로그램을 만들어라 .( 정수는 항상 10 개를 모두 입력한다고 가정한다 .) 실행화면 조건 1. int arr[10], i, num[10];// arr = 짝수 홀수 정리할 배열 , num = 숫자 입력 배열 \ 2.int lennum =() ; // 배열 num 의 크기 , 배열 입력받을 때 for 문에서 10 으로 하지말 고 lennum 사용해서 받을 것 int lenarr =(); // 배열 arr 의 크기 , {1,3,5,7,9,1,8,6,4,2} 형식을 위해 사용 -->hint: sizeof 사용 3.lenarr 출력 포맷을 위 사진과 동일하게 만들기 위해 사용한다 . 처음과 끝은 { 과 } 를 사용하고 마지막 숫자 뒤에는 콤마가 없어야 한다 . -->hint: if 문 사용   < 풀이 > 코드는 총 4 부분으로 나뉜다 . 입력 받기 , 홀수 정리 , 짝수 정리 , 출력 .   1. 입력받기 입력 받기 위해 for 문을 사용해서 반복한다 . 여기서 조건을 만족시키기 위해 lennum 을 구해야 한다 . siezof 크기를 알려주는 함수인데 단순히 sizeof(num) 을 한다면 10 이 나오지 않는다 . 40 이 나올 것이다 . 이는 배열이 가진 인덱스 X 타입형의 크기 값이 총 배열의 크기이기 때문이다 . 따라서 lennum 을 구하기 위해서는 다음과 같이 해야 한다 . lennum = sizeof (num) / sizeof ( int ); for 문 안에서는 scanf 를 사용해 입력한 숫자를 num 배열에 넣는다 . 입력받기 코드   2. 홀수 정리 ...
댓글 쓰기
자세한 내용 보기