inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

묻고 답해요

172만명의 커뮤니티!! 함께 토론해봐요.

로그인 폼을 만들고 로컬 스토리지에 jwt저장하기 강의에서 질문입니다!

해결됨

파이썬/장고 웹서비스 개발 완벽 가이드 with 리액트

import React, { useState } from "react"; import { Card, Button, Form, Input, notification } from "antd"; import { useHistory } from "react-router-dom"; import Axios from "axios"; import { SmileOutlined, FrownOutlined } from "@ant-design/icons"; import useLocalStorage from "utils/useLocalStorage"; export default function Login() { const history = useHistory(); const [jwtAccessToken, setJwtAccessToken] = useLocalStorage( "jwtAccessToken", "" ); console.log("loaded Token: ", jwtAccessToken); // 왜 이게 두번이나 출력되는 것이지? const onFinish = (values) => { async function fn() { const { username, password } = values; const data = { username, password }; try { //응답을 꼭 받아야 한다. 토큰을 받아야 하니까 const response = await Axios.post( "http://127.0.0.1:8000/accounts/token/", data, { headers: { "Content-Type": "application/json" } } ); // const { data: token } = response; 이런 방식은 아래랑 다르다 response에서 data을 꺼내서 이름을 token이라 짓는 것 // const token = response.data 와 일치하며 밑에 녀석은 // const jwtAccessToken = response.data.access 과 일치한다 const { data: { access: jwtAccessToken }, } = response; setJwtAccessToken(jwtAccessToken); notification.open({ message: "로그인 성공!", icon: <SmileOutlined style={{ color: "#108ee9" }} />, }); // history.push("/accounts/login"); //TODO: 이동주소 } catch (error) { console.log(error); if (error.response) { notification.open({ message: "로그인 실패!", icon: <FrownOutlined style={{ color: "#ff3333" }} />, description: "아이디/암호를 확인해 주세요.", onClick: () => { console.log("Notification Clicked!"); }, }); } } } fn(); }; return ( <Card title="login"> <Form labelCol={{ span: 8 }} //부트스트랩은 한 행이 12 컬럼인데 antd는 24컬럼임 wrapperCol={{ span: 16 }} style={{ maxWidth: 600 }} onFinish={onFinish} autoComplete="off" > <Form.Item label="Username" name="username" rules={[{ required: true, message: "Please input your username!" }]} //rules을 통해 유효성검사로직이 들어가 잇다 > <Input /> </Form.Item> <Form.Item label="Password" name="password" rules={[ { required: true, message: "Please input your password!" }, { min: 5, message: "5자리 이상 해주세요" }, // 한글자 한글자 들어갈때마다 검사해준다. ]} > <Input.Password /> </Form.Item> {/* //8칸 이동하고 16칸을 쓰겠다 */} <Form.Item wrapperCol={{ offset: 8, span: 16 }}> <Button type="primary" htmlType="submit"> Submit </Button> </Form.Item> </Form> </Card> ); } 안녕하세요 강사님!! 위에서 15번째 줄에 있는 console.log("loaded Token: ", jwtAccessToken); 이 부분이 페이지의 콘솔창에서 두번이나 나타납니다... 왜 그런지 알 수 있을까요?? 새로고침을 했을때도 두번 나타나고 submit을 했을 때도 2번 출력됩니다. 아 ! 그리고 simplejwt토큰을 사용중 입니다!

  • docker
  • django
  • python
  • react
꺼넝 댓글 1 좋아요 0 조회수 714

안녕하세요. 다른 풀이도 풀었는데 괜찮을까요?

미해결

파이썬 알고리즘 문제풀이 입문(코딩테스트 대비)

정답은 제대로 나오긴 했는데 시간 초과라던가 하는 문제가 없을까요? 4중 for문은 생각지도 못했네요..ㅠㅠ sudoku = [list(map(int, input().split())) for _ in range(9)] def solution(sudoku): length = len(sudoku) a, b, c, = list(), list(), list() # 행열 검사 for i in range(length): row, col = list(), list() for j in range(length): row.append(sudoku[i][j]) col.append(sudoku[j][i]) if len(set(row)) != 9 or len(set(col)) != 9: return "NO" # 3x3 격자판 검사 a.extend(row[0:3]) b.extend(row[3:6]) c.extend(row[6:]) if i == 2 or i == 5 or i == 8: if len(set(a)) != 9 or len(set(b)) != 9 or len(set(c)) != 9: return "NO" a, b, c, = list(), list(), list() return "YES" print(solution(sudoku))

  • python
  • 코딩-테스트
  • 코테 준비 같이 해요!
HTCho1 댓글 1 좋아요 0 조회수 461

1068번: 트리

미해결

파이썬 알고리즘 문제풀이 입문(코딩테스트 대비)

제가 다음과 같이 코드를 작성했는데, 100%까지 가다가 틀립니다.. 어떤게 문제일까요? 반례를 제시해주실 수 있나요? 감사합니다. https://www.acmicpc.net/problem/1068 import sys input = sys.stdin.readline n = int(input()) g = list(map(int, input().split())) m = int(input()) cnt = 0 def DFS(x): g[x] = -1 for i in range(n): if g[i] == x: DFS(i) DFS(m) for i in range(n): if g[i] != -1 and i not in g: cnt += 1 print(cnt)

  • python
  • 코딩-테스트
  • 코테 준비 같이 해요!
이도열 댓글 1 좋아요 1 조회수 376

암호화/인증 & 인가 과제 중 질문

해결됨

[코드캠프] 부트캠프에서 만든 고농축 백엔드 코스

updateUserPwd 구현 중에, 파라미터로 업데이트할 패스워드를 받도록 했습니다. 이 때, API 호출 시, 해당 파라미터의 최소 길이를 8 이상으로 하고 싶은데 따로 방법이 있을까요?

  • node.js
  • tdd
  • rest-api
  • javascript
  • express
  • docker
  • nodejs
  • nestjs
  • NestJS
ZZAMBA 댓글 1 좋아요 0 조회수 426

안녕하세요 리뷰복습하다가, 발견했습니다

미해결

파이썬 알고리즘 문제풀이 입문(코딩테스트 대비)

최근에 다시 자바스크립트로 돌리면서, 기존에 파이썬으로 했던 것들 다시 모두 자바스크립트로 풀어보면서 문제 풀어보니, 발견했습니다. 이거 첫번째 가정을, 그리디로 접근하면 해결 안되는 문제인것같습니다. 이후 가정들은 당연히 그리디 관념으로 최적값 찾을 수 있는데, 첫번째 가정부터 그리디로 접근하면 해결되는 문제가 아니라서 어긋나기때문에, 그리디관념이 통하지 않는 문제인것같습니다. 완전탐색해버리거나, 시간 더 줄이려면 백트래킹 가지치기 해야하는 문제인것같습니다. 입력입니다! 7 172 67 183 65 179 61 178 62 177 63 170 72 181 60 기존 풀이(무조건 183선발) 가 내주는 답 : 3 감독 현수가 원할 것 같은 답 : 6 그리디로 가장 키 큰 사람 무조건 선발하는 과정이 풀이에서 오류인것같습니다. 183 선발 가정하고 cnt 값 구하고, 그다음 181 선발 가정하고 cnt값 구하고, 쭉 다음 순으로 선발 가정하고 cnt값 구하는데, 만약 어떤 사람 선발 가정하고 cnt값 구하는데 남은 사람 수 다 합해도 기존 Max cnt보다 적을 경우, 백트레킹 가지치기로 break 혹은 return 끊어버리는게 맞는것같습니다. 풀이1. 이중포문 const input = require("fs") .readFileSync("input.txt") .toString() .trim() .split("\n"); const n = parseInt(input[0]); const arr = Array.from(Array(5), () => []); for (let i = 0; i < n; i++) { arr[i] = Array.from(input[i + 1].trim().split(" ")).map((v) => parseInt(v)); } function solution(n, arr) { arr.sort((a, b) => b[0] - a[0]); let cnt = 0; let largest = 0; let res = 0; for (let i = 0; i < n; i++) { largest = arr[i][1]; cnt += 1; if (res >= n - i) { break; } for (let j = i + 1; j < n; j++) { if (arr[j][1] > largest) { largest = arr[j][1]; cnt += 1; } } res = Math.max(res, cnt); cnt = 0; } console.log(res); } solution(n, arr); 풀이2. DFS const input = require("fs") .readFileSync("input.txt") .toString() .trim() .split("\n"); const n = parseInt(input[0]); const arr = Array.from(Array(5), () => []); for (let i = 0; i < n; i++) { arr[i] = Array.from(input[i + 1].trim().split(" ")).map((v) => parseInt(v)); } let cnt = 0; let res = 0; //const list = []; function DFS(s, weight) { if (s < 0) return; if (cnt + n - s <= res) { cnt -= 1; s -= 1; return; } for (let i = s; i < n; i++) { if (arr[i][1] > weight) { cnt += 1; //list.push(arr[i][1]); DFS(i + 1, arr[i][1]); //list.pop(); } } res = Math.max(res, cnt); //console.log(list); cnt -= 1; } function solution(n, arr) { arr.sort((a, b) => b[0] - a[0]); DFS(0, 0); console.log(res); } solution(n, arr);

  • python
  • 코딩-테스트
  • 코테 준비 같이 해요!
ncprog1 댓글 2 좋아요 1 조회수 455

액세스토큰을 변수로 저장하면 생기는 문제점

해결됨

[코드캠프] 부트캠프에서 만든 고농축 백엔드 코스

안녕하세요. 강의중에 액세스토큰을 변수로 req.header에 저장하면 아래와 같이 3가지 문제점이 있다는 것을 구글링을 통해서 확인했습니다. 1.보안: 액세스토큰을 req.header에 변수로서의 토큰은 공격자에 의해 가로채기에 취약합니다. 2.확장성: 애플리케이션에 많은 수의 요청이 있는 경우 req.header 의 변수는 크기가 커지고 성능 문제가 발생할 수 있습니다. 3.지속성: req.header 에 액세스 토큰을 저장하는 것은 영구적이지 않습니다. 사용자가 페이지를 새로 고치거나 브라우저를 닫으면 액세스 토큰이 손실됩니다. 이로 인해 사용자가 보호된 리소스 에 액세스하기 위해 다시 로그인해야 할 수 있습니다. 질문1) 3번 지속성문제의 경우, 브라우저를 새로고침하게 되면, 액세스 토큰이 사라지게 되니 오히려 보안이 좋다고 생각해야 할까요? accessToken이 수업에서는 10분으 로 만료기간을 설정했는데, restoreAccessToken API가 있기 때문에 acessToken을 req.header에 변수로 저장해도 문제가 되지 않을까요? 질문2) 액세스토큰 만료시간을 10분 ~30분 으로 짧게 잡으신 이유가 1번 문제점 보안의 이유라고 생각하면 될까요? 질문3) 선생님, 좋은 강의 해주셔서 진심으로 감사합니다. 저는 선생님의 백엔드와 프론트 강의를 수강후 실제 웹 서비스를 런칭하기위해서 수업을 듣고 있습니다. 현재는 백엔드 강의를 수강중입니다. 실제 웹 서비스런칭시 accessToken을 req.header에 변수로서 저장하고, refreshToken은 쿠키에 저장하는 게 올바른 방법인가요? refreshToken을 수업에서 가르쳐주신 대로 secure : true, httponly: true와 같이 배포환경으로 바꿔서 배포하게 된다면 보안상 안전할까요? 질문4) 구글링을 해보니, 리프레시 토큰을 Redis에 저장하고, 액세스토큰은 쿠키에 저장하는 방법도 있는 것을 확인했습니다. 액세스토큰의 만료기간을 10분으로 잡고, 리프레시토큰의 만료기간을 2주로 잡을 경우, restoreRefreshToken API 때문에 Redis DB에 자주 접속하게 되어서 DB 사용료가 많이 청구 되지는 않을까요? 서버를 stateless 상태로 웹 서비스를 런칭하기 위해서는 액세스토큰과 리프레시 토큰을 어떻게 저장해야 할까요? 가장 안전한 방법이라고 할 수 있을까요? 감사합니다.

  • node.js
  • NestJS
  • express
  • docker
  • rest-api
  • rest-api
  • nodejs
  • javascript
  • nestjs
  • tdd
