1,前端
<template>
<div>
<div>
<input type="file" @change="handleFileUpload">
<button @click="uploadFile">Upload</button>
</div>
</div>
</template>
<script>
import axios from "axios";
export default {
name:'uploadTest2',
methods: {
handleFileUpload(event) {
this.selectedFile = event.target.files[0];
},
uploadFile() {
const formData = new FormData();
formData.append('img', this.selectedFile);
console.log('formdata---->',formData)
axios.post('http://127.0.0.1:8081', formData)
.then(response => {
console.log(response.data);
})
.catch(error => {
console.error(error);
});
}
},
data() {
return {
selectedFile: null
};
}
}
</script>
2,后端
import os
from flask_cors import CORS
from flask import Flask, request
app = Flask(__name__)
CORS(app)
@app.route('/', methods=['POST'])
def hello():
img = request.files['img']
upload_dir = './uploads'
os.makedirs(upload_dir, exist_ok=True)
img.save(os.path.join(upload_dir, img.filename))
return 'Upload success!'
if __name__ == '__main__':
app.run(port=8081)

