Flaskでの変数の扱い方とHTMLファイルの位置について

前提・実現したいこと

ソケット通信で外部から取得した数値を変数に格納し、Flaskを使いHTML上にその数値を表示させたいです。

該当のソースコード

Python
1from flask import *  # 必要なライブラリのインポート
2
3
4comand = "あいうえお"　#ソケット通信コード抜きで実行するとき
5
6app = Flask(__name__)  # アプリの設定
7
8
9@app.route("/")  # どのページで実行する関数か設定
10def index():
11    return render_template("index.html", comand=comand)
12
13
14
15if __name__ == "__main__":  # 実行されたら
16    app.run(debug=False, host='localhost', port=9999)  # debug=False でRestartingを無効にする

Python
1import logging
2import socket
3import webbrowser
4
5webbrowser.open_new('https://docs.python.org/ja/3/library/index.html') # ブラウザーに接続
6
7logging.basicConfig(level=logging.DEBUG, format='%(threadName)s: %(message)s')
8host_ip = '192.168.24.204'   # PLCのIPアドレス 
9host_port = 8501            # 上位リンク通信のポート番号(デフォルト値)
10
11logging.debug('start')
12client = socket.socket(socket.AF_INET, socket.SOCK_STREAM)
13# socket.AF_INETでip4を使うことを指定。socket.SOCK_STREAMでTCPを使うことを指定。
14
15try:
16        #クライアント接続
17        client.connect((host_ip,host_port))    # サーバーに接続(kv-7500にTCP接続/上位リンク通信)
18except:
19        print("PLC接続NG")
20
21
22
23        
24
25comand = "RD DM1016.D\r"               # 上位リンク通信のコマンド（データ読み出しコマンド、左から順に、読み出しコード、IOの番号、？。
26                                       # DM1016:生産数日
27                                       
28#comand = "RDS DM53000.D 2\r"          # 上位リンク通信のコマンド（データ連続読み出しコマンド） 
29
30
31                                       #[.D]⇒±10進数32BIT表示・・・返り値は10桁の0埋め数値
32
33client.send(comand.encode("ascii"))    # 上位リンク通信のデータコードがASCIIなのでエンコード　
34                                       # ASCII：文字コード
35                                       # comand を　ASCII にエンコード
36                                       # エンコード：他の形式に変換すること
37print("send : " + comand)
38
39response = client.recv(64)             # 受信用バイト配列を定義しておく
40response = response.decode("UTF-8")    # PLCからの返答がbyteデータなのでUTF-8にデコード
41                                       # UTF-8: 文字コード　ASCIIよりデータサイズが小さい
42                                       # デコード：エンコードされたものをもとの形式に戻すこと
43        
44client.close()
45    
46print("Received :" ,response)
47logging.debug('end')
48

HTML
1<!doctype html>
2
3<html lang="ja">
4	<head>
5		<meta charset="utf-8">
6		<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
7		<title>{{ comand }}</title>
8	</head>
9	<body>
10		<h1>生産数{{ comand }}</h1>
11	</body>
12</html>

flask/
     templates/
          index.html
     app.py
     app.pyproj
     app.sln

試したこと

ソケット通信のコード抜きで、comandという変数を数字や文字式で定義しても、ローカルサーバが読み込まれなかったり、サーバーエラー、また”例外がスローされました”表示されます。

デバック、実行こそ問題なくできるものの、コマンドプロンプト上で表示されるローカルホストのURLをブラウザに入れてみると、以下のエラーが表示されます。

index.htmlについて"例外がスローされました"

ソケット通信のコードのみで実行した場合はcomand内の数字はコマンドプロンプト上に正しく表示されます。

quickquip

2020/10/13 05:16 編集

> 変数が宣言されていないと表示されますなにをしたとき、どこに、どんなメッセージが表示されるのでしょうか? この書き方では"変数が宣言されていない"と日本語で出ているように読めますが本当にそうですか? 質問を編集して記載してください。

行動規範の内容に同意します

回答1件

index1.htmlを表示するときにmain()およびindex()では、aを渡しています。
jinja2テンプレート(index1.html)ではマスタッシュ記法を用いる事によりaを使用することが可能です。

    {{ a }}

ブラウザ上で変数を扱うというのが、例えばChromeの開発者ツールなどを使ってJavaScriptの変数として扱いたいという意味である場合は、jinja2テンプレート(index1.html)内で変数を宣言し、aの値を代入してください。

let a = {{ a }}

2020/10/16 09:25追記

追加されたエラーについての回答。

エラーについて質問するときは、「エラーメッセージを省略せず全文を記載」してください。

エラーメッセージとPythonコード、ディレクトリ構成を確認しました。
エラーメッセージ全文がないので詳細は不明ですが、たぶんindex1.htmlが無いのが原因で表示できていません。