LI 댓글 1 좋아요 0 조회수 868

User 의 List<Post> posts 컬렉션 조회시

미해결

[개정판 2023-11-27] Spring Boot 3.x 를 이용한 RESTful Web Services 개발

안녕하세요. JPA 로 Post 를 등록하고 User 의 List<Post> posts 컬렉션 정보를 조회할때 질문드립니다. post 등록시 User 의 List<Post> posts 컬렉션에 따로 post 를 넣지 않았는데 조회할 경우에 post 정보가 나오게되는 이유가 궁금합니다.... post가 User 컬렉션에 자동적으로 저장되는 것인가요?

  • rest-api
  • spring-boot
cocoguy 댓글 1 좋아요 0 조회수 388

로드맵상 다음강의? 크롤링? 퀀트1?

해결됨

문과생도, 비전공자도, 누구나 배울 수 있는 파이썬(Python)!

안녕하세요.. 멋지고 깔끔한 강의 덕분에 2주만에 완강했습니다! 좋은 강의 준비해주셔서 감사합니다. 로드맵상 다음강의가 퀀트part1 으로 되어 있는데, 크롤링을 모르고 가도 상관이 없을까요? 아니면 크롤링 강의 먼저 듣고 가는게 나을까요?

  • python
wk 댓글 1 좋아요 0 조회수 272

