[React] 웹으로 Object detection API 구현하기

 

전에 api를 만들었으니 웹으로 이용해보려고 한다. 참고 : https://dongsu96.tistory.com/148

 

코드

import axios from "axios";
import { useState } from "react";

function Detect(){
    
    let [file, setFile] = useState(null);

    function filefunc(){
        if (file != null){
          const formData = new FormData();
          formData.append("photo", file);
    
          axios.post("URL", formData)
          .then((res) => {
            console.log(res.data);
          })
          .catch((e) => {
            console.log(e);
          })
        } else window.alert("파일 업로드 하고 누르셈");    
    }

    return (
      <div>
        <input type="file" accept="image/*" onChange={(e) => {setFile(e.target.files[0])}}/>
        <div><button onClick={() => filefunc()}>파일 버튼</button></div>
      </div>
    );
}

export default Detect;

 

결과