49,500원
다른 수강생들이 자주 물어보는 질문이 궁금하신가요?
- 미해결[개정3판] Node.js 교과서 - 기본부터 프로젝트 실습까지
혹시 제로초님 webstorm 세팅을 알 수 있을까요?
저번에 Unresolved variable 워닝이 뜬다고 했던 수강생입니다.저 워닝 안 뜨게 하려고 종일 구글링했는데도 해결 방법을 못 찾았습니다 ㅠㅠ제로초님 강의에서는 함수로 잘 인식하던데 혹시 수고롭지 않으시다면 webstorm 세팅을 알려주실 수 있나요?Settings에서 Languages & Frameworks => JavaScript => Libraries에 Node.js Core도 체크되어 있고 구글에서 하라는 건 다 해봤는데 안 되네요 ㅠㅠmodels/index.js에서 const sequelize = new Sequelize(~~); 에서 Sequelize도 constructor가 아닌 function으로 인식하네요따로 설정 안 하셨다면 어쩔 수 없지만 혹시 따로 세팅하신 게 기억이 나신다면 공유해주시면 감사하겠습니다
- 해결됨[개정3판] Node.js 교과서 - 기본부터 프로젝트 실습까지
자바스크립트 특성상 무시해도 되는 경고일까요?
9장 노드버드 만들기의 두 번째 강의 - 데이터베이스 세팅하기에서 경고가 떠서 질문드립니다.models/user.js 입니다.유니티와 c#으로 게임 개발 하다가 비동기 서버를 공부 하려고 제로초님 강의를 듣고 있는데요, 이번에 자바스크립트를 처음 접했습니다. 보통 다른 언어에서는 함수의 매개변수에 자료형을 명시해주는데, 자바스크립트에서는 변수명만 선언하는 거 같더라구요.그래서 db에 User라는 변수가 있는지 알 수 없어서 경고가 뜨는 거 같은데, 무시해도 되는 경고일까요?아무래도 저런 경고가 뜨면 찝찝해서요 ㅠㅠ그리고 필드 검색이 안 되니 자동 완성도 안 돼서 불편한 점도 있네요. index.js에서 User를 비롯한 model들을 직접 선언해주고 초기화 할 때는 저 경고가 안 떴는데, model들을 자동화하도록 코드 수정하시는 부분 따라한 이후에 위 경고가 뜨게 됐습니다.IDE는 Webstorm이고, npm start는 정상적으로 작동합니다.자바스크립트는 참 신기한 언어군요..
- 해결됨[개정3판] Node.js 교과서 - 기본부터 프로젝트 실습까지
setCookie 질문입니다.
안녕하십니까 제로초님 질문이 있어 글을 올립니다.현재 next.js를 이용하여 localhost:3000 포트를 이용해 front를 진행하고 있고, back은 제로초님의 강의를 이용하여 localhost:8001 포트로 서버를 만들어 진행하고 있습니다. 그러다, express passport 로그인 후 setCookie로 쿠키에 값을 저장하는 과정에서, front 서버 localhost:3000 포트에서는네트워크 탭에는 위와 같이 Set-Cookie로 명시 되어 있으나, 애플리케이션 탭의 쿠키에는 저장이 되지 않았습니다. 그래서 postman으로 실험을 해본 결과 postman에서는 정상적으로 쿠키가 저장된 모습을 확인할 수 있었습니다. 때문에 이와 같은 경우를 계속 찾아보고, 검색을 해보았는데, 브라우저의 쿠키 정책에 따라, 서로 다른 도메인 간에는 쿠키를 공유할 수 없습니다. 이를 해결하기 위해서는 서버에서 쿠키를 설정할 때 samesite 옵션을 none으로 설정 후 https 를 이용해 통신해야 한다고 나왔었습니다. 위와 같은 설명 때문에 localhost:3000 에서는 쿠키값이 저장이 안 된 것이 맞는 지 궁금합니다.
- 해결됨[개정3판] Node.js 교과서 - 기본부터 프로젝트 실습까지
hashtag 검색 결과 없는 경우 status code처리
강의에서는 해시태그 검색결과가 없는 경우404로 처리하는 방향으로 가고 있습니다궁금하여 다른 곳에서는 어떻게 하나 확인해보았습니다아마존의 경우 200 OK처리하여주는데검색 결과가 있고 없고에 대한 응답처리는 api 작성자에 따라 다르게 처리가 가능한 영역인가요?
- 해결됨[개정3판] Node.js 교과서 - 기본부터 프로젝트 실습까지
aws lambda로 lazy loading 구현
(안녕하세요. 제로초님 매번 질문드릴때마다 빠르게 답변해주셔서 정말 감사 드립니다.) 지금 useInfiniteQuery를 통해 게시물의 정보들을 한번에 모두 받아오는 것이 아닌 5개씩 나눠서 받아오도록 구현을 마쳤습니다. 그리고 여기에 한번더 최적화를 진행하기 위해 lazy loading image 기법을 도입하려고 하는데요 도입이유는 사용자가 처음 받아오는 이미지를 모두 다 볼 수 있는 형태가 아니기 때문입니다. 일반적인 모니터라면 사용자는 1개의 게시물 밖에 보지 못합니다. 그래서 이러한 점에서 나머지 4개에는 resize(50*50)정도로 사진 크기를 줄여서 전송하고 사용자가 스크롤을 하여 화면을 내리면 intersection observer를 통해 사용자가 볼수 있는 정도의 resizing된 이미지를 요청하여 화면에 렌더하려고 합니다.그러기 위해서는 thumb파일 이외에 50* 50 사이즈의 이미지를 저장하는 파일을 한개 더 만들려고 하는데 여기서 막혔습니다.궁금한게 aws-lambda를 한개 더 만들어야 하나요?아니면 resizing해주는 lambda한개에서 2종류의 resizing처리가 가능한가요?return 부분의 callback 함수에 파라미터를 어떻게 넣어야 하는지 잘 모르겠습니다..그리고 제가 하려는 최적화 방식이 효과 있는 방식이 맞는건가요?혹시 제거 간과 하고 있는 부분은 없는지 궁금합니다..답변해주시면 감사하겠습니다.
- 해결됨[개정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가 틀렸다는 소리인가요?
- 해결됨[개정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'), '번 포트에서 대기중'); });
- 미해결[개정3판] Node.js 교과서 - 기본부터 프로젝트 실습까지
정주행 시작했습니다. 강의 PPT 파일은 어디서 다운 받을수있나요?
정주행 시작했습니다. 강의 PPT 파일은 어디서 다운 받을수있나요?
- 해결됨[개정3판] Node.js 교과서 - 기본부터 프로젝트 실습까지
cjs방식인 이유가 있으신가요? require, import
강의에 나온대로 require()로 따라하던 중 import가 더 최신방식이라는 이야기를 듣게 되었습니다. 구글링을 해보니require()를 쓰는 쪽은 CommonJS(CJS)이고 import 쓰는 쪽이 ESM이라는 걸 알게되었습니다Es6(2015)부터 import를 쓸 수 있던거 같은데그 이후에 나온 강의가 require를 쓰게된 이유가 있을까요?사용되는 패키지의 호환성 이슈인지 다른 이유인지 궁금합니다
- 해결됨[개정3판] Node.js 교과서 - 기본부터 프로젝트 실습까지
async function을 생략하고 바로 await 하는 부분이 잘 이해가 안됩니다
async function ( if (){await 어쩌구} ) 여기서 if문 안에 await가 들어있으면 await가 있는 곳이 최상위 스코프가 아닌데 작동이 가능한가요? 최상위 스코프에서만 async function 생략 가능하다는 말은 async function(await 어쩌구) 이래야 바로 await 어쩌구 로 꺼낼 수 있고 if(){await 어쩌구} 는 async function 밖으로 꺼낼 수 없는 것으로 이해되어서요..제가 최상위 스코프가 뭔지 잘 모르는 것 같기도 합니다..ㅠㅠ[제로초 강좌 질문 필독 사항입니다]질문에는 여러분에게 도움이 되는 질문과 도움이 되지 않는 질문이 있습니다.도움이 되는 질문을 하는 방법을 알려드립니다.https://www.youtube.com/watch?v=PUKOWrOuC0c0. 숫자 0부터 시작한 이유는 1보다 더 중요한 것이기 때문입니다. 에러가 났을 때 해결을 하는 게 중요한 게 아닙니다. 왜 여러분은 해결을 못 하고 저는 해결을 하는지, 어디서 힌트를 얻은 것이고 어떻게 해결한 건지 그걸 알아가셔야 합니다. 그렇지 못한 질문은 무의미한 질문입니다.1. 에러 메시지를 올리기 전에 반드시 스스로 번역을 해야 합니다. 번역기 요즘 잘 되어 있습니다. 에러 메시지가 에러 해결 단서의 90%를 차지합니다. 한글로 번역만 해도 대부분 풀립니다. 그냥 에러메시지를 올리고(심지어 안 올리는 분도 있습니다. 저는 독심술사가 아닙니다) 해결해달라고 하시면 아무런 도움이 안 됩니다.2. 에러 메시지를 잘라서 올리지 않아야 합니다. 입문자일수록 에러메시지에서 어떤 부분이 가장 중요한 부분인지 모르실 겁니다. 그러니 통째로 올리셔야 합니다.3. 코드도 같이 올려주세요. 다만 코드 전체를 다 올리거나, 깃헙 주소만 띡 던지지는 마세요. 여러분이 "가장" 의심스럽다고 생각하는 코드를 올려주세요.4. 이 강좌를 바탕으로 여러분이 응용을 해보다가 막히는 부분, 여러 개의 선택지 중에서 조언이 필요한 부분, 제 경험이 궁금한 부분에 대한 질문은 대환영입니다. 다만 여러분의 회사 일은 질문하지 마세요.5. 강좌 하나 끝날 때마다 남의 질문들을 읽어보세요. 여러분이 곧 만나게 될 에러들입니다.6. 위에 적은 내용을 명심하지 않으시면 백날 강좌를 봐도(제 강좌가 아니더라도) 실력이 늘지 않고 그냥 코딩쇼 관람 및 한컴타자연습을 한 셈이 될 겁니다.
- 해결됨[개정3판] Node.js 교과서 - 기본부터 프로젝트 실습까지
passport 미들웨어를 express-session 밑에다가 반드시 적어야하는 이유
[passport 세팅 및 회원가입 만들기] 강의 중 passport 미들웨어를 왜 express-session 밑에다가 반드시 적어야한다고 하셨는데 이유는 나오지 않았었습니다이유는 무엇일까요?GPT도 써보았지만 생성형 AI라서 틀린 대답일 수 있으므로 강의자분께 질문드립니다.
- 미해결[개정3판] Node.js 교과서 - 기본부터 프로젝트 실습까지
9장 게시글 업로드하기 post 오류
[제로초 강좌 질문 필독 사항입니다]질문에는 여러분에게 도움이 되는 질문과 도움이 되지 않는 질문이 있습니다.도움이 되는 질문을 하는 방법을 알려드립니다.https://www.youtube.com/watch?v=PUKOWrOuC0c0. 숫자 0부터 시작한 이유는 1보다 더 중요한 것이기 때문입니다. 에러가 났을 때 해결을 하는 게 중요한 게 아닙니다. 왜 여러분은 해결을 못 하고 저는 해결을 하는지, 어디서 힌트를 얻은 것이고 어떻게 해결한 건지 그걸 알아가셔야 합니다. 그렇지 못한 질문은 무의미한 질문입니다.1. 에러 메시지를 올리기 전에 반드시 스스로 번역을 해야 합니다. 번역기 요즘 잘 되어 있습니다. 에러 메시지가 에러 해결 단서의 90%를 차지합니다. 한글로 번역만 해도 대부분 풀립니다. 그냥 에러메시지를 올리고(심지어 안 올리는 분도 있습니다. 저는 독심술사가 아닙니다) 해결해달라고 하시면 아무런 도움이 안 됩니다.2. 에러 메시지를 잘라서 올리지 않아야 합니다. 입문자일수록 에러메시지에서 어떤 부분이 가장 중요한 부분인지 모르실 겁니다. 그러니 통째로 올리셔야 합니다.3. 코드도 같이 올려주세요. 다만 코드 전체를 다 올리거나, 깃헙 주소만 띡 던지지는 마세요. 여러분이 "가장" 의심스럽다고 생각하는 코드를 올려주세요.4. 이 강좌를 바탕으로 여러분이 응용을 해보다가 막히는 부분, 여러 개의 선택지 중에서 조언이 필요한 부분, 제 경험이 궁금한 부분에 대한 질문은 대환영입니다. 다만 여러분의 회사 일은 질문하지 마세요.5. 강좌 하나 끝날 때마다 남의 질문들을 읽어보세요. 여러분이 곧 만나게 될 에러들입니다.6. 위에 적은 내용을 명심하지 않으시면 백날 강좌를 봐도(제 강좌가 아니더라도) 실력이 늘지 않고 그냥 코딩쇼 관람 및 한컴타자연습을 한 셈이 될 겁니다. 사진업로드를 하려할때 미리보기가 뜨지 않습니다. uploads에는 올린 사진들이 잘 뜹니다.게시글을 업로드하려 짹짹을 누르면 post 라우터가 없다고 뜹니다. POST /post 라우터가 없습니다.404Error: POST /post 라우터가 없습니다. at C:\Users\jyoun\udr_node\lecture\ch9\app.js:53:18 at Layer.handle [as handle_request] (C:\Users\jyoun\udr_node\lecture\ch9\node_modules\express\lib\router\layer.js:95:5) at trim_prefix (C:\Users\jyoun\udr_node\lecture\ch9\node_modules\express\lib\router\index.js:328:13) at C:\Users\jyoun\udr_node\lecture\ch9\node_modules\express\lib\router\index.js:286:9 at Function.process_params (C:\Users\jyoun\udr_node\lecture\ch9\node_modules\express\lib\router\index.js:346:12) at next (C:\Users\jyoun\udr_node\lecture\ch9\node_modules\express\lib\router\index.js:280:10) at C:\Users\jyoun\udr_node\lecture\ch9\node_modules\express\lib\router\index.js:646:15 at next (C:\Users\jyoun\udr_node\lecture\ch9\node_modules\express\lib\router\index.js:265:14) at C:\Users\jyoun\udr_node\lecture\ch9\routes\page.js:12:3 at Layer.handle [as handle_request] (C:\Users\jyoun\udr_node\lecture\ch9\node_modules\express\lib\router\layer.js:95:5) controllers/post.jsconst Post = require('../models/post'); const Hashtag = require('../models/hashtag'); exports.afterUploadImage = (req, res) => { console.log(req.file); res.json({ url: `/img/${req.file.filename}` }); }; exports.uploadPost = async (req, res, next) => { try { const post = await Post.create({ content: req.body.content, img: req.body.url, UserId: req.user.id, }); const hashtags = req.body.content.match(/#[^\s#]*/g); if (hashtags) { const result = await Promise.all(hashtags.map((tag) => { return Hashtag.findOrCreate({ where: { title: tag.slice(1).toLowerCase() } }); })); console.log('result', result); await post.addHashtags(result.map(r => r[0])); } res.redirect('/'); } catch (error) { console.error(error); next(error); } }; routes/post.jsconst express = require('express'); const multer = require('multer'); const path = require('path'); const fs = require('fs'); const { afterUploadImage, uploadPost } = require('../controllers/post'); const { isLoggedIn } = require('../middlewares'); const router = express.Router(); try { fs.readdirSync('uploads'); } catch (error) { console.error('uploads 폴더가 없어 uploads 폴더를 생성합니다.'); fs.mkdirSync('uploads'); } const upload = multer({ storage: multer.diskStorage({ destination(req, file, cb) { cb(null, '/uploads'); }, filename(req, file, cb) { const ext = path.extname(file.originalname); cb(null, path.basename(file.originalname, ext) + Date.now() + ext); }, }), limits: { fileSize: 5 * 1024 * 1024 }, }); // POST /post/img router.post('/img', isLoggedIn, upload.single('img'), afterUploadImage); // POST /post const upload2 = multer(); router.post('/', isLoggedIn, upload2.none(), uploadPost); module.exports = router; 개발자 도구로 보면 짹짹을 눌렀을때 갈곳이 없다는데 저는 깃헙 복사해서 똑같이 했는데 뭐가 문제인지 모르겠습니다. 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(); 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 || 8001); 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'), '번 포트에서 대기중'); }); main.html{% extends 'layout.html' %} {% block content %} <div class="timeline"> {% if user %} <div> <form id="twit-form" action="/post" method="post" enctype="multipart/form-data"> <div class="input-group"> <textarea id="twit" name="content" maxlength="140"></textarea> </div> <div class="img-preview"> <img id="img-preview" src="" style="display: none;" width="250" alt="미리보기"> <input id="img-url" type="hidden" name="url"> </div> <div> <label id="img-label" for="img">사진 업로드</label> <input id="img" type="file" accept="image/*"> <button id="twit-btn" type="submit" class="btn">짹짹</button> </div> </form> </div> {% endif %} <div class="twits"> <form id="hashtag-form" action="/hashtag"> <input type="text" name="hashtag" placeholder="태그 검색"> <button class="btn">검색</button> </form> {% for twit in twits %} <div class="twit"> <input type="hidden" value="{{twit.User.id}}" class="twit-user-id"> <input type="hidden" value="{{twit.id}}" class="twit-id"> <div class="twit-author">{{twit.User.nick}}</div> {% if not followingIdList.includes(twit.User.id) and twit.User.id !== user.id %} <button class="twit-follow">팔로우하기</button> {% endif %} <div class="twit-content">{{twit.content}}</div> {% if twit.img %} <div class="twit-img"><img src="{{twit.img}}" alt="섬네일"></div> {% endif %} </div> {% endfor %} </div> </div> {% endblock %} {% block script %} <script> if (document.getElementById('img')) { document.getElementById('img').addEventListener('change', function(e) { const formData = new FormData(); console.log(this, this.files); formData.append('img', this.files[0]); axios.post('/post/img', formData) .then((res) => { document.getElementById('img-url').value = res.data.url; document.getElementById('img-preview').src = res.data.url; document.getElementById('img-preview').style.display = 'inline'; }) .catch((err) => { console.error(err); }); }); } document.querySelectorAll('.twit-follow').forEach(function(tag) { tag.addEventListener('click', function() { const myId = document.querySelector('#my-id'); if (myId) { const userId = tag.parentNode.querySelector('.twit-user-id').value; if (userId !== myId.value) { if (confirm('팔로잉하시겠습니까?')) { axios.post(`/user/${userId}/follow`) .then(() => { location.reload(); }) .catch((err) => { console.error(err); }); } } } }); }); </script> {% endblock %}
- 미해결[개정3판] Node.js 교과서 - 기본부터 프로젝트 실습까지
람다 접근 에러
너무 자주 잘문드려 죄송합니다...2023-11-23T13:10:50.588Z 50b59392-754b-4b9c-90a1-ed48e95f40e1 ERROR AccessDenied: Access Denied at throwDefaultError (/var/task/node_modules/@smithy/smithy-client/dist-cjs/default-error-handler.js:8:22) at /var/task/node_modules/@smithy/smithy-client/dist-cjs/default-error-handler.js:18:39 at de_GetObjectCommandError (/var/task/node_modules/@aws-sdk/client-s3/dist-cjs/protocols/Aws_restXml.js:4330:20) 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:14:20 at async /var/task/node_modules/@smithy/middleware-retry/dist-cjs/retryMiddleware.js:27: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 { '$fault': 'client', '$metadata': { httpStatusCode: 403, requestId: 'S3JVT25F4WT5TH9H', extendedRequestId: 'i2FSNxeCIH5smb0tHWggtUQ7WWZIvDurOoQ4UGIZ1eVgwIPsJwrNC85V8Oh2XHVpCaFyITlXaaM=', cfId: undefined, attempts: 1, totalRetryDelay: 0 }, Code: 'AccessDenied', RequestId: 'S3JVT25F4WT5TH9H', HostId: 'i2FSNxeCIH5smb0tHWggtUQ7WWZIvDurOoQ4UGIZ1eVgwIPsJwrNC85V8Oh2XHVpCaFyITlXaaM='}이러한 에러가 발생했습니다. 찾아보니깐 s3 버컷 정책과 관련이 있는 것 같습니다.{ "Version": "2012-10-17", "Statement": [ { "Sid": "AddPerm", "Effect": "Allow", "Principal": "*", "Action": [ "s3:GetObject", "s3:PutObject" ], "Resource": "arn:aws:s3:::whatsup1/*" } ]}이게 저의 s3 버캣 정책입니다.그리고 아래는 aws-upload의 index.js입니다 //이미지 리사이징 라이브러리 const sharp = require("sharp"); const { S3Client, GetObjectCommand, PutObjectCommand, } = require("@aws-sdk/client-s3"); //함수가 aws 람다에서 돌아가기 때문에 스크릿키랑 아이디를 자동으로 넣어준다 = > 아무것도 넣어줄 필요 x const s3 = new S3Client(); //람다는 3개의 매개변수를 제공하고 이 함수를 호출해준다. exports.handler = async (event, context, callback) => { const Bucket = event.Records[0].s3.bucket.name; const Key = decodeURIComponent(event.Records[0].s3.object.key); //original/리버풀.png const filename = Key.split("/").at(-1); const ext = Key.split(".").at(-1).toLowerCase(); const requiredFormat = ext === "jpg" ? "jpeg" : ext; console.log("name", filename, "ext", ext); try { const getObject = await s3.send(new GetObjectCommand({ Bucket, Key })); const buffers = []; for await (const data of getObject.Body) { buffers.push(data); } const imageBuffer = Buffer.concat(buffers); console.log("original", getObject); const resizedImage = await sharp(imageBuffer) .resize(200, 200, { fit: "inside" }) .toFormat(requiredFormat) .toBuffer(); await s3.send( new PutObjectCommand({ Bucket, Key: `thumb/${filename}`, Body: resizedImage, }) ); console.log("put", resizedImage.length); return callback(null, `thumb/${filename}`); } catch (error) { console.error(error); return callback(error); } }; 구글링 해보니깐 s3정책들이 비슷하면서 약간씩 다르던데 뭐가 맞는건지 잘 모르겠습니다..
- 미해결[개정3판] Node.js 교과서 - 기본부터 프로젝트 실습까지
람다 에러
stack": [ "Error: ", "Something went wrong installing the \"sharp\" module", "", "Cannot find module '../build/Release/sharp-linux-arm64v8.node'"이렇게 에러가 발생했는데 람다에서 함수 생성시 선택사항에 보면아키텍쳐 선택할때 제로초님은 기본적으로 선택되어있는 x86을 선택하셨고 저는 맥북에어 m2를 사용해서 arm64를 선택했는데 이거 때문에 에러가 난걸까요? 그리고 제로초님이 강의 만드실때는 node 18버전이 최신버전이였는데 지금은 20까지 나와서 20으로 했는데 이것도 문제가 될까요?
- 미해결[개정3판] Node.js 교과서 - 기본부터 프로젝트 실습까지
Error: Data too long for column
req.file을 보면 아래와 같이 나옵니다.{ fieldname: 'img', originalname: 'á\x84\x89á\x85³á\x84\x8Fá\x85³á\x84\x85á\x85µá\x86«á\x84\x89á\x85£á\x86º 2023-11-22 á\x84\x8Bá\x85©á\x84\x92á\x85® 8.36.00.png', encoding: '7bit', mimetype: 'image/png', size: 156946, bucket: 'whatsup1', key: 'original/1700700649389_á\x84\x89á\x85³á\x84\x8Fá\x85³á\x84\x85á\x85µá\x86«á\x84\x89á\x85£á\x86º 2023-11-22 á\x84\x8Bá\x85©á\x84\x92á\x85® 8.36.00.png', acl: 'private', contentType: 'application/octet-stream', contentDisposition: null, contentEncoding: null, storageClass: 'STANDARD', serverSideEncryption: null, metadata: undefined, location: 'https://whatsup1.s3.ap-northeast-2.amazonaws.com/original/1700700649389_%C3%A1%C2%84%C2%89%C3%A1%C2%85%C2%B3%C3%A1%C2%84%C2%8F%C3%A1%C2%85%C2%B3%C3%A1%C2%84%C2%85%C3%A1%C2%85%C2%B5%C3%A1%C2%86%C2%AB%C3%A1%C2%84%C2%89%C3%A1%C2%85%C2%A3%C3%A1%C2%86%C2%BA%202023-11-22%20%C3%A1%C2%84%C2%8B%C3%A1%C2%85%C2%A9%C3%A1%C2%84%C2%92%C3%A1%C2%85%C2%AE%208.36.00.png', etag: '"9afb9409e1bcd41269629b6bb1100245"', versionId: undefined}제로초님은 사진 파일 확장자가 jpg로 뜨는데 저는 png로 뜹니다..s3에 저장되는 쪽이 아니라 사진을 파일로 만드는 부분에서 문제가 있는 것 같은데 어느부분에서 손을 봐야할지 잘 모르겠습니다..const { S3Client } = require("@aws-sdk/client-s3"); const multerS3 = require("multer-s3"); const s3 = new S3Client({ credentials: { accessKeyId: process.env.S3_ACCESS_KEY_ID, secretAccessKey: process.env.S3_SECRET_ACCESS_KEY, }, region: "ap-northeast-2", }); const upload = multer({ storage: multerS3({ s3, bucket: "whatsup1", key(req, file, cb) { cb(null, `original/${Date.now()}_${file.originalname}`); }, }), limits: { fileSize: 5 * 1024 * 1024 }, });그리고 추가적인 질문이 있는데 localhost로 서버를 작동시킬때 db는 잘 보이는데 lightsail로 작동시킨 db가 보이지 않습니다..mysql connection 추가 버튼 눌러서 hostname을 aws에서 제공해준 ip로 바꾸면 되는거 아닌가요?그런데 그렇게 하고 연결을 하니깐 버퍼링이 걸리면서 연결이 되지 않습니다..
- 미해결[개정3판] Node.js 교과서 - 기본부터 프로젝트 실습까지
카카오 로그인 질문드립니다!
안녕하세요!!제가 지금 Next.js와 Node.js를 활용해서 중고거래 사이트를 프론트와 백 둘다 구현을 하려고 하는데프론트(NextAuth)에서 API 를 받아와 카카오 로그인을 구현하면, 백에서는 카카오 로그인에대한 구현을 할 필요가 없는건가요?또, 프론트 나 백 둘중 어느곳에서 카카오 로그인을 구현해야 효율적인지 궁금합니다!
- 해결됨[개정3판] Node.js 교과서 - 기본부터 프로젝트 실습까지
11.3 통합테스트 중 TypeError: model.initiate is not a function
질문할까 고민하다가 용기내어 질문드려봅니다..!11장 통합테스트 중 나타난 에러입니다.npm test 를 입력하면 나오는 에러입니다.> nodebird@0.0.1 test > jest PASS models/user.test.js PASS services/user.test.js PASS middlewares/index.test.js FAIL routes/auth.test.js ● Test suite failed to run TypeError: model.initiate is not a function 22 | console.log(file, model.name); 23 | db[model.name] = model; > 24 | model.initiate(sequelize); | ^ 25 | }); 26 | 27 | Object.keys(db).forEach(modelName => { // associate 호출 at initiate (models/index.js:24:11) at Array.forEach (<anonymous>) at Object.forEach (models/index.js:20:4) at Object.require (routes/auth.test.js:2:23) Test Suites: 1 failed, 3 passed, 4 total Tests: 9 passed, 9 total Snapshots: 0 total Time: 0.725 s, estimated 1 s현재 에러는 model.initiate가 함수화가 되지 않았다고 나타는거 같습니다.model.initiate가 존재하는 index.js입니다.const Sequelize = require('sequelize'); const fs = require('fs'); const path = require('path'); const env = process.env.NODE_ENV || 'development'; const config = require('../config/config')[env]; const db = {}; const sequelize = new Sequelize( config.database, config.username, config.password, config, ); db.sequelize = sequelize; const basename = path.basename(__filename); fs .readdirSync(__dirname) .filter(file => { return (file.indexOf('.') !== 0) && (file !== basename) && (file.slice(-3) === '.js'); }) .forEach(file => { const model = require(path.join(__dirname, file)); console.log(file, model.name); db[model.name] = model; model.initiate(sequelize); // 오류 발생시점 }); Object.keys(db).forEach(modelName => { if (db[modelName].associate) { db[modelName].associate(db); } }); module.exports = db;11.3 강의를 보는 중이며 auth.test.js 코드를 작성중입니다작성중인 auth.test.js는 아래와 같습니다.const app = require('../app'); const request = require('supertest'); const { sequelize } = require('../models'); beforeAll(async () => { await sequelize.sync() }) beforEach(() => { }); describe('POST /join', () => { test('로그인 안 했으면 가입', (done) => { request(app).post('/auth/join') .send({ email: 'choibo@naver.com', nick: 'bobobo', password: 'choibo11' }) .expect('Location', '/') .expect(302, done) }) }) describe('POST /login', () =>{ test('로그인 수행', (done) => { request(app).post('/auth/login') .send({ email: 'choibo@naver.com', password: 'choibo11' }) .expect('Location', '/') .expect(302, done) }) }); afterEach(() => {}); aftereAll(() => { }); 이부분에서 에러가 발생한다고 나타나있습니다.const { sequelize } = require('../models');
- 미해결[개정3판] Node.js 교과서 - 기본부터 프로젝트 실습까지
S3 버킷 만들 때 암호화 유형
버킷 만들때 강의 와 달리 처음부터 저렇게 선택되어있던데 그냥 원래 선택되었던거 유지하면서 만들면 되나요?