전체 글

공개/기록하기

postgresql db 백업 쉘 작성, 크론 탭에 등록하기

자꾸 까먹어서 적어두는 postgresql db 백업하는 쉘을 크론탭에 등록하는 방법 postgres 계정으로 접속한다.원하는 경로에 폴더를 만든다.mkdir /var/lib/postgresql/backups쉘 작성할 경로로 이동한다.cd /var/lib/postgresqlvi backup.sh#!/bin/bash#백업 경로와 현재 시간, 백업할 파일 이름BACKUP_DIR="/var/lib/postgresql/backups"CURRENT_DATETIME=$(date +%Y%m%d_%H%M%S)BACKUP_FILE="$BACKUP_DIR/backup_$CURRENT_DATETIME.sql"#PostgreSQL 데이터베이스 백업 실행pg_dump -d [데이터베이스이름] > "$BACKUP_FILE"#30..

공개/Spring

Swagger 접속시 오류

최근 개인 프로젝트를 진행중인데, swagger를 사용하다가 자꾸 오류가 났다. 찾아보니 너무 단순한 문제였지만 삽질을 하고 있는 누군가에게 도움이 되길 바라며 ...ㅜ 사이트 접속시 오류 Failed to load API definition Errors : Fetch error undefined http://localhost:8080/v3/api-docs SecurityConfig 에 경로 허용을 해주면 된다 .antMatchers("/swagger-ui/**", "/swagger-ui.html", "/swagger-resources/**", "/v3/api-docs", "/v3/api-docs/**").permitAll()

공개/Spring

[Springboot] S3 파일 업로드

2023.05.22 - [JavaScript/Node] - [Node.js] AWS S3에 presigned Url을 받아 업로드하기 [Node.js] AWS S3에 presigned Url을 받아 업로드하기 아직 s3 버킷을 만들지 않았다면 만들고 오세요! 2023.05.22 - [AWS] - [S3] S3란? 버킷 생성 후 정책 설정하기 [S3] S3란? 버킷 생성 후 정책 설정하기 S3 (Simple Storage Service) AWS S3는 업계 최고의 확장성과 데 kimwonny.tistory.com 이전에 Node.js 버전을 업로드했는데, springboot 에서는 아래와 같이 작성했다. 일단 스프링과 S3를 연동한다. 의존성 추가 implementation 'org.springframew..

공개/JavaScript

[JavaScript] Base64 To Blob

얼마전 toast-ui editor에서 이미지를 blob으로 변환해 s3에 업로드 했었다. 왜 변환해서 저장하는지 더 알아보고 추가적인 기록을 하고자 한다. 2023.05.22 - [JavaScript/Vue] - toast-ui/vue-editor 사용 시, 파일을 S3에 업로드하기 🤔 Base64 -> Blob으로 변환하는 이유 Base64 를 Blob으로 변환하여 저장하는 방법은 데이터 전송, 데이터 저장, 웹에서의 이미지 표시 등에 유용하다. 데이터 전송: Base64는 이진 데이터를 텍스트로 변환하여 전송할 수 있으므로, 텍스트 기반 시스템에서 이진 데이터를 처리할 수 있게 한다. 데이터 저장: 일부 시스템은 텍스트 형식으로 데이터를 저장하는 것을 선호하며, Base64를 사용하여 이진 데이터를..

공개/Spring

[Springboot] CORS 설정시 Mapping 관련 오류

예전 자료를 보면서 spring security랑 jwt 토큰 공부중에 발생한 오류가 있었다. allowedOrigins 에러 java.lang.IllegalArgumentException: When allowCredentials is true, allowedOrigins cannot contain the special value "*" since that cannot be set on the "Access-Control-Allow-Origin" response header. To allow credentials to a set of origins, list them explicitly or consider using "allowedOriginPatterns" instead. 스프링부트에서 CORS 설정..

공개/Vue

toast-ui/vue-editor 사용 시, 파일을 S3에 업로드하기