GqlExecutionContext가 없다고 나옵니다.

해결됨

[코드캠프] 부트캠프에서 만든 고농축 백엔드 코스

import { GqlExecutionContext } from '@nestjs/graphql'; @nestjs/graphql 모둘에 내보낸 맴버 GqlExecutionContext가 없다고 에러가 뜹니다

  • node.js
  • nodejs
  • tdd
  • docker
  • rest-api
  • express
  • javascript
  • nestjs
  • NestJS
Han Lee 댓글 1 좋아요 0 조회수 303

JWT 토큰이 어디 저장되어 있는 건가요?

해결됨

[코드캠프] 부트캠프에서 만든 고농축 백엔드 코스

인증을 하면 JWT 액세스 토큰을 전달 받고, fetchUser의 header에 전달 받은 토큰을 넘겨 인가를 받는다는 것을 알았습니다. 이 때, JWT 토큰에 대해 서버가 알고 있어야 하는데 이것이 어디에 저장되어 있는 건가요?

  • node.js
  • NestJS
  • tdd
  • rest-api
  • nodejs
  • javascript
  • docker
  • nestjs
  • express
ZZAMBA 댓글 1 좋아요 0 조회수 643

@Size(min, max) 검증 관련 질문

미해결

[개정판 2023-11-27] Spring Boot 3.x 를 이용한 RESTful Web Services 개발

