1. typeDefs
import { gql } from 'apollo-server'
import { GraphQLUpload } from 'graphql-upload'
export default gql`
scalar Upload
type EditProfileResult {
ok: Boolean!
error: String
}
type Mutation {
editProfile(
username: String
email: String
password: String
bio: String
avatar: Upload
): EditProfileResult!
}
`
- scalar Upload 를 만들어서 Upload Type을 만듬
- avatar 이미지 파일의 type을 Upload로 설정함.
2. resolvers
import bcrypt from 'bcryptjs'
import prisma from '../../client'
import { protectedResolver } from '../users.util'
import fs from 'fs'
const resolveFn = async (
_,
{ username, email, password: newPassword, bio, avatar },
{ loggedInUser }
///args로 username, email, password, bio, avater
///context에 loggedInUser 넣어서 editProfile하려는 user를 확인함.
) => {
let avatarUrl = null
///avatarUrl 을 let으로 만들어 놓음.
if (avatar) {
const {
file: { filename, createReadStream },
} = await avatar
//avatar로 부터 filename과 createReadStream을 뽑아냄.
//avatar은 파일임. Altair로 일단 FileUpload 해 봄.
const newFilename = `${loggedInUser.id}-${Date.now()}-${filename}`
//filename 중복되지않게 filename 만들어줌,
const readStream = createReadStream()
const writeStream = fs.createWriteStream(
process.cwd() + '/uploads/' + newFilename
)
///process.cwd()는 project의 맨 윗쪽, server.js가 위치하는 곳
///uploads 폴더에 입력되게 함.
readStream.pipe(writeStream)
avatarUrl = `http://localhost:4000/static/${newFilename}`
//upload위치에 압력된 파일 주소를 avatarUrl에 넣어줌.
}
let uglyPassword = null
if (newPassword) {
uglyPassword = await bcrypt.hash(newPassword, 10)
}
console.log(loggedInUser)
//user의 profile을 update함.
const updatesUser = await prisma.user.update({
where: {
id: loggedInUser.id,
},
data: {
username,
email,
bio,
...(uglyPassword && { password: uglyPassword }),
...(avatarUrl && { avatar: avatarUrl }),
//Es6문법임 확인할 것,
},
})
if (updatesUser.id) {
return {
ok: true,
}
} else {
return {
ok: false,
error: 'Could not update profile',
}
}
}
export default {
Mutation: {
editProfile: protectedResolver(resolveFn),
},
}
- fs 는 fileSystem node에서 파일 관리하는 library임.
3. Altair (fileUpload test)
![](https://velog.velcdn.com/images/jinyinshu/post/8ab628ba-166c-4cd3-b391-707badfc13b8/image.png)
- avatar의 type을 Upload로 확인할 것.
- 맨 밑의 Add files에 avatar를 넣고 file select할 것
3.args 는 VARIABLES에서 넣어주면 됨.