프로젝트 진행 중, 마크다운 에디터로 toast-ui/vue-editor를 사용하고 있는데, 해당 에디터에서 사진 파일 업로드 시 Base64 형태로 반환된다. Base64 이라 길이가 엄청 길기 때문에, s3에 업로드하고 해당 url을 content에 저장하는 방법으로 변경하였다. 이렇게 엄청 길게 들어가게 돼서, 조금만 용량 큰 사진을 업로드하면 아래와 같이 413 오류가 떴다. 그래서 변경한 방법 Vue.js와 Toast UI Editor를 사용하는 경우엔 바로 hooks 옵션을 주니 인식이 되지 않아서 이런식으로 options 에서 hooks 메소드를 추가했다. ( Toast UI Editor는 Vue.js와 함께 사용될 때, 옵션을 정의하기 위해 `options` 객체를 사용한다고 함) 해당 위..

공개/Node

[Node.js] AWS S3에 presigned Url을 받아 업로드하기

아직 s3 버킷을 만들지 않았다면 만들고 오세요! 2023.05.22 - [AWS] - [S3] S3란? 버킷 생성 후 정책 설정하기 [S3] S3란? 버킷 생성 후 정책 설정하기 S3 (Simple Storage Service) AWS S3는 업계 최고의 확장성과 데이터 가용성 및 보안과 성능을 제공하는 온라인 오브젝트(객체) 스토리지 서비스이다. 쉽게 말하자면, 스토리지 즉 구글 드라이브 처럼 파 kimwonny.tistory.com presigned Url? 클라이언트는 서버로부터 사전 서명된 업로드 URL을 요청합니다. 서버는 이 요청을 S3로 전달합니다. S3는 새로운 사전 서명된 URL을 서버에 반환합니다. 서버는 사전 서명된 URL을 클라이언트에 반환합니다. 사용자는 컴퓨터에서 파일을 선택하..

공개/기록하기

[S3] S3란? 버킷 생성 후 정책 설정하기

S3 (Simple Storage Service) AWS S3는 업계 최고의 확장성과 데이터 가용성 및 보안과 성능을 제공하는 온라인 오브젝트(객체) 스토리지 서비스이다. 쉽게 말하자면, 스토리지 즉 구글 드라이브 처럼 파일 저장 서비스이며, 데이터를 온라인으로 오브젝트형태로 저장하는 서비스라고 보면 된다. S3을 사용하는 이유 S3는 저장 용량이 무한대이고 파일 저장에 최적화되어 있다. 용량을 추가하거나 성능을 높이는 작업이 필요없다. 비용은 EC2와 EBS로 구축하는 것보다 훨씬 저렴하다 S3 자체가 수천 대 이상의 매우 성능이 좋은 웹 서버로 구성되어 있어서 EC2와 EBS로 구축했을 때 처럼 Auto Scaling이나 Load Balancing에 신경쓰지 않아도 된다. 웹하드 서비스와 비슷하지만,..

공개/Spring

[SpringBoot] FormData로 받은 이미지 로컬에 저장하기

2023.02.17 - [JavaScript/Vue] - [Vue.js] Axios를 이용해 FormData 이미지 보내기 [Vue.js] Axios를 이용해 FormData 이미지 보내기 현재 vue.js 와 springboot 를 통신 중인데, 이미지 업로드를 시도하고 있다. form으로 전체를 감싸는 것 말고, 폼 데이터로 보내는 법을 기록해보겠다! vue.js 사진: @change 를 활용해 input을 했을 때 setPhot wonny.kim Springboot @PostMapping(value = "/image", consumes = {MediaType.MULTIPART_FORM_DATA_VALUE}) public @ResponseBody String addPhoto(@RequestParam(..

공개/기록하기

[AWS S3] html2canvas 사용 중 s3 url 일 때 생성 안되는 오류 해결

최근 캡스톤과 개인프로젝트, 자격증 시험 등 여러 핑계로 블로그 업로드를 미뤘는데 프로젝트 진행 중 이슈를 해결하며, 이 내용을 기록해 두면 다른 사람들에게도 도움이 되지않을까 싶어서 기록해본다! html2canvas 사용 중 s3 url 일 때 생성 안되는 오류 계속 s3 url이 src인 이미지만 썸네일에 포함 안되는 오류가 있었다 html2canvas(imageArea, { useCORS: true }).then(canvas => { 추가하고 img.crossOrigin = 'anonymous'; 추가! canvas() { try { const imageArea = this.$refs.dragImage; html2canvas(imageArea, { useCORS: true }).then(canvas..

잔망짱구
Devlog