본문 바로가기
728x90
반응형

분류 전체보기539

helmet 보안 xss 필터 추가 helmet 모듈은 서버에서 다양한 HTTP 헤더를 자동 설정을 통해 서버 어플리케이션의 보안을 강화해주는 대표적인 노드 보안 모듈 main.ts 에서 설정 해준다. import * as helmet from "helmet"; const app = await NestFactory.create(AppModule); app.use(helmet()); //csp, expectCt, hpkp, noCache, referrerPolicy는 적용되지 않으니 따로 설정 필요 간단하게 이렇게 적용도 가능하지만 contentSecurityPolicy는 꽤 복잡한 설정이기 때문에 일단 꺼둔다. // app.use(helmet.contentSecurityPolicy()); // Content-Security-Policy 헤.. 2022. 11. 23.
[미아 양꼬치 맛집] "경성양꼬치" 갈비꼬치 top of king 미아사거리역 맛집 미아 맛집 양꼬치 맛집 경성 양꼬치 양꼬치 먹자! 하면 당연스레 자연스레 방문하는 경성양꼬치 갓 킹 제너럴 존맛탱구리구리 여긴 항상 사람이 많음으로 미리미리 방문 필수 미아에만 2개 가 있다. 그렇다는건 돈을 많이 벌었다는것 = 맛잇다 라뗴는 미삼 이었는데 (미아삼거리) 미사 (마이사거리)로 바꼈다. 어색어색 언제 거리 하나 추가된거늬? 메뉴판 기본 양꼬치도 좋지만 여긴 진짜 제발 갈비꼬치 먹어주라 마라갈비인지 양갈비살 꼬치인지 갈때마다 헷갈림 가서 뼈 있는 꼬치 갈비 꼬치 달라카면 설명해주실것 앞접시겸 가루접시 양꼬치는 이거 먹으러 가는거 아니겠는가 처음엔 기본 꼬치를 주문했다. 그리고 기본적으로 마늘꼬치랑 소시지도 주신다 고기 1인분이라 생각하면 비싼금액이 아니지만 항상 밥값이 많이.. 2022. 11. 23.
[Jquery] 마우스 휠& 드래그 이미지 zoom & translate _ 라이브러리X 참고 링크 웹 서핑을 하다 보면 마우스 휠로 줌 인 아웃 많이 해봤을꺼다. 라이브러리를 사용하지않은 코드 😎 import 😎body 😎css #container{ width:500px; height:300px; overflow:hidden; } #slide{ width:100%; height:100%; transition: transform .3s; } img{ width:auto; height:auto; max-width:100%; pointer-events: none; } 😎script $(document).ready(function (){ var scroll_zoom = new ScrollZoom($('#container'),5,0.5) }) //The parameters are: // //cont.. 2022. 11. 10.
[XSS] Nest js에 xss 필터를 넣어서 보안 강화 XSS 방지, Cross Site Scripting # XSS(cross site scripting) 크로스 사이트 스크립트 변조(cross site scripting, xss)는 공격자가 상대방의 브라우저에 스크립트가 실행되도록 해 사용자의 세션을 가로채거나, 웹사이트를 변조하거나, 악의적 콘텐츠를 삽입하거나, 피싱 공격을 진행하는 것 예를 들어 검색어 에 스크립트 코드를 넣어서 악성 코드를 뿌린다던가..등등 nest 는 xss설정을 하는 방법 크게 2가지로 나눈다 1. 파이프 2. helmet 라이브러리 사용 파이프의 경우 필터, 인터셉트와 같은 기능 같지만 우선순위가 낮다. helmet 라이브러리를 이용한 간단한 xss보안 필터 설정을 해보겠다 😎import npm install helmet 모듈을 설치하고 나서 적용 * 파일이름 : main.ts .. 2022. 11. 10.
[몬드리인호텔] 프리 빌리지 루프탑 바 - 이쁘긴 이뻐 근데 답답해 근데 이뻐 몬드리안 호텔 프리빌리지 루프탑 바 친구 생일 파티 겸 방문한 몬드리안 호텔 몬드리안은 인스타에서 많이 접해봤을꺼다. 수영장 인증샷이 수족관 물고기 같은 사진.. 친구 생일이라 어디 파티를 하고싶지만 늙어서 몸도 힘들고 날도 좋았고 (7월) 코로나라서 사람많은곳은 가기싫고 등등 몬드라인에서 수영하고 저녁엔 이쁘다는 루프탑을 가자! 해서 선택 루프탑 바를 갈꺼면 예약이 필수(!) 라기에 호텔 예약하고 바로 bar도 예약했다. 이땐 우기 여서 비가 오면 어떻하죠? 라는 답변에 뭐 천막이라도 쳐주는줄 알았는데 그냥 비맞음서 밖에 안던가 예약 취소란다 실내인지 실외인지 선택하라고.. 서비스 망했구여~ 다행이 이날은 비가 오지 않았다! 실외자리에도 저렇게 돔처럼 비가 안맞는 자리가 있다. 저긴 비오는날 좋을꺼같다.. 2022. 11. 10.
[Jquery] Sortable 라이브러리 사용하여 리스트 드래그 앤 드롭 만들기 Todo List / table List 등 다양한 리스트들 있습니다. 리스트들을 드래그 해서 순서를 변경하는 코드 소개합니다 Sortable 라이브러리 사용했습니다. 기본적인 리스트를 마지막버튼을 드래그 하여 초록색 점이 2번째로 이동! 😎 CDN //드래그 & 드롭 Sortable.create(listWithHandle, { handle: '.my-handle', animation: 150, // Element dragging ended onEnd: function (e) { //드롭했을때 이벤트 실행 var itemEl = e.item; // dragged HTMLElement console.log(e.newIndex+1); updateSort(); } }); updateSort()함수를 만들어 리.. 2022. 11. 2.
[React] client IP / userAgent 정보 받기 외부 라이브러리 사용 하여 클라이언트의 IP 정보를 가져 옵니다. const [ ip , setIp ] = useState(); useEffect( () => { axios.get('https://geolocation-db.com/json/') .then((res) => { setIp(res.data.IPv4) }) },[]) userAgent 정보는 MDN 기본 반찬인 navigator로 출력 가능합니다. const userAgent = window.navigator.userAgent 2022. 10. 6.
[React] 다국어 기능 적용하기 react-i18next 홈페이지에 버튼 클릭으로 다국어를 지원하는 코드입니다. 리액트 기반이며 라이브러리로 i18next 사용했습니다. 위 이미지처럼 클릭시 언어가 변경 됩니다. 폴더 구조 입니다. 😎 src > utiles > i18n > locales > en-US > index.js import page from './page.json' export default{ page } 😎 src > utiles > i18n > locales > en-US > page.json { "소개":"Intro", "인사말":"Greeting", "사업 소개":"BusinessInfo", "참여 기관":"Agency", "데이터":"Data", "안심":"Safe", "분석":"Analysis", "구역":"Zone", "마켓":"Mark.. 2022. 10. 5.
[React-spinner] loading spinner 적용하기 axios interseptor 참고 git npm i react-spinners spiner적용 component를 하나 만들엉줍니다. - loading.js import React, { useEffect} from 'react' import { css } from "@emotion/react"; import BeatLoader from "react-spinners/BeatLoader"; const override = css` display: block; margin: 0 auto; border-color: rgba(255,255,255,0.7); border-width: 10px; `; const Loading = (props) => { const check = props.loading == null ? false : props.l.. 2022. 9. 27.
728x90
반응형