欢迎访问宙启技术站
智能推送

使用Starlette构建实时Web应用程序

发布时间:2024-01-17 01:16:27

Starlette是一个轻量级、高性能的Web框架,适用于构建实时Web应用程序。它提供了异步请求处理、WebSocket和HTTP/2的支持,使开发人员可以轻松地构建响应式、实时的Web应用程序。

下面我们将展示一个使用Starlette构建实时Web应用程序的例子。我们将使用Starlette的WebSocket功能来实现即时通讯。

首先,我们需要安装Starlette:

pip install starlette

接下来,我们创建一个main.py文件,并编写以下代码:

from starlette.applications import Starlette
from starlette.responses import HTMLResponse
from starlette.websockets import WebSocket

app = Starlette()

@app.route('/')
async def homepage(request):
    html = """
    <h1>Real-time Chat</h1>
    <form action="" onsubmit="sendMessage(event)">
        <input type="text" id="messageText" autocomplete="off"/>
        <button>Send</button>
    </form>
    <ul id='messages'>
    </ul>
    <script>
        var socket = new WebSocket("ws://localhost:8000/ws");
        
        socket.onmessage = function(event) {
            var messages = document.getElementById('messages');
            var message = document.createElement('li');
            var content = document.createTextNode(event.data);
            message.appendChild(content);
            messages.appendChild(message);
        };
        
        function sendMessage(event) {
            event.preventDefault();
            var messageInput = document.getElementById('messageText');
            socket.send(messageInput.value);
            messageInput.value = '';
        }
    </script>
    """
    return HTMLResponse(html)

@app.websocket_route('/ws')
async def websocket_endpoint(websocket: WebSocket):
    await websocket.accept()
    while True:
        message = await websocket.receive_text()
        await websocket.send_text(f"You said: {message}")

在上面的代码中,我们首先导入了Starlette的相关模块。然后,我们创建了一个Starlette应用程序,并定义了一个主页路由,以及一个WebSocket的路由。

主页路由通过返回一个包含HTML和JavaScript代码的HTMLResponse实例来渲染网页。JavaScript代码负责与WebSocket通信,并在接收到消息时将其显示在页面上。表单用于输入消息,并通过JavaScript代码将其发送到WebSocket服务器。

WebSocket路由使用@app.websocket_route装饰器来定义。在函数中,我们首先通过调用await websocket.accept()来接受WebSocket连接。然后,我们使用一个无限循环来等待接收消息,并通过await websocket.send_text()方法将获取到的消息发送回客户端。

最后,我们可以运行应用程序:

uvicorn main:app --reload

现在,我们可以在浏览器中访问http://localhost:8000/,即可看到一个简单的实时聊天应用程序。当我们在输入框中输入消息并点击发送按钮时,消息将以实时方式显示在页面上。

这就是使用Starlette构建实时Web应用程序的一个例子。Starlette的WebSocket功能非常强大,使得构建实时Web应用变得非常简单和高效。你可以根据自己的需求扩展这个例子,添加更多的功能和交互元素。