前端上传视频后端python接收并返回视频链接

山下人394

已于 2024-04-09 18:36:10 修改

阅读量584

点赞数 3

CC 4.0 BY-SA版权

分类专栏：前后端交互文章标签：前端音视频 python javascript flask pip

于 2024-04-09 18:35:07 首次发布

本文链接：https://blog.youkuaiyun.com/qq_68410134/article/details/137562797

文章详细描述了如何在前端使用JavaScript库axios进行文件上传，配合后端PythonFlask框架处理视频文件上传、验证格式并存储，以及提供视频URL。同时涉及CORS跨域资源共享设置。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

前端代码：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Video File Upload</title>
    <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
</head>
<body>
    <form id="video-upload-form">
        <input type="file" id="video-file-input" accept="video/*">
        <button type="button" onclick="uploadVideo()">Upload Video</button>
    </form>
    <script>
        async function uploadVideo() {
            const inputElement = document.getElementById('video-file-input');
            const file = inputElement.files[0];
            const formData = new FormData();
            formData.append('video_file', file);
            try {
                const response = await axios.post('服务器IP/upload', formData, {
                    headers: {
                        'Content-Type': 'multipart/form-data'