인프런 커뮤니티 질문&답변

Harry Jung님의 프로필 이미지
Harry Jung

작성한 질문수

Vue로 Nodebird SNS 만들기

bcrypt 관련 에러

작성

·

448

0

안녕하세요 bcrypt 수강중에서 계속 에러가 떠서 stackoverflow를 봐도 해결이 안되어 질문을 남깁니다. 


SequelizeDatabaseError: Data too long for column 'password' at row 1
   at Query.formatError (/Users/harry/Documents/workspace/wizetoPrototype/backend/node_modules/sequelize/lib/dialects/mysql/query.js:239:16)
   at Query.run (/Users/harry/Documents/workspace/wizetoPrototype/backend/node_modules/sequelize/lib/dialects/mysql/query.js:54:18)
   at processTicksAndRejections (internal/process/task_queues.js:97:5)



강의한 것과 같이 아래처럼 코딩을 하였는데 잘 안되어 user모델에서 password type을 text, char, string(200) 이상을 해보아도 동일하게 에러가 납니다
해결할 수 있는 방법이 있으면 감사하겠습니다.
추가적으로 hash 를 콘솔로 찍어서 얼마나 긴지 보고 싶었었는데 코맨드창에서는 로그가 안찍히네요. 어디서 확인을 할수 있는지도 알려주시면 감사하겠습니다.
답변 부탁드릴게요



app.js