안녕하세요. User 테이블에 데이터를 삽입하다 검증 애노테이션이 적용이 안되서 질문드립니다. 동일한 질문이 있어서 Javax.validation 의존성 삭제하고 springboot.starter validation 을 적용했지만 계속 검증이 안되는 상황입니다. @Size(min=2, max=4) private String name; 이름 필드에 제한을 두었는데 max 테스트는 에러를 내보내지만 min 을 테스트했을때 한글자 문자를 넣었을 때 왜 에러가 발생되지 않는지 궁금합니다..

  • rest-api
  • spring-boot
  • rest-api
  • spring-boot
cocoguy 댓글 1 좋아요 0 조회수 868

jsconfig 오류 질문입니다!

해결됨

파이썬/장고 웹서비스 개발 완벽 가이드 with 리액트

{ "compilerOptions": { "baseUrl": "src" }, "include": ["src"] } keonhongkoo@keonhongui-MacBookAir frontend % yarn start yarn run v1.22.19 $ react-scripts start node:internal/modules/cjs/loader:1325 throw err; ^ SyntaxError: /Users/keonhongkoo/Desktop/instagram/frontend/jsconfig.json: Unexpected token / in JSON at position 75 at parse (<anonymous>) at Module._extensions..json (node:internal/modules/cjs/loader:1322:39) at Module.load (node:internal/modules/cjs/loader:1117:32) at Module._load (node:internal/modules/cjs/loader:958:12) at Module.require (node:internal/modules/cjs/loader:1141:19) at require (node:internal/modules/cjs/helpers:110:18) at getModules (/Users/keonhongkoo/Desktop/instagram/frontend/node_modules/react-scripts/config/modules.js:126:14) at Object.<anonymous> (/Users/keonhongkoo/Desktop/instagram/frontend/node_modules/react-scripts/config/modules.js:142:18) at Module._compile (node:internal/modules/cjs/loader:1254:14) at Module._extensions..js (node:internal/modules/cjs/loader:1308:10) Node.js v18.14.1 error Command failed with exit code 1. info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command. 이렇게 결과가 출력되는데 해결책이 안보이네요... vscode도 재시작해봤습니다ㅠ

  • docker
  • python
  • react
  • django
