묻고 답해요
160만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
-
해결됨[개정3판] Node.js 교과서 - 기본부터 프로젝트 실습까지
key값에 영어가 아닌 디른문자가 들어가면 오류 발생
사진 파일 이름이 띄어쓰기가 없는 영어가 아닌 경우 무조건 Key를 찾을 수 없다는 오류가 발생합니다.그런데 왜 도무지 이런 에러가 발생하는지 이해가 되지 않습니다.s3 original폴더에 잘 저장되어있고 그냥 똑같은 key를 찾으면 되는거 아닌가요?... 왜 영어로 안쓰면 key를 못찾는건지 잘 모르겠습니다..그리고 저번에 띄어쓰기도 식별하기 위해 +를 스페이스로 replace하는 코드를 추가하면 됩니다. 라고 말씀해주셨는데 aws-upload의 index.js 코드에는 그냥 온전히 s3에 저장되어있는 key값을 받아오고 그 키값에서 파일 이름이나 확장자를 추출하는 코드밖에 존재하지 않는데 어디에 + 스페이스로 replace하는 코드를 추가하면 되는지 잘 이해가 되지 않습니다... 답변해주시면 정말 감사하겠습니다..ㅠㅠ
-
해결됨[개정3판] Node.js 교과서 - 기본부터 프로젝트 실습까지
이미지 리사이징 후 화질
궁금한점이 생겨 질문합니다. aws lambda로 resizing된 이미지를 사용자에게 보여주면 당연히 화질이 좋지 않은 이미지를 제공할 수 밖에 없는데 이건 어쩔 수 없는건가요? 그럼 구글이나 핀터레스트같은 이미지를 많이 활용하는 웹들은 당연히 이미지 용량 크기를 줄이는 작업을 거칠것인데 이 웹들은 어떻게 사용자에게 좋은 이미지를 보여줄 수 있는건가요?
-
미해결[개정3판] Node.js 교과서 - 기본부터 프로젝트 실습까지
no such key
{ "errorType": "NoSuchKey", "errorMessage": "The specified key does not exist.", "name": "NoSuchKey", "$fault": "client", "$metadata": { "httpStatusCode": 404, "requestId": "YMG06ZYH60K2201P", "extendedRequestId": "3P/v2TuxF22TpEWbU9iXPei37RoBJHIeVTI/mSC9NV7bY2r4BnC2iyJpCcJnmD3gUEaa9WdsNCw=", "attempts": 1, "totalRetryDelay": 0 }, "Code": "NoSuchKey", "Key": "original/1703707251649_studying+economics+student+aesthetic+bib+uni+college+statistics+math+macbook+apple+ipad+pro+jgu+mainz.jpeg", "RequestId": "YMG06ZYH60K2201P", "HostId": "3P/v2TuxF22TpEWbU9iXPei37RoBJHIeVTI/mSC9NV7bY2r4BnC2iyJpCcJnmD3gUEaa9WdsNCw=", "message": "The specified key does not exist.", "stack": [ "NoSuchKey: The specified key does not exist.", " at de_NoSuchKeyRes (/var/task/node_modules/@aws-sdk/client-s3/dist-cjs/protocols/Aws_restXml.js:5196:23)", " at de_GetObjectCommandError (/var/task/node_modules/@aws-sdk/client-s3/dist-cjs/protocols/Aws_restXml.js:3440:25)", " at process.processTicksAndRejections (node:internal/process/task_queues:95:5)", " at async /var/task/node_modules/@smithy/middleware-serde/dist-cjs/deserializerMiddleware.js:7:24", " at async /var/task/node_modules/@aws-sdk/middleware-signing/dist-cjs/awsAuthMiddleware.js:30:20", " at async /var/task/node_modules/@smithy/middleware-retry/dist-cjs/retryMiddleware.js:31:46", " at async /var/task/node_modules/@aws-sdk/middleware-flexible-checksums/dist-cjs/flexibleChecksumsMiddleware.js:63:20", " at async /var/task/node_modules/@aws-sdk/middleware-sdk-s3/dist-cjs/region-redirect-endpoint-middleware.js:14:24", " at async /var/task/node_modules/@aws-sdk/middleware-sdk-s3/dist-cjs/region-redirect-middleware.js:9:20", " at async /var/task/node_modules/@aws-sdk/middleware-logger/dist-cjs/loggerMiddleware.js:7:26" ] }이렇게 NoSuckKey라고 뜨는데 이건 혹시 s3 access key가 틀렸다는 소리인가요?
-
해결됨Spring Boot JWT Tutorial
postman에서 오류가 납니다..
이전까지는 모든게 다 되는데 postman test에 전역 변수를 잡고 Authorization에 {{jwt_tutorial_token}}을 넣어서 send 해봐도 Something went wrong while running your scripts. Check Postman Console for more info 라는 작은 팝업창만 뜰 뿐, 아무런 반응이 없습니다...모든 코드와 postman에도 모두 동일하게 작성을 했는데, 왜 이런 오류가 발생하는지 알 수 있을까요..?ㅜㅜ
-
미해결코드로 배우는 React 19 with 스프링부트 API서버
삭제 쿼리 질문드립니다.
삭제 테스트중 의문점이 하나 있어서 질문드립니다 삭제를 위한 검색쿼리Hibernate: select c1_0.cno from tbl_cart c1_0 left join tbl_cart_item c2_0 on c2_0.cart_cno=c1_0.cno where c2_0.cino=?작성하지 않았는데 발생하는 쿼리Hibernate: select c1_0.cino, c2_0.cno, o1_0.email, o1_0.nickname, o1_0.pw, o1_0.social, p1_0.pno, p1_0.del_flag, p1_0.pdesc, p1_0.pname, p1_0.price, c1_0.qty from tbl_cart_item c1_0 left join tbl_cart c2_0 on c2_0.cno=c1_0.cart_cno left join member o1_0 on o1_0.email=c2_0.member_owner left join tbl_product p1_0 on p1_0.pno=c1_0.product_pno where c1_0.cino=? 삭제쿼리Hibernate: delete from tbl_cart_item where cino=?삭제후 아이템 재검색쿼리Hibernate: select c1_0.cino, c1_0.qty, p1_0.pname, p1_0.price, i1_0.file_name from tbl_cart_item c1_0 join tbl_cart c2_0 on c1_0.cart_cno=c2_0.cno left join tbl_product p1_0 on c1_0.product_pno=p1_0.pno left join product_image_list i1_0 on p1_0.pno=i1_0.product_pno where i1_0.ord=0 and c2_0.cno=? 삭제 쿼리시 위와같은 쿼리들이 실행되는데요 삭제를 위한 검색쿼리후 알수없는 쿼리하나가 더 실행되는데 이쿼리가 실행되는 이유를 알고 싶습니다.
-
미해결스프링부트 시큐리티 & JWT 강의
JWT - 24강 authenticationManager() 문제
jwt버전 문제로 안되는 것같아요..
-
미해결스프링부트 시큐리티 & JWT 강의
authenticaiotnMaanger()안됨
버전차이로 오류가 뜬것같습니다!..
-
미해결코드로 배우는 React 19 with 스프링부트 API서버
토큰쿠키저장에 대해서 질문드립니다.
강의에서 토큰을 보관하기에 보안에도 좋고 적절한 곳이 쿠키라고 말씀해주셨는데 보통 쿠키에 저장을 많이 하는편일까요?내년 하반기에 크롬에서 쿠키차단예정을 하고 있다고 들어서 왠지 다른 대체제가 필요할거같은데 쿠키를 사용 못하게 된다면 보통 클라이언트에서는 로컬스토리지 이외에는 대체제가 없는지 궁금합니다.
-
미해결코드로 배우는 React 19 with 스프링부트 API서버
Product게시판 이미지에 대해서
토큰적용 후 발생하는 현상에 대해서 질문드립니다.Product게시판에 이미지에 경우, 아래와 같이 표시가되는데요 이때 토큰을 헤더에 설정 되어있지않기떄문에 {"error":"ERROR_ACCESS_TOKEN"}가 발생합니다.jwtAxios를 사용하여 처리는 가능할듯한데 문제는 결과값이 문자열로 되돌아와서 이미지표시가 좀 힘들어보이고 어떻게 처리해야할지 모르겠습니다.이런경우 어떠한방식으로 처리하는게 좋을까요?src={`${host}/api/products/view/s_${product.uploadedFileNames[0]}`}
-
미해결코드로 배우는 React 19 with 스프링부트 API서버
강의 순서 및 누락 건 확인
안녕하세요 강의 진행 중에[로그인 적용 확인] -> [로그아웃 처리] 를 보다 보니 중간에 쿠키 설정이 다되어 있어서뭔가 순서가 뒤바뀐 건가요...
-
미해결코드로 배우는 React 19 with 스프링부트 API서버
로그인 적용확인 회차에대해서
위에 내용하고 겹치는듯한데 맞나요?... 로그인 적용확인 회차부터해서 뭔가 내용이 이어지질 않는듯한 느낌이듭니다....
-
해결됨스프링부트 시큐리티 & JWT 강의
3강에서 로그인폼 작성후 실행하면 작성한 입력폼이 안 뜹니다.
안녕하세요 강의 듣고 있는 수강생입니다.좋은 강의 가르쳐주셔서 감사합니다.제가 따라 가다가 막힌 부분이 있어서 질문 남깁니다.3강에서 login - > loginForm 으로 리턴해주고 loginForm을 작성한 후 테스트 할 때loginForm에 작성한 로그인 입력폼이 뜨지 않고loginForm 문자 그 자체만을 반환하고 있습니다.오류도 뜨지 않아서 maven 업데이트나 프로젝트 클린 후 실행해봐도 똑같은데 무엇때문인지 알 수 있을까요 ??
-
해결됨코드로 배우는 React 19 with 스프링부트 API서버
강의 영상에 혹시 빠진게 있나요??
조금 전 있던 질문글 이랑 동일한 에러가 발생해서 코드 확인했더니 TodoController 클래스에서 put, delete를 구현하지 않았더라구요. 제가 뭔가 빼먹었나보다 하고 소스코드 찾아보니까 소스코드에는 있길래 소스코드 참고해서 해결했거든요. 그런데 그 다음에도 RootConfig 클래스를 만드는거나, CustomServletConfig 클래스에 addCorsMappings 메서드를 추가하는 과정을 소스코드 보면서 해결했었는데, 혹시 강의 영상에는 소스코드에 있는 내용 전부가 작성되는 과정이 나오는건 아닌걸까요? 제가 영상보다 코드치다 하면서 실수로 넘어간 부분이 있을수도 있는데, 강의 영상에는 빠져있고, 소스코드는 올라와 있는 부분들이 있는것 같아서요. 한번 확인 부탁드려도 될까요..? 제 착오였다면 죄송합니다 ㅠㅠ
-
해결됨[개정3판] Node.js 교과서 - 기본부터 프로젝트 실습까지
passport.authenticate is not a function 도와주세요..
passport.authenticate is not a functionTypeError: passport.authenticate is not a function at exports.login (/home/node/app/controllers/auth.js:26:14) at Layer.handle [as handle_request] (/home/node/app/node_modules/express/lib/router/layer.js:95:5) at next (/home/node/app/node_modules/express/lib/router/route.js:144:13) at exports.isNotLoggedIn (/home/node/app/middlewares/index.js:15:9) at Layer.handle [as handle_request] (/home/node/app/node_modules/express/lib/router/layer.js:95:5) at next (/home/node/app/node_modules/express/lib/router/route.js:144:13) at Route.dispatch (/home/node/app/node_modules/express/lib/router/route.js:114:3) at Layer.handle [as handle_request] (/home/node/app/node_modules/express/lib/router/layer.js:95:5) at /home/node/app/node_modules/express/lib/router/index.js:284:15 at Function.process_params (/home/node/app/node_modules/express/lib/router/index.js:346:12) POST /auth/login 500 34.609 ms - 2536GET /main.css 304 2.895 ms - -현재 로그인을 눌렀을 때 이 오류가 생깁니다.해결방법을 모르겠습니다..localStrategy.jsconst passport = require('passport'); const {Strategy: localStrategy} = require('passport-local'); const User = require('../models/user'); const bcrypt = require('bcrypt'); module.exports = () => { passport.use(new localStrategy({ usernameField: 'email', passwordField: 'password', passReqToCallback: 'false' }, async (email, password, done) => { try { const exUser = await User.findOne({ where: {email}}); if (exUser) { const result = await bcrypt.compare(passport, exUser.passport); if(result) { done(null, exUser); } else { done(null, false, {message: '비밀번호가 일치하지 않습니다.'}); } } else { done(null, false, {message: '가입되지 않은 회원입니다.'}); } } catch(error) { console.error(error); done(error); } })); }; controllers/auth.jsconst User = require("../models/user"); const bcrypt = require('bcrypt'); const passport = require("../passport"); exports.join = async (req, res, next) => { const {nick, email, password} = req.body; try { const exUser = await User.findOne({ where: {email}}); if (exUser) { return res.redirect('/join?error=exist'); } const hash = await bcrypt.hash(password, 12); await User.create({ email, nick, password: hash, }); return res.redirect('/'); } catch (error) { console.error(error); next(error); } } //POST /auth/login exports.login = (req, res, next) => { passport.authenticate('local', (authError, user, info) => { if (authError) { console.error(authError); return next(authError); } if (!user) { return res.redirect(`/?loginError=${info.message}`); } return req.login(user, (loginError) => { if (loginError) { console.error(loginError); return next(loginError); } return res.redirect('/'); }); })(req, res, next); }; exports.logout = (req, res, next) => { req.logout(() => { res.redirect('/'); }) } app.jsconst express = require('express'); const cookieParser = require('cookie-parser'); const morgan = require('morgan'); const path = require('path'); const session = require('express-session'); const nunjucks = require('nunjucks'); const dotenv = require('dotenv'); const passport = require('passport'); dotenv.config(); // process.env const pageRouter = require('./routes/page'); const authRouter = require('./routes/auth'); const { sequelize } = require('./models'); const passportConfig = require('./passport'); const app = express(); passportConfig(); app.set('port', process.env.PORT || 8080); app.set('view engine', 'html'); nunjucks.configure('views', { express: app, watch: true, }); sequelize.sync({ force: false }) .then(() => { console.log('데이터베이스 연결 성공'); }) .catch((err) => { console.error(err); }); app.use(morgan('dev')); app.use(express.static(path.join(__dirname, 'public'))); app.use(express.json()); app.use(express.urlencoded({ extended: false })); app.use(cookieParser(process.env.COOKIE_SECRET)); app.use(session({ resave: false, saveUninitialized: false, secret: process.env.COOKIE_SECRET, cookie: { httpOnly: true, secure: false, }, })); app.use(passport.initialize()); app.use(passport.session()); app.use('/', pageRouter); app.use('/auth', authRouter); app.use((req, res, next) => { const error = new Error(`${req.method} ${req.url} 라우터가 없습니다.`); error.status = 404; next(error); }); app.use((err, req, res, next) => { res.locals.message = err.message; res.locals.error = process.env.NODE_ENV !== 'production' ? err : {}; res.status(err.status || 500); res.render('error'); }); app.listen(app.get('port'), () => { console.log(app.get('port'), '번 포트에서 대기중'); });
-
미해결코드로 배우는 React 19 with 스프링부트 API서버
cors 설정에도 불구하고 405 에러 스프링부트 3.16
안녕하세요 영상강의를 보며 클론 코딩하면서 하나씩 배우고 있는데백단에서 Cors 설정을 해주었음에도 불구하고 (강의 섹션 3 수정/삭제 처리 진행 중 )@Overridepublic void addCorsMappings(CorsRegistry registry) {registry.addMapping("/**").allowedOrigins("*").allowedMethods("HEAD", "GET", "POST", "PUT", "DELETE", "OPTIONS").maxAge(300).allowedHeaders("Authorization", "Cache-Control", "Content-Type");}여전히 호출 불가 상태로 있는데 원인을 모르겠습니다. 혹시나 몰라 todoApi.js 파일을 제공된 소스파일로 엎어쳐서 진행을 했는데도 불구하고 말이죠..
-
미해결코드로 배우는 React 19 with 스프링부트 API서버
연관관계 맵핑에 대해서 질문드립니다.
@ElementCollection와 @EntityGraph사용법에 대해서 잘 숙지 하였습니다. 한가지 질문이 있습니다. JPA사용시 일반적으로 쓰이는 @OneToMany, @ManyToOne, @ManyToMany를 대신해서 @ElementCollection으로대체하여 사용이 가능할까요?왠지 될거같은생각이 들긴하는데....
-
미해결코드로 배우는 React 19 with 스프링부트 API서버
모달이 뜨질않습니다....
모달이 작동하지않아서 혹시 몰라서 카페에 올라와있는 소스코드를 덮어씌어도 모달이 뜨질않습니다.. 분명 데이터는 등록되는데 result값도 제대로 들어오는데도 불구하고 뜨질않더라구요.. 아래코드는 카페에 올라와있는 코드를 제 프로젝트에 인식시켜본 코드입니다. import React, {useState} from 'react'; import ResultModal from "../common/ResultModal"; import {postAdd} from "../../api/todoApi"; import userCustomMove from "../../hooks/userCustomMove"; const initState = { title:'', content: '', dueDate: '' } const AddComponent = () => { const [todo, setTodo] = useState({...initState}) const [result, setResult] = useState(null) //결과 상태 const {moveToList} = userCustomMove() //useCustomMove 활용 const handleChangeTodo = (e) => { todo[e.target.name] = e.target.value setTodo({...todo}) } const handleClickAdd = () => { //console.log(todo) postAdd(todo) .then(result => { console.log(result) setResult(result.TNO) //결과 데이터 변경 setTodo({...initState}) }).catch(e => { console.error(e) }) } const closeModal = () => { setResult(null) moveToList() //moveToList( )호출 } return ( <div className = "border-2 border-sky-200 mt-10 m-2 p-4"> {/* 모달 처리 */} {result ? <ResultModal title={'Add Result'} content={`New ${result} Added`} callbackFn={closeModal}/>: <></>} <div className="flex justify-center"> <div className="relative mb-4 flex w-full flex-wrap items-stretch"> <div className="w-1/5 p-6 text-right font-bold">TITLE</div> <input className="w-4/5 p-6 rounded-r border border-solid border-neutral-500 shadow-md" name="title" type={'text'} value={todo.title} onChange={handleChangeTodo} > </input> </div> </div> <div className="flex justify-center"> <div className="relative mb-4 flex w-full flex-wrap items-stretch"> <div className="w-1/5 p-6 text-right font-bold">CONTENT</div> <input className="w-4/5 p-6 rounded-r border border-solid border-neutral-500 shadow-md" name="content" type={'text'} value={todo.content} onChange={handleChangeTodo} > </input> </div> </div> <div className="flex justify-center"> <div className="relative mb-4 flex w-full flex-wrap items-stretch"> <div className="w-1/5 p-6 text-right font-bold">DUEDATE</div> <input className="w-4/5 p-6 rounded-r border border-solid border-neutral-500 shadow-md" name="dueDate" type={'date'} value={todo.dueDate} onChange={handleChangeTodo} > </input> </div> </div> <div className="flex justify-end"> <div className="relative mb-4 flex p-4 flex-wrap items-stretch"> <button type="button" className="rounded p-4 w-36 bg-blue-500 text-xl text-white " onClick={handleClickAdd} > ADD </button> </div> </div> </div> ); } export default AddComponent;
-
미해결[개정3판] Node.js 교과서 - 기본부터 프로젝트 실습까지
정주행 시작했습니다. 강의 PPT 파일은 어디서 다운 받을수있나요?
정주행 시작했습니다. 강의 PPT 파일은 어디서 다운 받을수있나요?
-
미해결코드로 배우는 React 19 with 스프링부트 API서버
에러가 나지만 작동은합니다.
아래와 같은 에러가 발생하여 application.properties를 application.yml로 바꾸어봤지만 같은에러가납니다.***************************APPLICATION FAILED TO START***************************Description:Failed to configure a DataSource: 'url' attribute is not specified and no embedded datasource could be configured.Reason: Failed to determine a suitable driver classAction:Consider the following: If you want an embedded database (H2, HSQL or Derby), please put it on the classpath. If you have database settings to be loaded from a particular profile you may need to activate it (no profiles are currently active). 아래 코드는 application.yml내용입니다.spring: datasource: driver-class-name: org.mariadb.jdbc.Driver url: jdbc:mariadb://localhost:3306/apidb username: apidbuser password: apidbuser jpa: hibernate: ddl-auto: update properties: hibernate: format_sql: true show-sql: true logging: level:debug아래코드는 build.gradle 내용입니다. buildscript { ext { queryDslVersion = "5.0.0" } } plugins { id 'java' id 'org.springframework.boot' version '3.0.13' id 'io.spring.dependency-management' version '1.1.4' } group = 'org.mail' version = '0.0.1-SNAPSHOT' java { sourceCompatibility = '17' } configurations { compileOnly { extendsFrom annotationProcessor } } repositories { mavenCentral() } dependencies { implementation 'org.springframework.boot:spring-boot-starter-data-jpa' implementation 'org.springframework.boot:spring-boot-starter-web' compileOnly 'org.projectlombok:lombok' testCompileOnly'org.projectlombok:lombok' developmentOnly 'org.springframework.boot:spring-boot-devtools' runtimeOnly 'org.mariadb.jdbc:mariadb-java-client' annotationProcessor 'org.projectlombok:lombok' testAnnotationProcessor 'org.projectlombok:lombok' testImplementation 'org.springframework.boot:spring-boot-starter-test' implementation "com.querydsl:querydsl-jpa:${queryDslVersion}:jakarta" annotationProcessor( "jakarta.persistence:jakarta.persistence-api", "jakarta.annotation:jakarta.annotation-api", "com.querydsl:querydsl-apt:${queryDslVersion}:jakarta") } tasks.named('bootBuildImage') { builder = 'paketobuildpacks/builder-jammy-base:latest' } tasks.named('test') { useJUnitPlatform() } compileJava.dependsOn('clean')맨위에 에러 난 후 이하 반복적인 에러가 발생하지만 값을 가져오는데는 이상이없습니다.프론트에서 호출해도 정상적으로 데이터가 호출됩니다.그래서 quertdsl에 관한내용을 지우고 해봤는데 에러가 사라졌습니다. 혹시 querydsl 에 관한 이슈가 있는걸까요? 검색을 해봤지만 발견할 수가 없었습니다. java.lang.NullPointerException: Cannot read field "generatedClass" because "data" is null
-
해결됨[개정3판] Node.js 교과서 - 기본부터 프로젝트 실습까지
cjs방식인 이유가 있으신가요? require, import
강의에 나온대로 require()로 따라하던 중 import가 더 최신방식이라는 이야기를 듣게 되었습니다. 구글링을 해보니require()를 쓰는 쪽은 CommonJS(CJS)이고 import 쓰는 쪽이 ESM이라는 걸 알게되었습니다Es6(2015)부터 import를 쓸 수 있던거 같은데그 이후에 나온 강의가 require를 쓰게된 이유가 있을까요?사용되는 패키지의 호환성 이슈인지 다른 이유인지 궁금합니다