flask html button to call python function
Question
I'm making a web service using Flask. I want to play the midi file in the flask's static folder on the front-end. Below is part of the app.py code. The function I want to run is a function of the python pygame library and this function plays the midi file. I have implemented the function in background_process_test (). I wrote this code with reference to this post. Flask - Calling python function on button OnClick event
@app.route('/uploader', methods=['GET', 'POST'])
def wav_transform():
if request.method == 'POST':
f = request.files['file']
if(request.form['length']):
random_length = request.form['length']
random_length = int(random_length)
else:
random_length = 100
f.save(f'static/original_song.wav')
...
midi = controller.MakeMidi(random_song, bpm, "static/random.midi")
midi.makemidi()
return render_template('json.html')
@app.route('/background_process_test')
def background_process_test():
pygame.mixer.init()
freq, size, chan = pygame.mixer.get_init()
BUFFER = 3072
filename = "static/random.midi"
pygame.mixer.init(freq, size, chan, BUFFER)
pygame.init()
pygame.mixer.init()
clock = pygame.time.Clock()
pygame.mixer.music.load(filename)
pygame.mixer.music.play()
print("play song")
while pygame.mixer.music.get_busy():
clock.tick(1000)
return "nothing"
Below is the json.html code.
<!DOCTYPE html>
<html>
<head>
<title> play and download </title>
<meta charset="UTF-8">
<style>
li label{
width:121px;
float:center;
font-size:20px;
font-weight:bold;
line-height:25px;
}
body{
backgound-size: cover;
font-family: 'Open Sans', sans-serif;
background: #a27fb2 fixed center;
text-align:center
}
h1, h2, h3, h4, h5, h6{
font-family: 'Montserrat', sans-serif;
margin-top:30px;
background: #fff;
font-size:40px;
color:#a27fb2
}
fieldset{
margin: 40px 15px;
}
li{
list-style-type:none;
color: #fff;
}
button{
width:200px;
background-color:#fff;
border:none;
color:#a27fb2;
padding:10px 0;
text-align:center;
text-decoration:none;
display:inline-block;
font-size:20px;
font-weight:bold;
margin:4px;
cursor:pointer;
}
</style>
</head>
<body>
<fieldset>
<legend> </legend>
<h3>play and download</h3>
<li>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script type=text/javascript>
$(function(){
$('a#test').bind('click', function() {
$.getJSON('/bacground_process_test',
function(data){
// do nothing
});
return false;
});
});
</script>
</li>
<li>
<div class='container'>
<form>
<a herf=# id=test><button class='btn btn-default'>Test<button></a>
</form>
</div>
</li>
</fieldset>
</body>
</html>
To sum up, I want the background_process_test () function to run when the button is clicked on the front-end so that the midi file is played. When I run this code on my local server, the midi file did not play with 127.0.0.1--[13 / Nov / 2019 21:50:56] "GET / bacground_process_test HTTP / 1.1" 404-.
In fact, my purpose is playing a midi file, and I'm trying to do this because it's hard to convert midi files to wav files in Python. Or let me know if there is any other way to play a midi file in Flask's static folder in html.
1 answers
solution1
1 ACCPTED 2019-11-13 13:30:50
You misspelled background . Notice you you wrote bacground_process_test :
$(function() {
$('a#test').bind('click', function() {
$.getJSON('/bacground_process_test', // << HERE
function(data) {
// do nothing
});
return false;
});
});
in the json.html file.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.