スイッチを押したら、HTML上にONOFFを表示させる

前提・実現したいこと

ラズパイのGPIOにスイッチを取り付け、押しているときに
HTML上にON, 押さないときには、OFFを表示させたいです。

現在、スイッチをおしても、ONに切り替わりません。

該当のソースコード

FLASK
1from flask import Flask,render_template,request
2app = Flask(__name__)
3
4
5import RPi.GPIO as GPIO             
6import time                         
7import sys                          
8
9
10
11#GPIOの設定
12GPIO.setmode(GPIO.BCM)                  #GPIOのモードを"GPIO.BCM"に設定
13GPIO.setup(Sw_pin, GPIO.IN)             #GPIO23を入力モードに設定する
14
15@app.route("/")
16@app.route("/index")
17def index_render():
18        digi = 0
19        return render_template("index.html",digi=digi)
20
21def switch_checker():
22        while True:
23                if GPIO.input(23) == GPIO.HIGH:
24                        digi = 1
25                        return render_template("index.html",digi=digi)
26
27if __name__ == "__main__":
28    app.run(debug=True)
29

HTML
1<!DOCTYPE html>
2<html>
3    <head>
4        <title></title>
5    </head>
6    <body>
7        <p>Hello</p>
8        {% if digi==0 %}
9        <p>OFF</p>
10        {% elif digi==1 %}
11        <p>ON</p>
12        {% else %}
13        {% endif %}
14    </body>
15</html>

よろしくお願いいたします。

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

回答1件

switch_checker()はどこからも呼び出されていないので、変わりようがありません。

Web側で自動的に表示を変える場合(ブラウザをリロードしない場合)、Ajaxを使うのが一般的と思います。

現状のコードから変更するなら、

switch_checker()に@app.route("/switch_checker")とかのエンドポイントを割り振る。
switch_checker()のwhile True:は消す。
index.htmlに/switch_checkerに対してGETアクセスするAjax(XMLHttpRequestでも、$.ajaxでも、fetchでも、axiosでも何でも良いです)処理を記述し、それを定期的に実行する。(これはJavaScriptです)
取得した結果を反映する処理を書く(これもJavaScriptです)
index.htmlにあるJinja2記述は、JavaScriptでやることになるので削除する。({% if digi==0 %}とかのこと)

で大体いけると思います。

Ajaxを使わない場合、WebSocketが使えると思います。
が、こちらも結局JavaScriptを書く必要があるので、とりあえずAjax処理を学んでからのが理解しやすいと思います。

念のため書いて起きますが、Webはいろんな技術を複合して使うことで成り立っていますので、案外面倒です。
例えば、ブラウザが通信するのにHTTPを使っているということを理解しないでWebページを作成し始めると、なんでそんなことしないといけないの？というようなことが往々にしてありますのでその辺に気をつけてください。
今回のコードで言えば、