본문 바로가기

웹 개발

(20)
웹 개발 공부 일기장 마지막으로 추가한 게시판 기능을 설명하며 웹 개발은 마치도록 하겠습니다. 1. 게시글 검색 기능 이제부터 검색 단어와 정렬 기능이 더해져 애초에 게시판에 접속할 때 해당 값을 받도록 하였습니다. 입력 받은 값들로 해당되는 게시글만 가져오도록 하였고 입력이 없을 시 기본 값을 지정해주었습니다. public static function searchBoard($page, $category, $word, $sortCategory, $sort) { $db_conn = connectDb(); $startPage = ($page - 1) * 10; $likeWord = "'%".$word."%'"; $query = "select * from boards where $category like $likeWord orde..
웹 개발 공부 일기장 (게시판) 1. 게시판 웹 개발한 부분 작성 아직 검색 기능과 페이지 기능은 만들지 않았지만, 대충 디자인만 해놓고 나머지는 실제 구현 가능하도록 만들어 보았습니다. 화면에 사진과 같이 보여주기위한 기본 HTML 코드 Search 게시판 목록 제목 조회수 작성자 Previous 1 2 3 Next 로그아웃 > 글쓰기 마이페이지 베스트 게시글 # 베스트 게시글 가져오기위한 Board 모델 추가 사항 public static function getBestBoard() { $db_conn = connectDb(); $query = "select * from boards order by view desc limit 0,10 "; $result = mysqli_query($db_conn, $query); return $r..
웹 개발 공부 일기장 (마이페이지 수정) 일단 마이페이지 수정한 부분을 보여드리겠습니다. 보여주는 화면 구성한 php (위의 사진처럼 보여짐.) 회원 정보 이름 : 아이디 : 이메일 : 전화번호 : 생년월일 : 회원정보 변경 | 프로필 사진 변경 회원탈퇴 프로필 사진 변경 Upload 닫기 회원 프로필 사진 변경하기 위해 입력 받은 파일 처리 사진을 가져올 때는 데이터베이스에 저장된 경로로 가져올 수 있음. 부족한 부분 - 사진을 변경할 때마다 사진이 저장되어 기존의 사진을 삭제하는 기능을 추가!하면 좋을 것 같음. - 회원 탈퇴 기능 아직 미구현. 보여지는 화면을 구성한 PHP (위의 사진처럼 보여짐.) 게시판 가기 나의 게시글 글쓰기 제목 :
웹 개발 공부 일기장 4 과제 (마이페이지) 게시판을 만들어 보기 전에 마이페이지 먼저 만들어보도록 하겠습니다. 마이페이지는 데이터베이스에 있는 사용자의 정보를 출력해주고 수정할 수 있도록 만들어 보겠습니다. Home // userid를 넣어주면 해당 user의 데이터를 가져옴 Page // user의 정보를 출력 이름 : 아이디 : 이메일 : 전화번호 : 생년월일 : // 회원정보를 변경하고 싶을 때 링크 클릭 시 수정할 수 있는 페이지로 이동 회원정보 변경 위와 같이 작성하여 마이페이지를 만들어 주었습니다. 를 넣어주면 php에서 생성한 변수를 html에서 출력할 수 있습니다. 이것을 통해 user 정보를 출력했습니다. 결과 페이지를 보겠습니다. 회원가입할 때 이름, 아이디, 이메일만 적어주었기 때문에 전화번호와 생년월일은 비어있습니다. 이것을..
웹 개발 공부 일기장 4 - 과제 (쿠키탈취 및 키로거) 1. 자바스크립트 공부하고 쿠키 탈취나 키로거 만들어보기 쿠키 탈취 자바스크립트에는 XMLHttpRequest 객체가 내장되어 있는데 이 객체를 통해 서버에 데이터를 요청하고 응답받은 데이터를 처리할 수 있습니다. const Http = new XMLHttpRequest(); // 객체 생성 const url = 'http://172.16.22.131/task4/check-cookie.php'; // 요청 URL Http.open('GET', url); // 해당 url로 GET 요청을 지정 Http.send(); // 실제 요청 전송 위와 같이 코드를 입력하면 XMLHttpRequest 객체를 이용하여 요청을 보낼 수 있습니다. 실제 요청을 보내고 응답이 결과를 네트워크 탭을 통해 확인 할 수 있습니..
웹 개발 공부하기 4 - 과제 (자바스크립트) 1. 자바스크립트 공부하고 쿠키 탈취나 키로거 만들어보기 일단 자바스크립트가 무엇인지 알아보겠습니다. 웹을 만들때 html, css를 사용하면 html은 기본 뼈대 즉 웹 페이지가 구성하는 것을 만들 수 있습니다. css는 html로 만들어진 웹 페이지를 꾸며 줄 수 있습니다. 이미지와 같이 왼쪽은 html를 사용하여 페이지의 기본 뼈대를 만들고 css를 사용하여 오른쪽처럼 꾸며주는 것입니다. 여기에 자바스크립트를 더해주어 보여주기만하는 것이 아닌 어떠한 동작을 할 수 있게 할 수 있습니다. 예를 들면 광고 이미지가 자동으로 넘어가게 하거나 더보기를 클릭하면 페이지가 넘어가지 않고 좀 더 많은 서비스를 보여주는 등 사용자에게 편리한 기능을 제공할 수 있습니다. 이제 자바스크립트를 사용하기 위한 기본적이고..
웹 개발 공부하기 4 - 3 (HTTP) 버프 스위트를 보면 http 요청과 응답을 확인할 수 있는데 http가 무엇인지 보도록 하겠습니다. HTTP란? http는 데이터 교환을 요청과 응답 형식으로 정의한 프로토콜입니다. 즉, 클라이언트의 요청에 대해 서버가 응답하는 형식으로 작동합니다. 형식을 정의한 프로토콜로 해당형식을 맞춰서 요청과 응답을 하여야합니다. 버프 스위트를 보면 실제 요청과 응답의 형태를 확인할 수 있습니다. http요청은 http헤드와 http 바디로 나눌 수 있습니다. (공백 한 줄로 구분) 그렇기 때문에 위의 요청을 보면 공백 한줄 아래 아무것도 없기 때문에 바디가 없는 것을 확인할 수 있습니다. 그리고 헤드는 첫 줄인 시작줄과 나머지인 헤더로 한번더 구분할 수 있습니다. 시작줄 시작줄에는 메소드, 경로, http버전을 ..
웹 개발 공부 일기장 4 - 2 (Burp Suite) 저번 시간에 프록시 설정하는 것과 버프 스위트설정 하는 것을 알아보았습니다. 이번에는 실제 버프 스위트 기능을 몇가지 알아보겠습니다. 버프 스위트의 proxy탭에 Intercept, History가 있으며 intruder, repeater 탭이 있는 것을 확인할 수 있습니다. 이것에 대해 하나씩 실습과 함께 알아보겠습니다. 1. intercept은 프록시 서버로 거쳐가는 요청을 프록시 서버에서 잡아놓는 기능입니다. 실제로 요청을 보내니 브라우저에 응답이 오지않고 버프스위트에서 요청 내용을 확인할 수 있습니다. 이때 forward를 눌리면 현재 요청을 보내게 됩니다. 또한, intercept on 버튼을 눌리면 잡고있는 것을 놓아주며 전체 요청을 보낼 수 있습니다. forward를 눌려주니 해당 요청을 보..