How to intercept the stdout and output the information to web page

[lifeofpi2012]

Hi，你好
无意中看到PyWebIO，觉得很棒，想请教两个问题：

1. 是否有办法：用PyWebIO里面out的方法或者控件，实现一个web的命令行输出，即将stdout的信息输出到web页面上：
   例如，在script，调用python内置的print方法，相关的信息也可以被导向web页面

2. 有写几个demo的小程序，发现script执行完成后，web页面不会自己关闭，请问有相关的web页面自己关闭的办法么？还是说只
   有 user自己关闭呢？

   感谢

[wang0618]

重定向print

可以参考 https://stackoverflow.com/questions/4675728/redirect-stdout-to-a-file-in-python , 大概能想到3种方案。

import io
import subprocess
from contextlib import redirect_stdout

from pywebio import start_server
from pywebio.output import *


def main():
    # 方案一，最简单
    f = io.StringIO()
    with redirect_stdout(f):
        print('test')
    s = f.getvalue()
    put_text(s)

    # 方案二，支持实时输出
    class WebIO(io.IOBase):
        def write(self, bytes):
            put_text(bytes, inline=True)

    with redirect_stdout(WebIO()):
        print('test')

    # 方案三，支持脚本输出重定向
    # 谷歌搜索 "python subprocess capture output real time" 就可以得到以下方案
    process = subprocess.Popen("ls -ahl", shell=True, stdout=subprocess.PIPE, stderr=subprocess.STDOUT)
    while True:
        output = process.stdout.readline()
        if output == '' and process.poll() is not None:
            break
        if output:
            put_text(output.decode('utf8'), inline=True)


start_server(main, port=8080, debug=True)

脚本结束后自动关闭页面

可以参考 https://stackoverflow.com/questions/23306882/javascript-close-current-window

可以尝试使用 run_js() 通过 run_js("window.close();") 或 run_js("window.open('','_self').close()") 关闭页面。

[wang0618]

如果要将内容单独输出到一个容器中，还可以这样:

def main():
    out = output()
    put_scrollable(out)

    # 支持实时输出
    class WebIO(io.IOBase):
        def write(self, bytes):
            out.append(put_text(bytes, inline=True))

    with redirect_stdout(WebIO()):
        print('test')

    # 支持脚本输出重定向
    process = subprocess.Popen("ls -ahl", shell=True, stdout=subprocess.PIPE, stderr=subprocess.STDOUT)
    while True:
        line = process.stdout.readline()
        if line == '' and process.poll() is not None:
            break
        if line:
            out.append(put_text(line.decode('utf8'), inline=True))


start_server(main, port=8080, debug=True)

[wang0618]

把一个比较hack的实现也贴上来吧，虽然实现上不太优雅，不过这个版本的显示效果是最好的

import io
import random
import string
import subprocess
from contextlib import redirect_stdout

from pywebio import start_server
from pywebio.output import *
from pywebio.session import *


def get_code_output(height=None):
    """创建一个代码输出区，返回输出到该区域的回调函数"""
    rand_id = ''.join(random.choice(string.ascii_letters) for _ in range(10))
    html = '<pre><code id="%s"></code></pre>' % rand_id
    style(put_html(html), 'height:%spx' % height if height else '')
    return lambda text: run_js('$("#%s").append(text)' % rand_id, text=str(text))


def main():
    put = get_code_output()
    put('hello world')

    put = get_code_output(height=400)

    # 支持实时输出
    class WebIO(io.IOBase):
        def write(self, bytes):
            put(bytes)

    with redirect_stdout(WebIO()):
        print('test')

    # 支持脚本输出重定向
    process = subprocess.Popen("ls -ahl", shell=True, stdout=subprocess.PIPE, stderr=subprocess.STDOUT)
    while True:
        output = process.stdout.readline()
        if output == '' and process.poll() is not None:
            break
        if output:
            put(output.decode('utf8'))


start_server(main, port=8080, debug=True)

[lifeofpi2012]

非常感谢，回复这么及时和详尽
刚才有按照方案二测试了一下，确实可以，赞
目前发现超出输出范围后，scrollable widget不能显示最新的内容，需要手动下拉滚动条看才行，我再研究一下code
明天再试一下脚本的重定向

[wang0618]

scrollable widget滚动到底部，目前也需要hack才能实现:

out = output()
with use_scope('scrollable'):
    put_scrollable(out)
out.append(put_text('text\n' * 40))
# hack: to scroll bottom
run_js('$("#pywebio-scope-scrollable>div").animate({ scrollTop: $("#pywebio-scope-scrollable>div").prop("scrollHeight")}, 100)')

后面会考虑将自动滚动到底部支持加入到 put_scrollable()

---

对于使用get_code_output()的版本，也可以实现自动滚动到底部:

def get_code_output(height=None):
    """创建一个代码输出区，返回输出到该区域的回调函数"""
    rand_id = ''.join(random.choice(string.ascii_letters) for _ in range(10))
    html = '<pre id="%s"><code></code></pre>' % rand_id
    style(put_html(html), 'height:%spx' % height if height else '')

    def append_to_code(text):
        run_js("""
        $("#{dom_id}>code").append(text);
        $("#{dom_id}").animate({{scrollTop: $("#{dom_id}").prop("scrollHeight")}}, 100);
        """.format(dom_id=rand_id), text=str(text))

    return append_to_code

put = get_code_output(height=300)
put('text\n' * 40)

[lifeofpi2012]

非常感谢昨晚这么晚还回复
我尝试了一下您提到的输出重定向和脚本重定向，综合起来可以解决我目前遇到问题(目前有个小软件有包含不止一种，再次感谢
我自己对web不了解，所以对于“实现自动滚动到底部”的版本试了一下，确实可以滚到底部，不过写的测试的code，print的频率太高，页面容易卡住，
如果在两个print间有加一个延时，效果就好很多，如下图；建议考虑在下一个版本的output API中添加上可设定自动滚动到底部的参数

[wang0618]

Update: 现在 v1.1 版本的 put_scrollable() 已经支持开启自动滚动了 https://pywebio.readthedocs.io/zh_CN/latest/output.html#pywebio.output.put_scrollable