생활코딩 | 입력과출력 폼
본문
※ 영상을 선명하게 보기 안내
- 유튜브 영상에서 오른쪽하단에 톱니바퀴를 클릭합니다.
- 팝업목록에서 "품질" 선택하세요.
- 원하는 해상도를 선택해주세요.
※ 모바일에서 Wifi가 아니라면 데이타가 소진될 수 있으니 주의바랍니다.
생활코딩님의 PHP강의 청각장애인을 위한 자막
자 이번 시간에 살펴볼 것은 음 폼을 통해서 우리가 좀 더 편리하게
이 어떤 정보를 서버로 전송하는 방법에 대해서 알아보겠습니다자 지금 보고계신 화면은 생활코딩 홈페이지 open tools 라고 하는
사이트의 로그인 하는 화면입니다
자 여기서 로그인을 해서 글을 쓰거나 뭐죠 봤어요 버튼을 누르거나 이렇게
하게 되는 거죠
자세히 보시면 자 여기
id 값을 입력할 수 있는 요 네모 박스가 있습니다
자 그리고 게 비밀번호를 입력할 수 있는 역시 마찬가지로 네모 박스가
있습니다
그리고 로그인은 유지 할 건지 유지하지 않을 건지를 여러분이 선택할 수
있는 체크박스가 있고요
여기에 입력한 정보들을 모두 입력했을 때 그것을 서버로 전송하기 위해서
어여 러분 1 눌 수 있도록 제공되는 로그인 버튼이 있습니다
자 이걸 뭐라고 하냐면 텍스트 필드 외우지 않으셔도 됩니다
그리고 거는 체크박스
그리고 이것은 어 서브 및
버튼 이라고 합니다 또는 제출 버튼 이라고 해요 그래서 여기 있는 것들이
모두 가본 뭘까요
사용자의 생각 사용자의 정보를 서버로 전송하는
그러한 기능들을 하는 것들이죠 여기 있는 이 로그인
2버튼 조차도 내가 지금 작성된 글을 다 작성했고 내가 정보를 작성
했기 때문에 서버 로 데이터를 전송 하겠어 라고 하는 사용자의 의지를
시스템에 전달하는 이 역할을 한 놈 이라고 볼 수가 있기 때문에 이것들을
모두 예 사용자의 사용자의 정보를 서버 로 전송하는 사용자의 정보를 받아
내는
그러한 장치들이 라고 하심 할 수 있습니다 자 이러한 장치를 뭐라고
하냐면
입력
컨트롤이 려고 합니다 자 이 용어는 여러 가지로 다양하게 쓰기 때문에 꼭
이게 와따 라기보다는
어 이러한 것들을 통 포괄적으로 얘기할 수 있는 이 표현 중에 하나에요
입력 컨트롤이 라고 하는 것은
자 그래서 우리가 이 입력 컨트롤을 만들 수 있는 방법
만드는 방법이 무엇인가 살펴 볼 건데요 우선 우리가 살펴볼 예제 부터
한번 실행을 시켜 볼게요
자 우리 법문에 1 중간쯤에 보시면
자 html 폼 이라고 하는 것이 있고 이렇게 코드가 있습니다
이 코드를 제가 에디터로 일단 열어 볼게요
자요 겁니다 방금 보셨던 그 봄은 그 html 코드가 바로 이 거구요
자 이것을 제가 웹페이지로 열어 볼게요
1점 html 자 요렇게 생겼습니다
자 어때요 아까 보셨던 것보다 못생겼지만 어쨌든 간에
요소는 다 갖고있어요 자 아이들의 입력하는 장
또 패스워드를 입력하는 텍스트 필드 그리고 입력된 정보들을 서버로
전송하는 질이 보내기 버튼 서브 및 버튼 2
이렇게 있는 거죠 자 그럼 여기잇는 요가 까일 것들이 html 코드
상으로는 어떻게 되는가를 살펴보면 이렇습니다
자 여기에 있는 요 요 부분은 자 제가 지금 강조 표시하고 있는 톡
html 태그의 해당됩니다 그리고 여기 있는 요 부분은
이것의 해당됩니다
그리고 어 질이 보내기 라고 하는 이것은 바로 요거 3
해당 돼요
그래서 여태 그 들의 이름 이름이 뭐예요 이름도 벌써 인풋이 잖아요 님프
무언가를 입력 받는다 는 뜻에서 이름이 벌써 인풋이 잖아요
예 그런데 다만 요렇게 생긴 것도 있고 이렇게 생긴 것도 있는데 그것들의
모양이 바뀌는 것은 이 html 태그의 임프 태그의 타입 이란 속성의
값이 텍스트 면
요렇게 나오고요 타입 이라고 하는 속성의 값이 써봄 2시면 요렇게 나오게
되는 것이죠 자 그러면 제가 여기에 있는 요 아이디 패스워드 를 입력하고
입력된 정보를 서버로 전송하기 위해서 질이 보내기 버튼을 누르면
자 여기에 있는 유아 레리 어떻게 변경 되는지를 보셔야 됩니다
한번 해볼게요
자의 오잉 1 ez
그리고 질이 보내기 버튼을 누르면 url 이 이렇게 바뀝니다
잡어가 에서 제가 조금 수정을 했습니다 다시 7이 보내기 버튼을 누르게
씁니다
자 클릭하면 자 보시는 것처럼 url 이 요렇게 받겠죠
이점 php 로 가면서 아이디는 2 고 2 prn find 패스워드 l1
아까 제가 손으로 직접 입력했던 것이 이 폼을 이용하니까
요기에 사람이 사용하기 좋은 유저 프렌들리 한 환경에서
음 이거 입력하고 1 입력하고 질이 보내기를 하니까 이 브라우저가 알아서
유아 례 를 만들어서 서버 쪽으로 전송을 하고 있습니다
자 요정도면 쓸만 하겠죠 바로 이게 여러분들이 지금까지 웹서비스를 또는
웹 애플리케이션을 사용할 때 서쪽으로 어떤 정보를 전송 한다.고 하면 이런
방식으로 전송을 한 것이고
전송할 때 이런 식으로 url 이 변경되게 된다 는 겁니다
사실은 그렇진 않지만 그렇게 할 수도 있기 때문에
요거는 제가 조금 이 애매한 부분이 있어서 제가 정확한 얘기는 좀 나중에
하겠습니다 지금 일단 그렇게 이해하시면 됩니다
자 그럼 여기잇는 요 위에 있는 요 html 중에서
어제가 여기 있는 요섭이 버튼에 해당되는
버튼을 눌렀을 때
자 여기 있는 유아를 해보시면 2점 php 라고 하는 애플리케이션 으로
이동을 했잖아요
이유 알에게 변경 됐잖아요 저게 변경된 근거는 어디 있냐면 바로 여기에
있습니다
즉 액션 이라고 하는 폼의 속성의
기술되어 있는 값인 2점 php 로 서버 b 버튼을 누르면 여기에 있는
임프 컨트롤 드 l 입력 컨트롤 들의 입력되어 있는 값들이 전송 되게
된다는 겁니다
자 그래서 여기에 있는 이 폼 이라고 하는 요 태그는
이 폼 태그 열리는 것과 다치는 것 사이에 있는 구간
이 만큼이 줘
이 구간에 있는 컨트롤에 입력된 값들이 서브 미 버튼 a 에서 전송 됐을
때 전송 됐을 때 어
어떤 url 로 그 정보들을 보낼 것인가 라는 것을 액션에 지정을 하는
것이고 그리고 어떤 방식으로 보낼 것인가를 게 3 지정을 하는 겁니다
아셨죠 굉장히 중요한 내용입니다
그리고 이것이 우리가 php 와 같은 애플리케이션을 사용하는 이유라고 할
수가 있어요
왜냐하면 html 만으로 는 또 아파치와 같은 웹 서버 만으로는
요렇게 상호작용하는 이 웹 서비스를 또 웹 애플리케이션을 만들 수가 없기
때문에 그렇습니다
자 그럼 우리 복습 차원에서 서버와 클라이언트에 대한 얘기를 또 해 보죠
요거는 계속 제가 반복해서 얘기할 겁니다
좀 늦고 기 하셔야 될 개념이기 때문에
자 우선 우리가 지금 예제에서 살펴본 파일이 음 2개가 있습니다 하나는
폼에 대한 정보가 담겨 있는 html
파일이 하나 있고요 그리고 또 하나는
그 폼에서 전송한 데이터를 받아서 화면에 출력해주는
php 애플리케이션이 있습니다
그리고 이것들은 파일의 형태로 존재하죠
제가 여러분이 업 브라우저에서
url 을 입력하고 엔터를 땅 치면
이 브라우저가
클라이언트 컴퓨터를 거쳐서
인터넷을 거쳐서 서버 에 도착하면 누구에게 도착하나요
웹 서버 서버 컴퓨터에 설치되어 있는 웹서버의 도착합니다
그럼 웹서버는 2 서버 컴퓨터에 저장되어 있는 html 문서를 찾아서
그것을 읽은 다음에
그 html 문서를 요청한 브라우저로
그 정보를 쏘아 줍니다 그럼 브라우저는
그 정보를 받아서 거기 있는 html 태그를 해석해서 거기에 적혀있는
대로 html 태그의
어 기술되어 있는 대로 화면을 구성해 주는 것이고 우리가 방금 살펴봤더니
거 에서는 요렇게 생긴 폼을 만들어 졌죠
서브 미시 입니다 1r
그리고 우리가 여기다가 사용자가 어떤 값을 입력하고 서브 이 버튼을
누르면
그러면 브라우저는 다시 웹 서버를 찾아 갑니다
자 그때 어 url 뒤에 뭐가 붙어 있나요
확장자가 점 php 로 끝나는 php 애플리케이션의 이름이 적혀 있죠
앱의 이름 점 php
그리고 그 뒤에는 뭐가 붙어 있어요 물음표가 있습니다
그리고 네임은
컬처 힘이 들어가네요 있는
이거 2
이라고 하는 정보가 붙어있고 m 퍼스 &
그리고 패스워드는
1121 이라고 적혀 있는 상태로
예 웹 서버로 데이터가 전송이 되는 거죠 자 그럼 웹서버는 요 정보를
받아요 그리고 이 확장자를 보니까 자기가 처리할 수 없다라는 걸 알죠
이거를 여러번 얘기했습니다 그럼 웹서버는 자기가 처리할 수가 없기 때문에
예 웹 서버 옆에 있는 이 php 엔진
엔진을 부릅니다 호출 해요
그래서 php 엔진 에게 지시를 합니다 멀지 시 하냐면
앱 점 php 라는 파일을 열어서
그거 좀 처리해서 그 결과 나한테 좀 보여 줘 라고 php 엔진 에게
어요 청을 하는거요 위치가 아니라 2 가 들어가야 되는데
자 그럼 php 엔진은 뭘 하나요
웹서버가 지시한대로 앱 점 php 라는 파일을 찾는 거죠 이겁니다
예 그리고 거기 있는 내용을 읽어서 거기에 있는 php 코드를 쭉
해석합니다
그때 그런데 그 과정에서 이 웹서버가
요 php 엔진의 게 또 하나의 정보를 주는데 그 정보가 바로 이겁니다
즉 사용자가 전송 안 님프 정보를 함께
php 에게 전달을 해주는 거에요
그럼 php 는 여기 있는 요 코드를 해석하는 데 뭘 맞느냐 자 달라
언더바 켓 이라고 하는 코드가
나타나는 거예요
그러면 정확하게 똑같진 않지만
여기에다가 사용자가 입력한 정보를
치환 시켜서 그 php 코드를 처리 하는 거죠 그럼 php 코드의 처리된
결과를 바로 웹 서버에게 돌려주고
웹서버는 것을 취합해서
웹브라우저 에게 다시 쏘아 주는 겁니다
그렇게 해서 나온 결과가 아까 우리가 살펴 봤었던 웰컴 콤마 블라블라
이런 결과가 화면에 출력 되게 되는 것이죠 자 이 여정을 여러분들이 잘
이해 하셔야 됩니다 아시겠죠 자 그러면 음
이 다음 동영상에서 나지가 끝냈습니다
얘기 할 얘기가 너무 많아요 자 다음 동영상에서 는 데이터를 전송할 때
갭 방식으로 전송할 수도 있고 포스트 방식으로 전송할 수도 있는데 그것이
어떤 차이를 갖는지 를 살펴보면서
음 약간 http 프로토콜의 대해서도 잠깐 살펴보는 시간을 갖도록
하겠습니다
댓글 0개
등록된 댓글이 없습니다.