質問編集履歴

2 連絡

namnium1125

namnium1125 score 1849

2017/09/09 00:37  投稿

python3 cgiとAjaxの連携でプログレスバーを表示したい
お世話になります。
python3 http.serverを使ってwebアプリケーションを作っていました。
レスポンスに時間が掛かる処理だったので、途中でプログレスバーを表示して残り時間がわかるようにしようと思い、非同期通信を利用しようと考えました。
しかしpythonスクリプトの方で、どうやってレスポンスを複数回返すかわからず、詰まっています。どうすればいいのでしょうか?
print関数で返そうと思うと、スクリプト内のprintすべてが実行されるまで結果が返りません。
なにかいい方法はあるのでしょうか?
進捗は、当然ですがpythonスクリプト側が把握しているものとします。
以下適当ですが私が書いてみたスクリプト群です。やりたいことが伝わるといいのですが。。(^ ^;
/
├── cgi-bin
│   └── count.py
├── index.html
└── server.py
index.html
```lang-html
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Progress By Ajax</title>
<script>
var request = new XMLHttpRequest();
var progress;
var percent;
var start;
if(request){
 window.addEventListener("load",function(e){
   progress = document.getElementById("prog");
   //↓最終的にはこっちで出力したい
   percent = document.getElementById("percent");
   start = document.getElementById("start");
   //↓とりあえずこっちに出力
   disp1 = document.getElementById("disp1");
   disp2 = document.getElementById("disp2");
   start.addEventListener("click",function(e){
     var url = "/cgi-bin/count.py"
     request.open("GET",url,true);
     request.onreadystatechange = function(){
       disp1.innerHTML = "readyState : " + request.readyState + "<br />status : " + request.status;
       // ↓今後isNaNで場合分けして、falseならprogressを進め、trueならhtmlを出力
       disp2.innerHTML = request.responseText;
     }
     request.send(null);
   },false);
 },false);
}
</script>
</head>
<body>
<progress max="100" value="0" id="prog"></progress>
<span id="percent">0</span>%
<br />
<button id="start">start</button>
<br />
<br />
<div id="disp1"></div>
<br />
<br />
<div id="disp2"></div>
</body>
</html>
```
server.py
```lang-python
import http.server
import traceback
try:
   server_address = ("", 8000)
   handler_class = http.server.CGIHTTPRequestHandler
   handler_class.cgi_directories = ["/cgi-bin"]
   server = http.server.HTTPServer(server_address, handler_class)
   server.serve_forever()
except:
   traceback.print_exc()
```
/cgi-bin/count.py
```lang-python
#!/usr/bin/env python3
# -*- coding: utf-8 -*-
from time import sleep
# ↓途中で出力はしてくれない?
for i in range(100):
   print(i+1)
   sleep(1)
print("Content-type: text/html;charset=utf-8\n")
print("<!doctype html><html><body>done.</body></html>")
```
わかりにくい質問ですみません。。
回答よろしくお願いします。m(_ _)m
回答よろしくお願いします。m(_ _)m
##追記
自分で解法を模索しているうちに、同内容で別な疑問が出てきましたので、
改めてそちらのほうで質問したいと思います。
よろしくお願いします。m(_ _)m
  • Ajax

    1420 questions

    Ajaxとは、Webブラウザ内で搭載されているJavaScriptのHTTP通信機能を使って非同期通信を利用し、インターフェイスの構築などを行う技術の総称です。XMLドキュメントを指定したURLから読み込み、画面描画やユーザの操作などと並行してサーバと非同期に通信するWebアプリケーションを実現することができます。

  • Python 3.x

    11274 questions

    Python 3はPythonプログラミング言語の最新バージョンであり、2008年12月3日にリリースされました。

1 タグを追加しました。

namnium1125

namnium1125 score 1849

2017/09/02 19:54  投稿

python3 cgiとAjaxの連携でプログレスバーを表示したい
お世話になります。
python3 http.serverを使ってwebアプリケーションを作っていました。
レスポンスに時間が掛かる処理だったので、途中でプログレスバーを表示して残り時間がわかるようにしようと思い、非同期通信を利用しようと考えました。
しかしpythonスクリプトの方で、どうやってレスポンスを複数回返すかわからず、詰まっています。どうすればいいのでしょうか?
print関数で返そうと思うと、スクリプト内のprintすべてが実行されるまで結果が返りません。
なにかいい方法はあるのでしょうか?
進捗は、当然ですがpythonスクリプト側が把握しているものとします。
以下適当ですが私が書いてみたスクリプト群です。やりたいことが伝わるといいのですが。。(^ ^;
/
├── cgi-bin
│   └── count.py
├── index.html
└── server.py
index.html
```lang-html
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Progress By Ajax</title>
<script>
var request = new XMLHttpRequest();
var progress;
var percent;
var start;
if(request){
window.addEventListener("load",function(e){
progress = document.getElementById("prog");
//↓最終的にはこっちで出力したい
percent = document.getElementById("percent");
start = document.getElementById("start");
//↓とりあえずこっちに出力
disp1 = document.getElementById("disp1");
disp2 = document.getElementById("disp2");
start.addEventListener("click",function(e){
var url = "/cgi-bin/count.py"
request.open("GET",url,true);
request.onreadystatechange = function(){
disp1.innerHTML = "readyState : " + request.readyState + "<br />status : " + request.status;
// ↓今後isNaNで場合分けして、falseならprogressを進め、trueならhtmlを出力
disp2.innerHTML = request.responseText;
}
request.send(null);
},false);
},false);
}
</script>
</head>
<body>
<progress max="100" value="0" id="prog"></progress>
<span id="percent">0</span>%
<br />
<button id="start">start</button>
<br />
<br />
<div id="disp1"></div>
<br />
<br />
<div id="disp2"></div>
</body>
</html>
```
server.py
```lang-python
import http.server
import traceback
try:
server_address = ("", 8000)
handler_class = http.server.CGIHTTPRequestHandler
handler_class.cgi_directories = ["/cgi-bin"]
server = http.server.HTTPServer(server_address, handler_class)
server.serve_forever()
except:
traceback.print_exc()
```
/cgi-bin/count.py
```lang-python
#!/usr/bin/env python3
# -*- coding: utf-8 -*-
from time import sleep
# ↓途中で出力はしてくれない?
for i in range(100):
print(i+1)
sleep(1)
print("Content-type: text/html;charset=utf-8\n")
print("<!doctype html><html><body>done.</body></html>")
```
わかりにくい質問ですみません。。
回答よろしくお願いします。m(_ _)m
  • Python 3.x

    11274 questions

    Python 3はPythonプログラミング言語の最新バージョンであり、2008年12月3日にリリースされました。

  • Ajax

    1420 questions

    Ajaxとは、Webブラウザ内で搭載されているJavaScriptのHTTP通信機能を使って非同期通信を利用し、インターフェイスの構築などを行う技術の総称です。XMLドキュメントを指定したURLから読み込み、画面描画やユーザの操作などと並行してサーバと非同期に通信するWebアプリケーションを実現することができます。

思考するエンジニアのためのQ&Aサイト「teratail」について詳しく知る