codedang
codedang copied to clipboard
feat(be): implement image upload
Description
Closes #1495
이미지 업로드 기능을 구현합니다. Problem description에 이미지를 삽입하는 용도로 사용이 가능합니다.
Additional context
- 이미지의 최대 크기는 5MB입니다.
src속성에 업로드된 이미지의 url이 담겨 반환됩니다.img태그의src속성에 넣어 이미지 삽입 기능의 구현이 가능합니다.
참고 스크린샷
Before submitting the PR, please make sure you do the following
- [x] Read the Contributing Guidelines
- [x] Read the Contributing Guidelines and follow the Commit Convention
- [x] Provide a description in this PR that addresses what the PR is solving, or reference the issue that it solves (e.g.
fixes #123). - [ ] Ideally, include relevant tests that fail without this PR but pass with it.
The latest updates on your projects. Learn more about Vercel for Git ↗︎
| Name | Status | Preview | Updated (UTC) |
|---|---|---|---|
| codedang | ✅ Ready (Inspect) | Visit Preview | May 29, 2024 1:23am |
균서님이랑 저랑 branch 전환해서 이미지 파일 바꿔서 시도했는데 아래 에러가 공통적으로 떠서.. 혹시 확인가능하실까요?
{
"errors": [
{
"message": "Cannot return null for non-nullable field Image.src.",
"locations": [
{
"line": 1,
"column": 64
}
],
"path": [
"uploadImage",
"src"
],
"extensions": {
"code": "INTERNAL_SERVER_ERROR",
"stacktrace": [
"Error: Cannot return null for non-nullable field Image.src.",
" at completeValue (/workspace/node_modules/.pnpm/[email protected]/node_modules/graphql/execution/execute.js:605:13)",
" at executeField (/workspace/node_modules/.pnpm/[email protected]/node_modules/graphql/execution/execute.js:500:19)",
" at executeFields (/workspace/node_modules/.pnpm/[email protected]/node_modules/graphql/execution/execute.js:414:22)",
" at completeObjectValue (/workspace/node_modules/.pnpm/[email protected]/node_modules/graphql/execution/execute.js:925:10)",
" at completeValue (/workspace/node_modules/.pnpm/[email protected]/node_modules/graphql/execution/execute.js:646:12)",
" at completeValue (/workspace/node_modules/.pnpm/[email protected]/node_modules/graphql/execution/execute.js:595:23)",
" at /workspace/node_modules/.pnpm/[email protected]/node_modules/graphql/execution/execute.js:497:9",
" at processTicksAndRejections (node:internal/process/task_queues:95:5)",
" at execute (/workspace/node_modules/.pnpm/@[email protected][email protected]/node_modules/@apollo/server/src/requestPipeline.ts:547:31)",
" at processGraphQLRequest (/workspace/node_modules/.pnpm/@[email protected][email protected]/node_modules/@apollo/server/src/requestPipeline.ts:433:26)",
" at internalExecuteOperation (/workspace/node_modules/.pnpm/@[email protected][email protected]/node_modules/@apollo/server/src/ApolloServer.ts:1313:12)",
" at runHttpQuery (/workspace/node_modules/.pnpm/@[email protected][email protected]/node_modules/@apollo/server/src/runHttpQuery.ts:232:27)",
" at runPotentiallyBatchedHttpQuery (/workspace/node_modules/.pnpm/@[email protected][email protected]/node_modules/@apollo/server/src/httpBatching.ts:85:12)",
" at ApolloServer.executeHTTPGraphQLRequest (/workspace/node_modules/.pnpm/@[email protected][email protected]/node_modules/@apollo/server/src/ApolloServer.ts:1087:14)"
]
}
}
],
"data": null
}
균서님이랑 저랑 branch 전환해서 이미지 파일 바꿔서 시도했는데 아래 에러가 공통적으로 떠서.. 혹시 확인가능하실까요?
{ "errors": [ { "message": "Cannot return null for non-nullable field Image.src.", "locations": [ { "line": 1, "column": 64 } ], "path": [ "uploadImage", "src" ], "extensions": { "code": "INTERNAL_SERVER_ERROR", "stacktrace": [ "Error: Cannot return null for non-nullable field Image.src.", " at completeValue (/workspace/node_modules/.pnpm/[email protected]/node_modules/graphql/execution/execute.js:605:13)", " at executeField (/workspace/node_modules/.pnpm/[email protected]/node_modules/graphql/execution/execute.js:500:19)", " at executeFields (/workspace/node_modules/.pnpm/[email protected]/node_modules/graphql/execution/execute.js:414:22)", " at completeObjectValue (/workspace/node_modules/.pnpm/[email protected]/node_modules/graphql/execution/execute.js:925:10)", " at completeValue (/workspace/node_modules/.pnpm/[email protected]/node_modules/graphql/execution/execute.js:646:12)", " at completeValue (/workspace/node_modules/.pnpm/[email protected]/node_modules/graphql/execution/execute.js:595:23)", " at /workspace/node_modules/.pnpm/[email protected]/node_modules/graphql/execution/execute.js:497:9", " at processTicksAndRejections (node:internal/process/task_queues:95:5)", " at execute (/workspace/node_modules/.pnpm/@[email protected][email protected]/node_modules/@apollo/server/src/requestPipeline.ts:547:31)", " at processGraphQLRequest (/workspace/node_modules/.pnpm/@[email protected][email protected]/node_modules/@apollo/server/src/requestPipeline.ts:433:26)", " at internalExecuteOperation (/workspace/node_modules/.pnpm/@[email protected][email protected]/node_modules/@apollo/server/src/ApolloServer.ts:1313:12)", " at runHttpQuery (/workspace/node_modules/.pnpm/@[email protected][email protected]/node_modules/@apollo/server/src/runHttpQuery.ts:232:27)", " at runPotentiallyBatchedHttpQuery (/workspace/node_modules/.pnpm/@[email protected][email protected]/node_modules/@apollo/server/src/httpBatching.ts:85:12)", " at ApolloServer.executeHTTPGraphQLRequest (/workspace/node_modules/.pnpm/@[email protected][email protected]/node_modules/@apollo/server/src/ApolloServer.ts:1087:14)" ] } } ], "data": null }
아마 일건님이 추가로 작업하신 내용과 관련해서 문제가 있을 것 같은데, 제가 아직 코드를 정리를 하지 못해서 확인 후 수정하고 나서 다시 알려드리겠습니다!
Images automagically compressed by Calibre's image-actions ✨
Compression reduced images by 25.2%, saving 19.63 KB.
| Filename | Before | After | Improvement | Visual comparison |
|---|---|---|---|---|
backend/apps/admin/src/problem/mock/sample.png |
77.86 KB | 58.24 KB | -25.2% | View diff |
19 images did not require optimisation.
@cho-to 오류 해결 되었습니다~
#1536 PR에서 AWS 에 S3 bucket 생성할 수 있도록 코드 작성해놨습니다. 나중에 머지할 때 #1536번 먼저 머지하고 나서 해당 PR 머지할 수 있도록 확인부탁드려요!
- 머지되는대로 다시 커멘트 남길게요!
머지하기전에 백엔드채널이나 공지?..일반?..에 백엔드 서버 실행시키전에 Rebuild 해야하는거 공지하면 더 좋을 듯 함다
@cho-to 넵 남기고 머지할게요~