반응형 JavaScript12 [Javascript] input type="file"에 이미지 파일 업로드 계획 및 목표사진 사용 이미지를 단순히 태그에 미리보기 형식으로 보여주는 것뿐만 아니라, 이미지가 input type="file" 요소에 업로드된 것처럼 처리해야 합니다. 기본적으로 input type="file은 readonly 속성을 가지고 있어 직접적으로 파일을 선택할 수 없습니다 이미지 파일 경로를 Blob으로 변환하여 input type="file" 요소에 업로드된 파일처럼 처리하는 방식으로 구현하겠습니다. 궁극적으로 이 코드에서는 업로드 하기 위해선 selectImage 변수에 이미지를 File객체로 넣어야 합니다. 이미지 경로 to File객체function urlToFile(url, filename, mimeType) { return fetch(url) .then(.. 2024. 10. 20. [Vue] Vite 환경 변수 + axios전역 설정으로 개발/배포 URL 구분하기 Vite Proxy https://ko.vitejs.dev/config/server-options.html#server-proxy Vite Vite, 차세대 프런트엔드 개발 툴 ko.vitejs.dev vite.config.js export default defineConfig({ plugins: [vue()], server: { proxy: { '/api': { target: 'http://localhost:8080', changeOrigin: true, } } } }) server.proxy를 사용해서 /api/~ 요청시 서버 URL로 요청하게 설정 했지만 빌드했을때는 localhost가 아닌 배포된 서버 URL로 요청해야 합니다. 그래서 Vite에서 제공하는 Proxy 방법말고 다른 방법으로 설정하.. 2024. 3. 13. [Firebase] Functions private key 에러(deploy 실패) 문제 발생 firebase functions deploy에 실패했습니다. firebase deploy --only functions --debug 원인을 알기 위해 debug 모드로 Firebase Functions를 배포해봅니다. Function failed on loading user code. This is likely due to a bug in the user code. Error message: Provided module can't be loaded.\nIs there a syntax error in your code?\nDetailed stack trace: Error: Failed to parse private key: Error: Invalid PEM formatted message.\.. 2023. 12. 11. [NestJS]TypeORM과 DB 컬럼 명명 규칙 기존 Entitynotice.entity.ts@Entity() export class Notice extends BaseEntity { @PrimaryGeneratedColumn() wr_no: number; @Column() wr_category: string; @Column() wr_subject: string; @Column() wr_content: string; @Column() wr_hit: number; @ManyToOne((type) => Member, (wr_writer) => wr_writer.mb_boards, { eager: false, }) wr_writer: Member; @Column() wr_date: Date; }간단한 게시판 Entity를 만들었습니다 TypeORM을 사용해.. 2023. 9. 21. [Javascript] 원시타입 & 참조타입 (Primitive & Reference) 비교 var value1 = 1234; // Primitive data type - 변수에 값이 그대로 저장 var array1 = [1, 2, 3]; // Array, Object는 변수에 reference가 저장 Primitive data type과 Reference data type라는게 있습니다. Primitive data type var name1 = '김'; var name2 = name1; // 복사 name1 = '박'; name1에 값을 넣고 name2 = name1을 하면 name2에도 같은 '김'이라는 데이터가 들어가겠죠 이때 name1을 '박'으로 바꾸고 name1과 name2를 모두 출력 해보겠습니다. name1은 마지막에 '박'으로 값을 바꿔서 '박'이라고 출력되는데 name2는 값을.. 2023. 2. 17. summernote.js 용량 제한 수정 callbacks : { onImageUpload: function (files) { /** upload start */ var maxSize = 5 * 1024 * 1024; // limit =5MB // TODO: implements insert image var isMaxSize = false; var maxFile = null; for (var i = 0; i maxSize) { isMaxSize = true; maxFile = files[i].name; break; } //sendFile(files[i], this); } if (isMaxSize) { /.. 2023. 1. 9. 이전 1 2 다음 반응형