꺼넝 댓글 1 좋아요 0 조회수 809

강의별 전체 코드 git으로 받아볼 수 있을까요?

해결됨

[코드캠프] 부트캠프에서 만든 고농축 백엔드 코스

안녕하세요 선생님께서 강의하시는 강의별 전체 코드를 받아볼 수 있는 git 주소가 있을까요? 전체 정답 코드를 보지 못하고 따라하다보니 에러가 많이 나서 선생님 것으로 확인해보고자 합니다. 그럼 답변 기다리겠습니다. 감사합니다.

  • node.js
  • nodejs
  • tdd
  • docker
  • express
  • javascript
  • nestjs
  • rest-api
  • NestJS
LI 댓글 1 좋아요 1 조회수 363

질문드립니다.

미해결

남박사의 파이썬 기초부터 실전 100% 활용

사용자 입력 예외처리를 하고 있는데, 1)문자 입력 시 오류 2)3자리 숫자가 아닐 경우 오류 다음과 같이 코드를 짰는데 1)의 경우 except 부분에서 "입력 오류"를 출력하지만 2)의 경우 "입력오류"가 출력되지 않고 그냥 재입력하게 되네요. 혹시 이유를 알 수 있나요? 또한 문자 입력 시 "숫자만 입력 가능합니다"를 출력 두자리수 입력 시 "세 자리 수를 입력하세요"를 출력 하도록 하려면 코드를 어떻게 수정해야 할까요? 감사합니다.! #세 자리 숫자만 입력할 수 있게 하는 함수 def input_check(msg, casting = int): while True: try: num = input(msg) # 사용자 입력 num_str = str(num) #맨 앞의 수가 0일경우 0이 잘려버리기 때문에 str을 따로 저장 if(casting(num) and len(num) == 3): return num_str except: print("입력 오류") continue

  • 웹-크롤링
  • 웹-크롤링
  • python
Poki 댓글 2 좋아요 1 조회수 404

맛집 클릭시 상세조회 부분에서 오류가 생겨요ㅜㅜ

미해결

비전공자를 위한 풀스택 맛집지도 만들기 프로젝트!: Front, Back-end 그리고 배포까지

return에서 기존 hello 문구를 지우고 엔터를 치면 여기서 부터 오류가 떠요 그리고 이렇게html에서 js로 옮기는 과정에서 오류가 뜨는데 어떻게 해야되나요?

  • html/css
  • HTML/CSS
  • github
  • git
  • javascript
  • mysql
  • rest-api
  • rest-api
  • aws
박선희 댓글 2 좋아요 0 조회수 348

메인페이지 헤더 회원/비회원 표시

미해결

비전공자를 위한 풀스택 맛집지도 만들기 프로젝트!: Front, Back-end 그리고 배포까지

로그인이나 회원가입 후 메인페이지 헤더 부분에 비회원과 회원 구분하는 바가 나오지 않습니다. header.js코드는 그대로 복붙하고 url 에서 포트만 3001 -> 3000 으로 바꿨습니다 back end의 indexRoute에서 아래 app.get("/jwt", jwtMiddleware, index.readJwt); 코드도 잘 추가하였는데 문제가 어떤건지 모르겠습니다 ㅠㅠ

  • html/css
  • mysql
  • git
  • rest-api
  • javascript
  • aws
  • HTML/CSS
  • github
리리릴 댓글 1 좋아요 0 조회수 720

아나콘다 버전 관련 문의 드립니다~!

미해결

파이썬/장고 웹서비스 개발 완벽 가이드 with 리액트

