본문 바로가기
Python/Machine Learning

Wil - 5week

by K-밍키 2022. 5. 22.

머신러닝을 이용한 웹개발도 궤도에 올라 막바지를 향해 달려가고 있다.


index.html

# main.py 에서 보낸 정보를 출력
function posting() {
        let file = $('#file')[0].files[0]
        //let filename = file['name']
        let form_data = new FormData() // FormData 처럼 보내는 방식
        //form_data.append("f_name", filename)
        form_data.append("file", file)
        console.log(file, typeof (file))
        //console.log(filename, typeof(filename)) // test3.jpg
        if (file.type.match(/image.*/)) {
            $.ajax({ // 비동기 방식
                type: "POST",
                url: "/main/api/img/upload",
                data: form_data,
                contentType: false,
                processData: false,
                success: function (response) {
                    alert(response["result"])
                    change_area_css()
                    predict_path = response["predict_path"]

                    $('#upload_box').css({
                        'height': '400px',
                        'width': '400px',
                        'margin': '5px 10px 5px 10px'
                    });

                    $('#predict_box').css({
                        'height': '400px',
                        'width': '400px',
                        'margin': '5px 10px 5px 10px'
                    });

                    $('#upload_box').attr("src", window.URL.createObjectURL(file));
                    $('#predict_box').attr("src", predict_path)
                    // window.location.reload()
                    results = response["results"]
                    $('#helmet_value').text(results['helmet'])
                    $('#head_value').text(results['head'])
                    $('#score_value').text(results['score'])
                    $('#isPass_value').text(results['isPass'])
                    $('#result_label').text(results['isPass'])
                }
            });
        } else {  // 파일이 이미지가 아닌 경우
            $.ajax({
                type: "POST",
                url: "/main/api/video/upload",
                data: form_data,
                contentType: false,
                processData: false,
                success: function (response) {
                    alert(response['result'])
                    change_area_css()
                    let video_src = response['video']
                    let predict_src = response['predict_path']
                    let upload_temp_html = `<video id="upload_preview" autoplay controls muted preload="auto">
                                            <source src="${video_src}" type="video/mp4">
                                            지원되지 않는 브라우저 입니다.</video>`
                    let predict_temp_html = `<video id="predict_preview" autoplay controls muted preload="auto">
                                            <source src="${predict_src}" type="video/mp4">
                                            지원되지 않는 브라우저 입니다.</video>`
                    $('#upload_div').html(upload_temp_html)
                    $('#predict_div').html(predict_temp_html)

                    $('#upload_preview').css({
                        'height': '400px',
                        'width': '400px',
                        'margin': '5px 10px 5px 10px'
                    });

                    $('#predict_preview').css({
                        'height': '400px',
                        'width': '400px',
                        'margin': '5px 10px 5px 10px'
                    });

                    results = response["results"]
                    $('#helmet_value').text(results['helmet'])
                    $('#head_value').text(results['head'])
                    $('#score_value').text(results['score'])
                    $('#isPass_value').text(results['isPass'])
                }
            })
        }
    }

'Python > Machine Learning' 카테고리의 다른 글

Til - 28day  (0) 2022.05.24
Til - 27day  (0) 2022.05.23
Til - 26day  (0) 2022.05.21
Til - 25day  (0) 2022.05.21
Til - 24day  (0) 2022.05.19