return render_template("index1.html", comand=comand)
templatesにあるのは、index.htmlだけです。
index1.htmlは存在しません。

投稿2020/10/14 00:14

編集2020/10/16 00:28

FiroProchainezo

総合スコア2424

akirabrian67

2020/10/14 03:16

内容不足が過ぎました、すみません。 Pythonの中で外部からの受け取った値を変数に入れ、それをブラウザ画面に表示したい次第です。一定時間で画面の数字が最新のものに更新される仕組みです。

FiroProchainezo

2020/10/14 04:03

コメントありがとうございます。コメント内容を確認いたしましたが、回答に不足があったのか判断できません。外部から受け取った、とありますが、どのように受け取るのでしょうか？質問文にあるsocket通信でしょうか？ socket通信を書いている場所に`print('test print')`などの処理を書いていただければわかると思いますが、この部分は`/`や`/index`にアクセスした時に実行されず、開発用サーバが実行された時に実行されるようですが、認識はあっていますでしょうか？各アクセス毎に処理を実行する必要があるなら、関数にして呼び出す等の対応が必要と思います。一定時間で画面の数字が最新のものに変更されるような仕組みはみあたりませんが、別途実装されているということでしょうか？また、念のため確認ですが、マスタッシュ記法は半角で記載する必要があります。 `｛｛a｝｝`は全角ですが、大丈夫ですか？さらに言えば `comand = "RD DM1016.D\r"` と `return render_template("index1.html", a=command)`では変数名が異なります。スペルミス等ありませんか？

akirabrian67

2020/10/14 19:10

はい、その通りです。ですが実験として、ソケット通信の記述をすべてコメントアウトし、comand = 1　や　”あいうえお”など適当なものにしても表示できませんでした。 Python内にて、ソケット通信で取得した値をそのまま@app以下で使うことはできないということでしょうか？最新のものに変更される仕組みは繰り返し処理でのちに追加する予定です。一部スペルミスがありましたが、訂正してもうまくいきません。。。

FiroProchainezo

2020/10/15 00:13

うまくいかないとおっしゃっていますが、何がどうなっているのか，質問文からもコメントからもわかりません。 `command = "RD DM1016.D\r" `の内容がhtmlで表示可能なことは確認しました。 comandの中身を変えても表示できないとおっしゃっていますが、表示できるので何か間違っているのだと思います。現象が再現する最小限のソースコードを追加してください。 pythonコードだけでなく、htmlのコードとディレクトリ構成が必要です。ソケット通信については、そのコードが正常に動作するなら、起動時に実行されて値が入っていると思いますので、その値は使用可能です。関数にして～～というのは毎回ソケット通信して値を取得したい場合の話です。そのソケット通信部分だけのpythonコードを作成し、responseに値が入るのを確認しましたか？ responseは2回書き換えていますが、akirabrian67さんが考えた通りの動作ですか？

akirabrian67

2020/10/15 19:10

ソケット通信のみでは正しく値が入っているようです。 responseは考えた通りの動作です。上から順にFlaskのコード、ソケット通信のコード、HTMLのコード、ディレクトリ構成となっております。 Flaskのコード内にソケット通信のコードを加えた際に”試したこと”で記述した内容のエラーが表示されます。非常に手間をかけさせてしまい申し訳ありません。どうか再度ご教示のほどよろしくお願いいたします。

akirabrian67

2020/10/16 09:38

html1をhtmlに変更して実行しましたが、以前上記のエラーが表示されます。 html という表記の部分について”例外がスローされました”と表示されます。これはエラーなのでしょうか。これ以外のエラーのような表示は出ていません。

dodox86

2020/10/17 05:20

flaskのメインのPythonスクリプトで、 def index(): return render_template('index.html', comand=comand) の部分がありますが、comand=comand とのように、comandを介してテンプレートにに渡す値がセットされていないように思います。 render_template('index.html', comand='test') などとすればindexのレンダリング時の例外は消えるなど、進展があるのではないですか。それとどうでも良いですが、コマンドの正しいつづりは command ですね。

dodox86

2020/10/17 05:27

comand="あいうえお"とはセットしているのですね。であれば私の指摘は間違いかもしれませんね。そうであれば失礼しました。

FiroProchainezo

2020/10/19 00:18

実行環境を追い得ていただけますか？どのように実行しているか(実行コマンド)も追記ください。また、html1をhtmlに変えてというのに認識の違いがあると問題なので、そのときの実行可能なコードに質問のコードを書き換えていただけますか。

dodox86

2020/10/19 04:24

@FiroProchainezoさん質問者さんが最終的にやりたいことは、次の質問で解決されたようです。それがFiroProchainezoさんの依頼内容に応えるものかどうか分かりませんが、ご案内しておきます。 https://teratail.com/questions/298552

FiroProchainezo

2020/10/19 05:48

@dodox86さんわざわざありがとうございます。解決したならよかったです。