안녕하세요~! 아나콘다를 설치하면서 두가지 정도 질문이 있습니다 1) 2023.02.22날짜로 아나콘다 최신판을 설치하는데 그림과 같이 옵션사항에 환경변수 체크가 되지 않습니다 ㅠㅠ 업데이트 되면서 바뀐것인지 아나콘다 최신판에서 이 옵션을 선택하지 않아도 괜찮을까요?? 2) 2023.02.22날짜로 아나콘다 최신판에서는 파이썬 버전이 3.9버전인데 파이썬 공식버전으로는 3.11까지 배포가 되었습니다 버전 차이가 많이 나도 아나콘다를 설치하는게 사용에 더 편리할까요??

  • python
  • django
  • docker
  • react
서성길 댓글 3 좋아요 0 조회수 1297

swagger 3 질문입니다.(Step 24)

미해결

[개정판 2023-11-27] Spring Boot 3.x 를 이용한 RESTful Web Services 개발

안녕하세요 springboot 3에서는 swagger 2를 이용할 수 없더라구요. ( 추가로 강의자료에서 제공해주신 springfox3 버전을 이용해도 index.html에 접속이 되질 않아 springdoc으로 진행하는 상황입니다.) 그래서 springdoc, swagger3를 사용하여 http://localhost:8088/swagger-ui/index.html로 들어가 실습을 진행하고 있습니다. 강의자료를 참고하여 springfox형식을 springdoc에 맞춰 작성하여 info, contact,license 까지 확인할 수 있었습니다. 그런데 produce,consume 부분을 구현하지 못했는데 springdoc에서는 produce,consume이 없어진건가요? 아니면 다른 방법이 있을까요? 강의자료는 springfox 기준이라서 아직 produce, consume 부분을 해결하지 못한 상태입니다. package com.example.restfulwebservice.config; import io.swagger.v3.oas.models.OpenAPI; import io.swagger.v3.oas.models.info.Contact; import io.swagger.v3.oas.models.info.Info; import io.swagger.v3.oas.models.info.License; import org.springframework.context.annotation.Bean; import org.springframework.context.annotation.Configuration; import org.springframework.web.servlet.mvc.condition.ProducesRequestCondition; import java.util.Arrays; import java.util.HashSet; import java.util.Set; @Configuration public class SwaggerConfig { private static final Contact CONTACT = new Contact().name("Kenneth Lee") .url("http://www.joneculsting.co.kr") .email("edowon@joneconsluting.co.kr"); private static final License LICENSE= new License().name("Apache 2.0") .url("http://www.apache.org/licenses/LICENSE-2.0"); private static final Info INFO = new Info().title("Awesome API Title") .contact(CONTACT) .description("Awesome API Documentation") .version("1.0") .license(LICENSE) .termsOfService("urn:tos"); private static final Set<String> DEFAULT_PRODUCES_AND_CONSUMES = new HashSet<>(Arrays.asList("application/json", "application/xml")); @Bean public OpenAPI springShopOpenAPI() { return new OpenAPI().info(INFO).; } }

  • rest-api
  • spring-boot
  • rest-api
  • spring-boot
김관주 댓글 0 좋아요 0 조회수 715

HelloMessage.Message 프로퍼티 여부에 따른 다른 동작

해결됨

[C#과 유니티로 만드는 MMORPG 게임 개발 시리즈] Part6: 웹 서버

선생님 안녕하세요! 최신 버전의 VS2022 .NET7.0 환경에서도 실습이 잘 되어서 너무 기분이 좋습니다. c# 문법인지 잘 모르겠지만... 이해가 안 가는 것이 있어 질문 올립니다. ' Hello MVC #1 ' 강의 14:29에서 다음과 같이 작성하셨습니다. public string Message { get; set; } 하지만, { get; set; } 을 하지 않고 아래와 같이 작성 public string Message; 하면 앞으로 모든 실습에서 Message가 null이 됩니다. 디버그에서 특별한 에러도 나타나지 않습니다. 강의 내용대로 프로퍼티를 붙이면 간단히 해결할 수 있지만 이 차이가 무엇인지 자세히 알고 싶습니다. 프로퍼티를 사용한 경우 프로퍼티 없이 선언만 한 경우

  • rest-api
  • blazor
  • web-api
  • ASP.NET-Core
  • asp.net-core
  • rest-api
Bonnate 댓글 1 좋아요 0 조회수 513

인기 태그

인프런 TOP Writers

주간 인기글