실무 환경에서는 웹 개발자들이 이런 브라우저 보안 정책들(CSP, CORS, SRI, 쿠키 속성, Referrer-Policy 등)을 어느 정도 수준까지 직접 명시적으로 선언하고 관리하는지가 궁금합니다. 예를 들어, 어떤 정책들은 코드나 미들웨어에서 직접 작성하고, 어떤 정책들은 서버나 CDN 레벨에서 일괄 설정되는지 그 구분의 현실적 기준이 있다면 듣고 싶습니다. 또한 이런 보안 헤더들을 설정할 때 자주 사용하는 라이브러리나 프레임워크 추천 도 부탁드립니다. (예: Express helmet , Next.js next-safe , Nginx 보안 헤더 설정 등)
CSP, CORS, SRI, 쿠키 속성, Referrer-Policy 같은 HTTP 기반 보안정책들은 서버가 응답 헤더로 내려주면 브라우저의 내부 policy layer에서 관리된다고 알고 있습니다. 그런데 이때 브라우저가 이런 보안 정책들을 저장하고 적용하는 단위가 Origin 단위(정확히 scheme + host + port )로 관리되는지 , 아니면 Site 단위(예: eTLD+1 기반, 쿠키 격리처럼 더 넓은 범위) 로 관리되는지도 궁금합니다. 즉, 브라우저의 보안 정책(policy layer)은 어떤 기준 단위로 정책을 식별·적용하며, 개발자가 설정한 CSP나 CORS 같은 정책들이 브라우저 내부에서 어떤 스코프로 캐싱·격리되어 동작하는지 알고 싶습니다.
react (client) + node.js (backend) 와 같은 구성에서는 SOP 에서 설명해주신 '동일 출처 정책' 으로 인해 'fetch' 등을 사용할때 막히는 경우가 종종 있었는데요. 그래서, 이전에는 fe 팀과 be 팀이 개발을 할때 CORS 작업을 항상 했었던걸로 기억합니다. 최근에 많이 사용하는 next.js 는 bff (backend for frontend) 가 중간에 있어서 SOP 로 인한 문제가 거의 없는것 같은데요. (SOP 는 설명해주신것처럼 브라우저 자체의 보안이기 때문에) 이렇게 이해하는게 맞을까요?
put, patch, delete 메서드의 경우 options (사전 요청) 을 보내게 된다고 하셨는데요. 물론, 설명 주신것처럼 "Access-Control-Max-Age" 를 통해서 캐싱을 하는 방법도 있겠지만, get 과 post 요청만 사용하는게 (사전 요청을 하지 않으니) 좀 더 효율적인 방법이 될수 있을까요?
서버 구성해서 직접 만들고 있는데, 입력폼에서 스크립트가 안먹히더라고요. 쭉 강의 보고 실습필요한 부분 다시 보는데 일전에 브라우져 설정을 변경 했었었나요. 기억이 가물합니다! Content-Security-Policy-Report-Only 이 옵션 때문에 가능했던가요.
학습하는 분들께 도움이 되고, 더 좋은 답변을 드릴 수 있도록 질문전에 다음을 꼭 확인해주세요. 1. 강의 내용과 관련된 질문을 남겨주세요. 2. 인프런의 질문 게시판과 자주 하는 질문(링크)을 먼저 확인해주세요. (자주 하는 질문 링크: https://bit.ly/3fX6ygx) 3. 질문 잘하기 메뉴얼(링크)을 먼저 읽어주세요. (질문 잘하기 메뉴얼 링크: https://bit.ly/2UfeqCG) 질문 시에는 위 내용은 삭제하고 다음 내용을 남겨주세요. ========================================= [질문 템플릿] 1. 강의 내용과 관련된 질문인가요? (아니오) 2. 인프런의 질문 게시판과 자주 하는 질문에 없는 내용인가요? (예) 3. 질문 잘하기 메뉴얼을 읽어보셨나요? (예) [질문 내용] 쿠키에 대해서 알게 되었지만 궁금한점이 있습니다. 구글에 검색하다 본 기억이 있는데 쿠키 & 세션을 REST 개발환경에서는 못쓴다고 본적이 있는거 같은데 스프링 부트로 rest형식으로 개발할 때는 쿠키 & 세션을 못쓰는게 맞나요? 만약, 못쓰는게 맞다면 그러면 로그인 유지나 광고 3일 동안 안보겠습니다 같은 쿠키를 사용해야 할 때는 어떤식으로 시켜줘야나요? 리액트와 협업하면 프론트에게 맡겨야 하나요?
쿠키 강의에서 18:00 부분 질문있습니다 아래 코드에서 처음에는 login으로 들어가서 로그인창이나옵니다 그리고 서버에서는 set cookie로 응답을 보내겠죠? 그러고 끝이 나야하는데 왜 처음 로그인할때는 ~~님 환영합니다 까지 뜨는건가요? 요청은 제가 한번 보낸것 아닌가요? 요청(처음로그인) -> 응답(302,쿠키 보내기) .. 여기서 재 요청을 하면 else if(cookies.name)이 작동해야하지만 왜 한번만 요청을 했는데 login , cookies.name 이렇게 2개가 작동하는건가요? if ( req . url . startsWith ( '/login' )) { const { query } = url . parse ( req . url ); const { name } = qs . parse ( query ); const expires = new Date (); // 쿠키 유효 시간을 현재시간 + 5분으로 설정 expires . setMinutes ( expires . getMinutes () + 5 ); res . writeHead ( 302 , { Location : '/' , 'Set-Cookie' : `name= ${ encodeURIComponent ( name ) } ; Expires= ${ expires . toGMTString () } ; HttpOnly; Path=/` , }); res . end (); // name이라는 쿠키가 있는 경우 } else if ( cookies . name ) { res . writeHead ( 200 , { 'Content-Type' : 'text/plain; charset=utf-8' }); res . end ( ` ${ cookies . name } 님 안녕하세요` ); } else {
안녕하세요, 제로초님 강의 잘 들었습니다. 강의를 듣고 혼자서 프로젝트를 진행하는데 너무 막히는점이 있어서 질문드립니다. 마이페이지에서 유저 정보를 불러오는 작업을 하고 있습니다. 토큰을 받아서 쿠키에 저장하여 사용하고 있는데.. 배포시에 저 말고 다른 사람도 저의 토큰으로 요청을 보내는 모습이 발견되었는데 해결을 못하고 있어요ㅠ 로초님 강의 후반부에서 보긴봤었는데 상황이 약간 다른거 같아서 질문드려요ㅠ saveCookies는 쿠키를 받아서 디스패치하여 스토어에 저장하는 함수이고 createCustomHeader는 Authorization : {`Bearer ${token}`}을 리턴하는 함수입니다. export const getServerSideProps = wrapper.getServerSideProps( (store) => async (context) => { saveCookies(store, context); const rootState: RootState = store.getState(); const user_id = rootState.loginState.user_id; axiosInstance.interceptors.request.use( async function (config) { try { config.headers = null; if (context.req && context.req.headers.cookie) { const allCookies = cookies(context); const accessToken = allCookies.accessToken; config.headers = createCustomHeader(accessToken); } return config; } catch (error) { console.log(error); } }, function (error) { return Promise.reject(error); }, ); store.dispatch(getUserInfoInMypageRequest(user_id)); store.dispatch(END); await store.sagaTask.toPromise(); return { props: {}, }; }, );
안녕하세요. 기초강의부터 Nuxt 강의까지 많이 도움을 받았습니다. 다름 아니라... Nuxt 에서 쿠키를 사용할려고 하는데 생각처럼 잘 안되네요... 로그인 구현후 인증값을 쿠키로 저장하고 store 의 state에 쿠키값이 존재시 state 의 데이터를 초기화 할려고 합니다. import Cookies from "js-cookie"; export const state = () => { userName = Cookies.get('userName') || ''; } store/index.js 에 위와 같이 state 값이 쿠키값을 초기화할려고 합니다. 하지만 userName 에 쿠키값이 초기화되지 않습니다. nuxtServerInit 등 여러삽질을 해봤지만 해결점을 찾지 못했습니다. Nuxt 에서 쿠키활용에 대해 설명해주시면 많은 도움이 될거같습니다.
쿠키의 도메인을 naver.com이라고 지정했습니다. 쿠키는 blog.naver.com 과 www.naver.com 에서 모두 보내집니다. www.naver.com/some 하위 경로에만 쿠키를 보내고 싶어서 path는 /some이라고 지정했습니다. 이 때 blog.naver.com에는 /some이라는 패스가 없다면 쿠키가 쿠키가 무시되고 만약 /some이라는 패스가 존재한다면 보내지게 되나요?
안녕하세요. 현재 강의를 수강 중에 https 설정 후 발생하는 문제가 있어서 질문드립니다. 현재 모든 강의를 수강하고 SSL 인증서를 적용하는 제로초님 블로그 의 글을 따라 하고 있는데 로그인은 되지만 로그아웃이 되지 않는 현상이 발생합니다. 개발자도구 - 네트워크에 응답으로 withcredential 예외 응답이 오는 걸로 봐서는 쿠키 설정에 문제가 있는 것으로 추측됩니다. (Nginx 설정은 블로그에 있는 설정에 도메인만 바꿔서 적용하였고 다른 부분은 바꾼 것이 없습니다.) Nginx 설정에 쿠키를 보낼 수 있도록 적용하면 될거 같은데 혹시 다른 문제이진 않은가 걱정이 되어 글을 남깁니다. 또한 혹시 https를 적용하고 또 설정해줘야 하는 부분이 짐작되는 것이 있으시다면 조언해주시면 감사하겠습니다.
