Bluemix の flask で、csv をアップロードして表示

参考にしたページ
[Flask にアップロードされたCSVファイルを保存せずに読み込む](http://qiita.com/miyahan/items/7d629d00429c9f032a27)

実行結果

![csv_upload.png](https://qiita-image-store.s3.amazonaws.com/0/179446/f484e654-1cbe-f065-1e29-e6a861068f9d.png)

Bluemix のサンプルに対して変更した部分
welcome.py
requirements.txt
runtime.txt　　　　追加
static/index.html
static/csv_upload.js　　　追加
static/jquery-3.2.1.min.js　　　追加

```py3:welcome.py
# -*- coding: utf-8 -*-
# -----------------------------------------------------------------------
#
#	welcome.py
#
#					Jun/29/2017
#
# -----------------------------------------------------------------------
import os
import io
import csv
from flask import Flask
from flask import jsonify
from flask import request
# -----------------------------------------------------------------------
def to_table_proc(list):
	str_out = ""
	str_out += "<table>"
	for raw in list:
		str_out += "<tr>"
		for col in raw:
			str_out += "<td>" + col + "</td>"
		str_out += "</tr>"
#
	str_out += "</table>"
#
	return str_out
# -----------------------------------------------------------------------
app = Flask(__name__)

@app.route('/')
def Welcome():
	return app.send_static_file('index.html')

# -----------------------------------------------------------------------
@app.route('/upload', methods=['POST'])
def upload_proc():
	filebuf = request.files.get('file_csv')
	text_stream = io.TextIOWrapper(filebuf.stream, encoding='utf-8')
	list = []
	for row in csv.reader(text_stream):
		print (row)
		list.append(row)
	str_out = to_table_proc(list)
	return str_out
#
# -----------------------------------------------------------------------
port = os.getenv('PORT', '5000')
if __name__ == "__main__":
	app.run(host='0.0.0.0', port=int(port))
# -----------------------------------------------------------------------
```

```text:requirements.txt
Flask==0.12.2
requests==2.7.0
```

```text:runtime.txt
python-3.6.0
```

```html:static/index.html
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="static/jquery-3.2.1.min.js"></script>
<script src="static/csv_upload.js"></script>
<title>csv_upload Jun/29/2017</title>
</head>
<body>
<h1>csv_upload</h1>
<blockquote>
	<button class="upload" id="upload">Upload</button><p />
</blockquote>
<div id="contents">contents</div>
<hr />
<div id="outarea_aa">outarea_aa</div>
<div id="outarea_bb">outarea_bb</div>
<div id="outarea_cc">outarea_cc</div>
<div id="outarea_dd">outarea_dd</div>
<div id="outarea_ee">outarea_ee</div>
<div id="outarea_ff">outarea_ff</div>
<div id="outarea_gg">outarea_gg</div>
<div id="outarea_hh">outarea_hh</div>
<hr />
Jun/29/2017 PM 18:41</li>
</body>
</html>
```

```js:csv_upload.js
// -----------------------------------------------------------------------
//	ekzemplaro_hh.js
//
//					Jun/29/2017
//
// -----------------------------------------------------------------------
jQuery (function ()
{
	jQuery("#outarea_aa").text ("*** csv_upload.js *** start ***")

	button_upload_click_proc ()

	jQuery("#outarea_hh").text ("*** csv_upload.js *** end ***")
})

// -----------------------------------------------------------------------
// [4]:
function button_upload_click_proc ()
{
	jQuery ("button.upload").click (function ()
		{
		jQuery ("button").css ("color","black")
		jQuery ("button#" + this.id).css ("color","blue")

		var str_out = ""
		str_out += this.id + " is clicked ***<br />"

		jQuery("#outarea_cc").html (str_out)

		var html = '<form id="uploadForm" class="upload-form" style="display: none;">' + '<input id="theFile" name="file_csv" type="file">' + '</form>'
		jQuery('body').append(html)
		jQuery('#theFile').on('change',uploadFile).click()
		})
}

// -----------------------------------------------------------------------
var uploadFile = function ()
{
	var formData = new FormData(jQuery('#uploadForm')[0])

	jQuery.ajax({
		url: '/upload',
		type: 'post',
		data: formData,
		processData: false,
		contentType: false,
		timeout: 10000
		}).done(function (res) {
			jQuery("#contents").html (res)
			jQuery("#outarea_ee").text ("*** done ***")
			console.log('done')
		}).fail(function () {
			console.log('fail')
		}).then(function () {
			jQuery('#uploadForm').remove()
		})
}

// -----------------------------------------------------------------------
```