웹프로그래밍 4

[자바웹프로그래밍] 쿠키(ID저장) , 세션 , xss 공격 팝업이 계속해서 뜬다면?

지난 글에 popup에 대한 쿠키를 했다면 이번엔 로그인 폼에서 ID저장을 해보겠다. 먼저 로그인 폼에 아이디 저장 체크박스를 만들어줄 것이다.비밀번호를 잊으셨나요? 아래에 다음과 같은 아이디 기억 코드를 작성한다.그럼 이렇게 기능이 없는 빈 체크박스가 만들어진다. 그럼 id가 저장되는 기능을 구현해보겠다. js_login.js으로 넘어가 check_Input 함수 최상단에 다음과 같은 변수를 넣어준다. ( html에 구현한 체크박스를 가져옴. ) 그리고 최하단 submit()이전에 다음과 같은 코드를 넣어준다. 저번에 만들었던 setCookie 함수를 통해 쿠키를 저장하는 과정이다. 이제 기존에 만들었던 js_popup.js에서 set,get 쿠키 함수들을 가져와서 적용한다. 여기서 주의해야할점은 기존..

[자바웹프로그래밍] 화살표 함수, 로그인 창 구현

화살표 함수란 무엇일까? 기존 함수 선언 방식인 function 키워드를 비교적 간결하게 만든 선언방식이다.js_popup.js 에서 예를들면 기존에 이렇게 함수 선언을 했다면,위와 같은 이미지로 하는게 화살표 함수이다. 화살표 함수의 장점은 간결하고 명확한 표현이다.단점은 new연산자 사용 불가능이다.(객체 생성 X) 다음은 로그인 창 구현이다. 먼저 기존의 메인html에서 검색하기 버튼 옆에 로그인 버튼 하나를 만들겠다.검색하기 아래에 다음과 같이 코드를 해주면위의 이미지처럼 상단에 로그인 버튼이 표시되는걸 볼 수 있다. 로그인 버튼을 눌렀을때, 새로운 창이 떠야하므로 popup.html을 만든것처럼 로그인폴더와 login.html을 생성해준다. 생성이 완료되었다면 부트스트랩에서 디자인을 가져올 것..

[자바웹프로그래밍] JS, 검색 기능 만들기,간단한 팝업창 구현하기

몇가지 기능들을 구현할건데 이런 기능 처리는 대부분 .js파일로 구현해준다. 쉽게 말하면 핵심 로직을 구현하는 것이다.  어떤식으로 적용되는지 테스트를 해보겠다.그럼 js 폴더 - js_test.js 를 만들어보겠다.이렇게 만들었다면이렇게 코딩을 작성한다. 위의 코드를 설명하면 var는 변수 선언할때 사용하는 것이다. 이렇게 코드작성을 완료했어도 사이트에 바로 적용되는게 아니다. 메인 html에서 스크립트 파일을 불러줘야한다.  이걸 head 태그에 작성해준다. 그리고 사이트를 실행하고 F12를 눌러준다.그럼 위의 이미지처럼 개발자 창이 나올텐데 여기서 Sources를 들어가준다 그럼 이렇게 나오는데 이상하게 내가 작성한 js폴더와 파일이 보이지않는다. 왜그럴까? js파일의 이름이 잘못되었다. 이걸 다시..

[자바웹프로그래밍] 사이트만들기

먼저 자바웹프로그래밍이란. 우리가 흔히 보는 웹사이트를 만드는 일이다. 쇼핑몰,게임사이트 등등 모든 것 말이다. 배우고있는 내용을 여기에 정리할 예정이다. 일단 첫 번째로 해야할 일은 Visual Studio Code(클릭)를 다운해야한다. 다운을 완료했다면 실행 후 로그인을 한다면좌측에 이런칸이 보일 것이다. 여기서이 빨간박스인 마켓플레이스를 클릭하면 된다. 여기선 자바언어 외에도 파이썬 등등 각종 언어를 다운해 실행시킬 수 있다. 우리가 다운할걸 검색하면 된다. 우리는소스 코드 정렬,태그 자동 닫기, 이미지 Prettier, image Preview 브라우저 실행 Live server 언어팩 Korean language pack 이것들을 다운해주면 된다. 그럼이렇게 설치된 모습을 볼 수 있다.  그..