「令和」
天皇陛下の生前退位や新元号の事前発表にはさまざまな意見があったものの、
その勢いに便乗して
![図1 Plamo-7.1の新元号対応 図1 Plamo-7.1の新元号対応](/assets/images/lifestyle/serial/01/ganshiki-soushi-2/0009/thumb/TH800_001.jpg)
さて、
Bottleと画像ファイル
Bottleをイジっていて
たとえば、
1 #!/usr/bin/python
2
3 from bottle import route, run, static_file
4 @route('/show/<filename>')
5 def show_img(filename):
6 return static_file(filename, root='./Photo/')
7
8 run(host='localhost', port=8080, reloader=True, debug=True)
表示したい画像ファイルを"img01.
![図2 Bottleでの画像表示例 図2 Bottleでの画像表示例](/assets/images/lifestyle/serial/01/ganshiki-soushi-2/0009/thumb/TH800_002.jpg)
リストの3行目でimportしている"static_
このあたり、
というのも、
さて、
ディレクトリにあるファイルのリストはPythonのos.
1 #!/usr/bin/python
2
3 import os
4 from bottle import route, run
5
6 @route('/show')
7 def show_list():
8 files = os.listdir('./Photo')
9 return (files)
10
11 run(host='localhost', port=8080, reloader=True, debug=True)
このスクリプトを動かして、
![図3 os.listdir()の結果をそのまま表示 図3 os.listdir()の結果をそのまま表示](/assets/images/lifestyle/serial/01/ganshiki-soushi-2/0009/thumb/TH800_003.jpg)
さすがにこれだけでは寂しいので、
1 <P> Photos </P>
2
3 <table>
4 % for i in photos:
5 <tr> <td> {{i}} </td> </tr>
6 % end
7 </table>
スクリプトの方では、
9 return(template('show_list', photos=files))
これでファイル名の一覧が見やすくなりました。
![図4 os.listdir()の結果をtemplate機能で表示 図4 os.listdir()の結果をtemplate機能で表示](/assets/images/lifestyle/serial/01/ganshiki-soushi-2/0009/thumb/TH800_004.jpg)
このファイルリストを、
まず、
1 <P> Photos </P>
2
3 <table>
4 % for i in photos:
5 <tr> <td> <a href="/show/{{i}}"> <img src="/show/{{i}}" width="200"> {{i}} </a> </td> </tr>
6 % end
7 </table>
一方、
1 #!/usr/bin/python
2
3 import os
4 from bottle import route, run, static_file, template
5
6 @route('/show/<filename>')
7 def show_img(filename):
8 return static_file(filename, root='./Photo/')
9
10 @route('/show')
11 def show_list():
12 files = os.listdir('./Photo')
13 return(template('show_list', photos=files))
14
15 run(host='localhost', port=8080, reloader=True, debug=True)
これくらいのコードで、
![図5 画像の一覧表示 図5 画像の一覧表示](/assets/images/lifestyle/serial/01/ganshiki-soushi-2/0009/thumb/TH800_005.jpg)
画像のアップロード
画像の表示ができるようになったので、
ファイルのアップロードは、
前回紹介したように、
15 @route('/upload', method="GET")
16 def upload_file():
17 return '''
18 upload photo
19
20 <form action="/upload" method="POST" enctype="multipart/form-data">
21 <input type="file" name="img_file"> <P>
22 <input type="submit" value="アップロード">
23 </form>
24 '''
25
26 @route('/upload', method="POST")
27 def get_file():
28 upload = request.files.get('img_file')
29 upload.save("./Photo/")
30 return 'Upload OK. FilePath: %s' % (upload.filename)
前半のupload_
後半の処理では、
このコードを先に紹介した画像表示用のスクリプトに追加して、
![図6 ファイルアップロード用の選択ウィンドウ 図6 ファイルアップロード用の選択ウィンドウ](/assets/images/lifestyle/serial/01/ganshiki-soushi-2/0009/thumb/TH800_006.jpg)
このウィンドウでファイルを選択し、
この後、
![図7 一覧リストの更新 図7 一覧リストの更新](/assets/images/lifestyle/serial/01/ganshiki-soushi-2/0009/thumb/TH800_007.jpg)
今回のスクリプトの最終形は以下の通りで、
1 #!/usr/bin/python
2
3 import os
4 from bottle import route, run, static_file, template, request
5
6 @route('/show/<filename>')
7 def server_static(filename):
8 return static_file(filename, root='./Photo/')
9
10 @route('/show')
11 def list():
12 files = os.listdir('./Photo')
13 return(template('show_list', photos=files))
14
15 @route('/upload', method="GET")
16 def upload_file():
17 return '''
18 upload photo
19
20 <form action="/upload" method="POST" enctype="multipart/form-data">
21 <input type="file" name="img_file"> <P>
22 <input type="submit" value="アップロード">
23 </form>
24 '''
25
26 @route('/upload', method="POST")
27 def get_file():
28 upload = request.files.get('img_file')
29 upload.save("./Photo/")
30 return 'Upload OK. FilePath: %s' % (upload.filename)
31
32 run(host='localhost', port=8080, reloader=True, debug=True)
このスクリプトは必要最低限の機能を実装しただけで実用性は低いものの、
今回は画像ファイルをやりとりしたものの、
加えて、
このように、