본문 바로가기
반응형

WEB front-end/Javascript14

javascript post redirect 고객사의 웹사이트를 만드는 업체에서 우리가 제공하는 웹페이지를 임베디드 해서 보여주기로 했었는데.. 단순페이지가 아니라서 모바일에서 보여줄수가 없다고 연락이 왔다. 임베디드 해주겠다고 한지 한달이 지나서야.. ;;; 원래 location.href 로 넘길려고 했으나.. 제공한 URL이 GET방식이어서 변수값 노출을 막기위해 POST 전송 방식이 필요했다. 서비스 URL과 보여줘야할 URL의 도메인이 달라서 화면을 새로고침하면서 POST로 전송을 해야했다. 문자 OTP 인증 후 인증이 완료가 되면 아래의 코드를 실행하도록 안내했다. const form = document.createElement('form'); // form 태그 생성 let objs = document.createElement('inpu.. 2022. 8. 5.
날짜 함수 활용... 오늘해야 할 일은 로그인 아이디별로 설정한 로그인/로그아웃 시간에 따라 로그아웃 설정 시간 30분 전에 사용자에게 미리 알림 주기 로그아웃 시간이 되면 로그아웃 시키기 현재 사용중인 프로그램에 자동 로그아웃 기능이 없고 , 다만 로그인 시에 오전 8시 ~ 오후 9시 에만 로그인 가능 하도록 되어 있다. 즉, 로그인을 했다면.. 오후 9시 이후라도.. 로그아웃 하지 않으면 무한 사용 가능한 상황.. 이런걸 애려라고 할수는 없으나.. 혹시나 모를 보안 사고 방지를 위해 아이디별로 로그인/로그아웃 시간을 설정을 해 놓고.. 30분 전에 미리 알림을 주고.. 시간이 되면 로그아웃이 되게 해 달라는 클라이언트의 요청... getDate() 함수를 이용하면 날짜를 핸들링 할수 있다는 것은 누구나 알고 있지만... .. 2022. 6. 22.
Set 셋은 잘 쓸일이 없긴한데.. 가끔 배열의 항목중에 중복을 제거해야할 일이 있을때 사용하면 유용할거 같다. Set은 중복을 허용하지 않는 값을 모아놓은 특별한 컬렉션 키가없는 값이 저장됨 * 주요 메서드 new Set(iterable) : 셋을 만듬 . 이터러블 객체를 전달받으면 그 안의 값을 복사해서 넣어줌 set.add(value) : 랎을 추가하고 셋 자신을 반환 set.delete(value) : 값을 제거. 호출 시점에 셋 내에 값이 있어서 제거에 성공하면 true, 아니면 false 반환 set.has(value) : 셋 내에 값이 존재하면 true, 아니면 false set.clear() : 셋을 값을 비움 set.size : 셋내의 값의 갯수 let set = new Set(); let le.. 2022. 6. 21.
Map 내가 진행한 웹 프로젝트에서는 거의 쓰지 않는거 같은데... React와 React Native를 잠간 보니.. 그래도 꽤 쓰는거 같아.. 미리 개념을 정리 해 둔다. Map 은 키가 있는 데이터를 저장 한다. * 주요 메서드와 프로퍼티 new Map() : 맵 생성 map.set(key, value) : key를 이용하여 value를 저장 map.get(key) : key에 해당하는 값을 반환. key가 존재하지 않으면 undefined를 반환 map.has(key) : key가 있으면 true, 없으면 false map.delete(key) : key에 해당하는 값을 삭제 map.clear() : 맵의 모든 요소 제거 map.size : 요소의 갯수 반환 let map = new Map(); map... 2022. 6. 20.
fetch javascript를 사용하면 필요할 때 서버에 네트워크 요청을 보내고 새로운 정보를 받아올수 있음 이때, 페이지를 새로고침 없이 조회 가능 fetch()는 구식 브라우저에서는 지원하지 않지만, 대부분의 모던 브라우저에서 지원 됨 * 기본문법 let promise = fetch(url, [options]) - url : 접근 하고자 하는 URL - options : 선택 항목, method나 header등을 지정 할 수 있음 - options에 아무것도 넘기지 않으면 GET 으로 요청 - fetch()를 호출하면 브라우저는 네트워크 요청을 보내고 promise 가 반환됨 - http 상태는 응답 프로퍼티를 사용하여 확인 가능 - status : http 상태코드 - ok : http 상태코드가 200 ~.. 2022. 6. 3.
예외처리... 코딩을 하다보면 종종 실수를 하는데.. 무슨 자신감인지.. Jvascript 코딩할 때는 예외처리를 종종 하지 않은 경우가 있다. Javascript는 애러 발생시 스크립트가 더이상 실행이 되지 않고 콘솔에만 애러 내용이 출력이 된다. 이때, 사용자는 이유를 알수없고 화면은 그냥 멈춘다. 이것을 방지하기 위해 try.. catch 를 사용하여 스크립트가 죽는 걸 방지하고, 에러시에 적절한 안내 등 뭔가를 할수 있다. * 문법 try{ // 코드 }catch(err){ // 에러 핸들링 } 기본 문법은 간단하다. try{...} 내에 코드를 실행하고 이상이 있으면 catch(err) {..} 로 이동하며, err 변수에 에러 내용을 전달함 (이때 err의 명칭은 아무거나 상관이 없음). ** 주의할점 - .. 2022. 6. 2.
반응형