app.post('/user', async (req, res, next)=>{
try{
const hash = await bcrypt.hash(req.body.password, 8)
console.log(hash)
const newUser = await db.User.create({
username: req.body.username,
email: req.body.email,
password: hash,
})
res.status(201).json(newUser)
} catch(error){
console.log('error', error)
next(error)
}


user.js
const User = sequelize.define('User', { // user의 모델
email: { // 모델의 table
type: DataTypes.STRING(40),
allowNull: false,
},
username: {
type: DataTypes.STRING(30),
allowNull: false,
},
password: {
type: DataTypes.STRING(100),
allowNull: false,
}
},







답변 12

1

제로초(조현영)님의 프로필 이미지
제로초(조현영)
지식공유자

widget.js에서  router.post('/') 빼보세요

그래도 안 된다면 브라우저 개발자도구 네트워크 탭에서 요청을 눌러서 어떤 정보가 나오고 있는지 보여주세요.

0

Harry Jung님의 프로필 이미지
Harry Jung
질문자

네 감사합니다~~ 프로제트 완성후 다시 연락드릴게요~~ 

0

제로초(조현영)님의 프로필 이미지
제로초(조현영)
지식공유자

방송에서 코드가 공개되는 대신 1시간에 2만원입니다.

0

Harry Jung님의 프로필 이미지
Harry Jung
질문자

위에 router 내용을 빼니까 나오네요. 감사합니다~~~~ 좋아요 누를게요~~~ 

아 제가 지금 제 개인 프로젝트를 진행하는데 내년 3월달쯤에 완성될 예정입니다. 코드 리뷰 비용은 어떻게 되는지 궁금한데 알려주실수 있나요?

0

Harry Jung님의 프로필 이미지
Harry Jung
질문자

const baseUrl = 'http://localhost:3071'

0

제로초(조현영)님의 프로필 이미지
제로초(조현영)
지식공유자

baseUrl이 뭘로 설정되어 있나요?

0

Harry Jung님의 프로필 이미지
Harry Jung
질문자

store에서 axios로 요쳥하고 있습니다.  좀 길지만 관련 내용 다 첨부하였습니다.  확인 부탁드릴게요 :) 감사합니다.

store/widget.js

export const actions= {
//main
addMain({commit}, payload){
this.$axios.post(`${baseUrl}/widget/mainFormContent`, {
logo: payload.logo,
title: payload.title,
subtitle: payload.subtitle,
buttonName: payload.buttonName,
description: payload.description,
addOn: payload.addOn,
tags: payload.tags,
textAlign: payload.textAlign,
bgArray: payload.bgArray,
fontArray: payload.fontArray,
buttonArray: payload.buttonArray,
sliderFont: payload.sliderFont,
sliderPadding: payload.sliderPadding,
sliderOpacity: payload.sliderOpacity,
sliderLineHeight: payload.sliderLineHeight,
}, {withCredentials: true})
.then((res)=>{
commit('ADD_MAIN', res.data)
}).catch((err)=>{
console.error(err)
})
},

app.js

//------------------------------------------------//
// BACKEND/FRONTPORTPORT
//------------------------------------------------//
const backPort = '3071'
const frontPort = '3000'


const express = require('express')
const db = require('./models')
const cors = require('cors')
const morgan = require('morgan')

//------------------------------------------------//
// ROUTER REQUIRE
//------------------------------------------------//
const userRouter = require('./routes/user')
const widgetRouter= require('./routes/widget')
const imageRouter = require('./routes/image')

//------------------------------------------------//
// PASSPORT MODULE
//------------------------------------------------//
const passport = require('passport')
const passportConfig = require('./passport')
const session = require('express-session')
const cookie = require('cookie-parser')
const app = express()
app.use(morgan('dev'))

db.sequelize.sync({force: true}) // db 실행


app.use(express.json()) // express 가 json을 받기 위함
app.use(express.urlencoded( {extended: false}))
// passport
app.use(session({
resave: false,
saveUninitialized: false,
secret: 'ns747800',
cookie: {
httpOnly: true,
secure: false,
}
}))
app.use(cookie('ns747800'))
app.use(passport.initialize())
app.use(passport.session())
passportConfig()



//------------------------------------------------//
// CORS FRONTEND PORT
//------------------------------------------------//

app.use(cors({
origin: `http://localhost:${frontPort}`,
credentials: true
}))

//------------------------------------------------//
// IMAGE STATIC FILES
//------------------------------------------------//

app.use('/', express.static('upload'));


//------------------------------------------------//
// ROUTER API
//------------------------------------------------//

app.get('/', (req,res)=>{ res.send('hello wizeto') })
app.use('/user', userRouter) // signUp, login, logout
app.use('/image', imageRouter)
app.use('/widget', widgetRouter) // widget - mainFormContent1, 2, 3, 4, 5

app.post('/database/post', (req, res, next)=>{
console.log('haryong', req)
return res.send('good')

})




//------------------------------------------------//
// LISTEN
//------------------------------------------------//
app.listen(backPort,()=>{ console.log(`YES backend server is ${backPort}`) })

routes/widget.js

const express = require('express');
const db = require('../models');
const router = express.Router();
const {isLoggedIn, isNotLoggedIn} = require('./middlewares')


router.post('/')

router.post('/mainFormContent/image', isLoggedIn, async(req, res, next)=>{
try{
const mainFormContentImage = await db.MainFormContent.create({
backgroundImage: req.body.backgroundImage
})
}catch(err){
console.log(err)
}
})



router.post('/mainFormContent', isLoggedIn, async(req, res, next)=>{
console.log('req', req.body)
try{
const mainFormContent = await db.MainFormContent.create({
logo: req.body.logo,
title: req.body.title,
subtitle: req.body.subtitle,
buttonName: req.body.buttonName,
description: req.body.description,
addOn: req.body.addOn,
backgroundImage: req.body.backgroundImage,
tags: req.body.tags,
textAlign: req.body.textAlign,
bgArray: req.body.bgArray,
fontArray: req.body.fontArray,
buttonArray: req.body.buttonArray,
sliderFont: req.body.sliderFont,
sliderPadding: req.body.sliderPadding,
sliderOpacity: req.body.sliderOpacity,
sliderLineHeight: req.body.sliderLineHeight,
})
}
catch(error){
console.log(error)
}
})

models/mainFormContent.js

module.exports = (sequelize, DataTypes) => {
const MainFormContent = sequelize.define('MainFormContent', { // MainFormContent 모델
logo: {
type: DataTypes.STRING(30),
allowNull: true,
},
title: {
type: DataTypes.STRING(100),
allowNull: true,
},
subtitle: {
type: DataTypes.TEXT,
allowNull: true,
},
buttonName: {
type: DataTypes.STRING(30),
allowNull: true,
},
description: {
type: DataTypes.TEXT,
allowNull: true,
},
addOn: {
type: DataTypes.BOOLEAN(),
allowNull: true,
},
tags: {
type: DataTypes.STRING(100),
allowNull: true,
},
textAlign: {
type: DataTypes.BOOLEAN(30),
allowNull: true,
},
bgArray: {
type: DataTypes.STRING(100),
allowNull: true,
},
fontArray: {
type: DataTypes.STRING(30),
allowNull: true,
},
buttonArray: {
type: DataTypes.STRING(30),
allowNull: true,
},
sliderFont: {
type: DataTypes.STRING(10),
allowNull: true,
},
sliderPadding: {
type: DataTypes.STRING(10),
allowNull: true,
},
sliderOpacity: {
type: DataTypes.STRING(10),
allowNull: true,
},
sliderLineHeight: {
type: DataTypes.STRING(10),
allowNull: true,
},
backgroundImage: {
type: DataTypes.STRING(50),
allowNull: true,
}
},
{ // 한글 설정 부분
charset: 'utf8mb4', // 한국어 사용가능, 아이콘 사용
collate: 'utf8mb4_general_ci', // 한국어 저장
})


MainFormContent.associate = (db) => {}
return MainFormContent;
}

0

제로초(조현영)님의 프로필 이미지
제로초(조현영)
지식공유자

지금 서버로 아예 접근이 안 되고 있습니다. 서버에 요청을 어떤 식으로 보내고 계신가요?

그리고 alter: true는 이제 지우셔도 됩니다.

0

Harry Jung님의 프로필 이미지
Harry Jung
질문자

터미널 내용은 뜨는데 다 DATABASE에 관련된 내용만 뜨고 

req 안에 있는 내용을 보고 싶은데 뜨질 않네요.~

router.post('/mainFormContent', isLoggedIn, async(req, res, next)=>{
console.log('req', req.body)
try{
const mainFormContent = await db.MainFormContent.create({
logo: req.body.logo,
title: req.body.title,
subtitle: req.body.subtitle,
buttonName: req.body.buttonName,
description: req.body.description,
addOn: req.body.addOn,
backgroundImage: req.body.backgroundImage,
tags: req.body.tags,
textAlign: req.body.textAlign,
bgArray: req.body.bgArray,
fontArray: req.body.fontArray,
buttonArray: req.body.buttonArray,
sliderFont: req.body.sliderFont,
sliderPadding: req.body.sliderPadding,
sliderOpacity: req.body.sliderOpacity,
sliderLineHeight: req.body.sliderLineHeight,
})
}
catch(error){
console.log(error)
}
})

TERMINAL --------------------------------------------------------------------------------

[nodemon] restarting due to changes...

[nodemon] starting `node app,js app.js`

YES backend server is 3070

Executing (default): DROP TABLE IF EXISTS `MainFormContents`;

Executing (default): DROP TABLE IF EXISTS `Images`;

Executing (default): DROP TABLE IF EXISTS `Users`;

Executing (default): DROP TABLE IF EXISTS `Users`;

Executing (default): CREATE TABLE IF NOT EXISTS `Users` (`id` INTEGER NOT NULL auto_increment , `email` VARCHAR(40) NOT NULL UNIQUE, `username` VARCHAR(30) NOT NULL, `password` VARCHAR(100) NOT NULL, `createdAt` DATETIME NOT NULL, `updatedAt` DATETIME NOT NULL, PRIMARY KEY (`id`)) ENGINE=InnoDB DEFAULT CHARSET=utf8 COLLATE utf8_general_ci;

Executing (default): SHOW INDEX FROM `Users` FROM `wizeto`

Executing (default): DROP TABLE IF EXISTS `Images`;

Executing (default): CREATE TABLE IF NOT EXISTS `Images` (`id` INTEGER NOT NULL auto_increment , `MainFormImage` VARCHAR(200) NOT NULL, `createdAt` DATETIME NOT NULL, `updatedAt` DATETIME NOT NULL, PRIMARY KEY (`id`)) ENGINE=InnoDB DEFAULT CHARSET=utf8 COLLATE utf8_general_ci;

Executing (default): SHOW INDEX FROM `Images` FROM `wizeto`

Executing (default): DROP TABLE IF EXISTS `MainFormContents`;

Executing (default): CREATE TABLE IF NOT EXISTS `MainFormContents` (`id` INTEGER NOT NULL auto_increment , `logo` VARCHAR(30), `title` VARCHAR(100), `subtitle` TEXT, `buttonName` VARCHAR(30), `description` TEXT, `addOn` TINYINT(1), `tags` VARCHAR(100), `textAlign` TINYINT(1), `bgArray` VARCHAR(100), `fontArray` VARCHAR(30), `buttonArray` VARCHAR(30), `sliderFont` VARCHAR(10), `sliderPadding` VARCHAR(10), `sliderOpacity` VARCHAR(10), `sliderLineHeight` VARCHAR(10), `backgroundImage` VARCHAR(50), `createdAt` DATETIME NOT NULL, `updatedAt` DATETIME NOT NULL, PRIMARY KEY (`id`)) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE utf8mb4_general_ci;

Executing (default): SHOW INDEX FROM `MainFormContents` FROM `wizeto`

0

제로초(조현영)님의 프로필 이미지
제로초(조현영)
지식공유자

일단 라우트 접근 내용(morgan이 기록해주는 것)은 뜨나요? 그게 아니라면 라우트가 아예 실행되지 않는 것입니다.

0

Harry Jung님의 프로필 이미지
Harry Jung
질문자

감사합니다~~.  워크벤치에서 바꾸니까 바로 해결이 되네요~~. 아 그리고 express 의 app.js 에서 console.log를 찍어서 디버깅을 해보고 싶은데 morgan 을 설치해도 관련 콘솔내용은 보이지 않더라구요. 

예를 들어  아래 처럼 req 에 무슨 내용이 들어왔는지 확인해보고 싶었는데 터미널에서도 보이지 않아서 어떻게 하면 볼수 있을까요?

app.post('/user', async (req, res, next)=>{
console.log('req', req)
const hash = await bcrypt.hash(req.body.password, 12)
const newUser = await db.User.create({
username: req.body.username,
email: req.body.email,
password: hash,
})

0

제로초(조현영)님의 프로필 이미지
제로초(조현영)
지식공유자

password 길이를 100으로 늘리셨는데 user.js만 바꾼다고 실제 DB가 바뀌진 않습니다. 시퀄라이즈는 초기 생성만 해주고 수정은 해주지 않습니다.

sequelize.sync({ alter: true })로 잠깐 바꿔서 재실행한 후 원래대로 돌려놓으세요. 혹시 에러가 뜬다면 직접 워크벤치나 MySQL 프롬프트 들어가서 바꾸세요.

Harry Jung님의 프로필 이미지
Harry Jung

작성한 질문수

질문하기