All (114) 썸네일형 리스트형 [React + Spring Boot ] Spring Boot 백엔드를 사용하여 React 앱에서 파일 업로드를 구현하는 방법 React component import React, { useState } from 'react'; const FileUploader = () => { const [file, setFile] = useState(null); const handleFileUpload = async e => { setFile(e.target.files[0]); }; const handleSubmit = async e => { e.preventDefault(); const formData = new FormData(); formData.append('file', file); try { const response = await fetch('http://localhost:8080/upload', { method: 'POST', .. [Google API + Springboot] TTS(Text-to-Speech) 기능을 구현 Spring Boot 응용 프로그램에서 TTS(Text-to-Speech) 기능을 구현하려면 Google Cloud Text-to-Speech API를 사용할 수 있습니다. API는 Google Cloud Console에서 얻을 수 있는 API 키를 사용하여 액세스할 수 있습니다. 1. 다음 종속성을 pom.xml 파일에 추가합니다. com.google.cloud google-cloud-texttospeech 1.0.0 2. 응용 프로그램에서 API 키를 설정합니다. @Value("${google.cloud.api.key}") private String apiKey; @Bean public TextToSpeechClient textToSpeechClient() throws IOException { ret.. [Google API + Springboot] STT(Speech-to-Text) 기능을 구현 Spring Boot 응용 프로그램에서 STT(Speech-to-Text) 기능을 구현하려면 Google Cloud Speech-to-Text API를 사용할 수 있습니다. API는 Google Cloud Console에서 얻을 수 있는 API 키를 사용하여 액세스할 수 있습니다. 1. 다음 종속성을 pom.xml 파일에 추가합니다. com.google.cloud google-cloud-speech 1.105.0 2. 응용 프로그램에서 API 키를 설정합니다. @Value("${google.cloud.api.key}") private String apiKey; @Bean public SpeechClient speechClient() throws IOException { return SpeechClient.. [Google API + Springboot] Google Cloud Translation API 번역 Spring Boot 응용 프로그램에서 Google 번역을 구현하려면 Google Cloud Translation API를 사용할 수 있습니다. API는 Google Cloud Console에서 얻을 수 있는 API 키를 사용하여 액세스할 수 있습니다. 1. 다음 종속성을 pom.xml 파일에 추가합니다. com.google.cloud google-cloud-translate 1.104.0 2. 응용프로그램에 API 키 설정. @Value("${google.cloud.api.key}") private String apiKey; @Bean public Translate translateService() { return TranslateOptions.newBuilder().setApiKey(apiKey).b.. [VUE.JS] Axios를 사용하는 Vue.js의 파일 다운로드 구성 Download downloadFile 메서드는 Axios를 사용하여 /api/download GET 요청을 하고 responseType을 "blob"으로 설정하여 응답에 이진 데이터가 포함됨을 나타냅니다. 그런 다음 서버의 응답을 사용하여 객체 URL을 작성하고, 이는 새로 작성된 요소의 href 속성으로 설정됩니다. 다운로드 특성은 원하는 파일 이름으로 설정되고, 요소는 문서 본문에 추가됩니다. 마지막으로 링크를 클릭하여 다운로드를 시작합니다. [VUE.JS] Axios를 사용하는 Vue.js의 파일 업로드 Upload 선택한 파일로 파일 데이터 속성을 설정하는 setFile 메서드에 바인딩됩니다. uploadFile 메서드는 Axios를 사용하여 FormData 개체의 파일 데이터를 사용하여 /api/upload POST 요청을 수행합니다. 요청 헤더가 "Content-Type": "multipart/form-data"로 설정되어 요청에 이진 데이터가 포함되어 있음을 나타냅니다. 서버의 응답이 콘솔에 기록됩니다. [Node.js] WebRTC 멀티화상채팅 기본 데모소스 const SimplePeer = require("simple-peer"); const express = require("express"); const http = require("http"); const socketio = require("socket.io"); // Initialize Express and HTTP server const app = express(); const server = http.createServer(app); const io = socketio(server); // Serve static files from the "public" directory app.use(express.static("public")); // Keep track of connected clients c.. [SpringBoot] Thumbnailator 라이브러리를 사용하여 Spring Boot 환경에서 이미지 자르기를 구현하는 방법 Thumbnailator 라이브러리를 사용하여 Spring Boot 환경에서 이미지 자르기를 구현하는 방법입니다. import net.coobird.thumbnailator.Thumbnails; import org.springframework.http.HttpStatus; import org.springframework.http.ResponseEntity; import org.springframework.web.bind.annotation.*; import org.springframework.web.multipart.MultipartFile; import java.io.ByteArrayOutputStream; import java.io.IOException; @RestController @RequestM.. 이전 1 2 3 4 5 6 7 ··· 15 다음