웹8 PKCE란 🔐 PKCE (픽시)란?PKCE (Proof Key for Code Exchange) 는👉 OAuth2 인증 코드 플로우에서 코드 탈취 공격(code interception)을 방지하기 위한 보안 강화 방법입니다.📌 왜 필요한가?기본 OAuth2 인증코드 방식에서는:클라이언트가 /authorize 요청 → 인증 서버에서 code 응답클라이언트가 /token 요청 시 그 code로 access token 받음✅ 문제: 공격자가 중간에서 code를 가로채면 access token을 받아버릴 수 있음→ 이걸 막기 위해 PKCE를 사용합니다. 용어 설명code_verifier클라이언트가 랜덤하게 생성한 문자열 (43~128자 사이, 영숫자 + -._~)code_challengecode_verifier를 .. 2025. 6. 26. isostring 1일 밀리는 이유 https://anywaydevlog.tistory.com/46 [javascript] toISOString() 1일 전 날짜가 뜨는 이유 및 해결법 (UTC 타임존 zero offset 이슈)toISOString() 는 Date 를 ISOString(yyyy-mm-ddThh:mm:ss) 형식의 문자열로 변환해주는 함수이다. 그런데 이 함수를 사용하면 날짜가 하루 전 날짜가 찍힌다. 이유는 이 함수가 우리나라 Time Zone 이 아니라 UTCanywaydevlog.tistory.com 2024. 12. 16. form.submit()와 axios.post() 데이터 전송의 포맷차이 form.submit()와 axios.post()는 서로 다른 방식으로 데이터를 전송합니다.HTML form.submit()HTML 폼을 사용하여 데이터를 제출할 때, 사용자가 입력한 데이터는 기본적으로 application/x-www-form-urlencoded 형식으로 서버에 전송됩니다.예를 들어, 사용자가 입력한 username과 password가 있다면, 서버에 보내는 데이터는 다음과 같은 형식입니다 username=사용자명&password=비밀번호 Axios axios.post()Axios를 사용하여 POST 요청을 보낼 때, 기본적으로 JSON 형식으로 데이터를 전송합니다.위의 예시에서 axios.post()를 사용할 경우, 데이터는 다음과 같은 JSON 형식으로 전송됩니다 { "user.. 2024. 10. 24. 브라우저 언어감지, 다국어 페이지 URL로 표현하기 브라우저 언어 변경하기chrome://settings/languages#lang위의 링크에 들어가서 원하는 언어를 가장 위로 이동시킨다. const browserLang = navigator.language;const langCode = browserLang.toLowerCase().substring(0, 2);console.log(langCode); // en, ko import i18n from "i18next";import { initReactI18next } from "react-i18next";import LanguageDetector from "i18next-browser-languagedetector";import enTranslations from "../public/locales/.. 2024. 9. 20. React로 WebSocket 통신해보기 (client, server) 사이드 프로젝트에서 채팅을 담당하게 되서 이참에 Websocket을 정리해보려고 한다. (환경은 React + Typescript + NodeJS이다) 웹소켓 클라이언트와 서버 간의 양방향 통신 프로토콜이다 실시간 통신이 가능하다 Server 백엔드분과 통신하기 전에, 로컬서버를 만들어 채팅을 주고 받을 수 있는지 테스팅해보기로 했다. 서버 폴더를 생성하고 server.ts를 생성한다. mkdir websocket_test cd websocket_test npm init -y 그리고 다음 패키지들을 설치한다 npm i ws npm i ts-node-dev npm i --save-dev @types/ws npm i --save-dev @types/node server.ts를 만든후 다음과 같이 작성한다 i.. 2024. 4. 16. ESC눌러서 모달창 닫기, 배열을 querystring파라미터로 전달하기 ESC눌러서 모달창 닫기 useEffect(() => { window.addEventListener('keydown', (e: KeyboardEvent) => { if (e.key === 'Escape') { onClose(); } }); return () => window.removeEventListener('keydown', () => onClose); }, [onClose]); 배열을 querystring파라미터로 전달하기 JSON으로 serialize할 수 있다 myArray = ['aaa', 'bbb', 'ccc']; var arrStr = encodeURIComponent(JSON.stringify(myArray)); // '%5B%22aaa%22%2C%22bbb%22%2C%22ccc%22%5.. 2023. 9. 12. 이전 1 2 다음
