python+fastapi+jinja2+mongodb,突然感觉整个人一下就轻松了,python学习之路

pip install pymongo
pip install motor
安装mongodb
===随便操作,随心所欲
已放弃postgreSQL,搞得头大,不是连接不上,就是这有问题那有问题。普通人还是搞搞味道相同的,咱们都是对象哈哈😊

#mongo.py
from pymongo import MongoClient
from fastapi import FastAPI, status,WebSocket,Request
from pydantic import BaseModel
from typing import List
from fastapi.templating import Jinja2Templates
from fastapi.staticfiles import StaticFiles
import emoji
import time
import uvicorn
def i():
    num = 1
    while True:
        yield num
        num += 1
y=i()
hd=('name','age','years')
s= emoji.emojize('Python is :thumbs_up:')
def get_top():
    DB = "slack"  #数据库名
    MSG_COLLECTION = "messages" #集合名称
    url="mongodb://localhost:27017/"#数据库连接地址
    #with MongoClient(url) as client:
    client_link=MongoClient(url)[DB][MSG_COLLECTION]#创建数据库和集合
    return client_link



#在 Pydantic 中定义的消息类
class Message(BaseModel):
  #  _id: Optional[int] = Field(default=None, primary_key=True)
   # _id:int
    channel: str
    author: str
    text: str


# 实例化 FastAPI
app = FastAPI()

templates = Jinja2Templates('/root/py/templates')
app.mount('/static', StaticFiles(directory='/root/py/static'), name='static')

@app.get("/")
async def home(request: Request):
       mydoc = get_top()
       #doc=[x['channel'] x in mydoc.find()]或者 doc1=[x x in mydoc.find()]以列表形式返回全部数据库数据
       去除列表框doc=doc[0]或者doc=doc['channel']python列表操作后返回无列表符号数据
       
       
       
       doc=[]
       for dc in  mydoc.find({},{"_id": 0,"channel":1}):
           doc.append(dc)
       data_all={"request":request,
                "doc":doc,              
                "hd":hd,
                "s":s,
                }
       return templates.TemplateResponse("index.html",data_all)
    
@app.get("/status")
def get_status():
    """获取消息服务器的状态."""
    return {"status": "running"}

@app.get("/channels",response_model=List[str])
def get_channels(request:Request):
    """以列表形式获取channel所有文本.注:重复的文本不会显示"""
    msg_collection = get_top()
    distinct_channel_list = msg_collection.distinct("channel")
        #return distinct_channel_list
    data={"distinct_channel_list":distinct_channel_list,"request":request,}
    return templates.TemplateResponse("index.html",data)




@app.post("/post_message", status_code=status.HTTP_201_CREATED)
def post_message(message: Message):
    """向指定结构体Message发送新消息"""
    msg_collection = get_top()
    result = msg_collection.insert_one(message.dict())
    ack = result.acknowledged
    return {"insertion": ack}
@app.websocket("/ws")
async def websocket_endpoint(websocket:WebSocket):
    try:
        #等待socket连接并建立连接
        await websocket.accept()
        while True:
            #接收客服端传回的数据
             data1 = await websocket.receive_text()
             #向客户端发送,接收到的数据
             await websocket.send_text(f"你输入的是: {data1}")
             #
             if data1=='1':
                 g='这是我额外给你的奖励'
                 data2="你输入正确了!"
                 #if判断客服端发来的数据并处理客户端发来的数据data后重新发送给客户端发
                 await websocket.send_text(f" {data2}  {g}")
             else:
                 pass

    except:
        #客户端连接情况反馈信息
        print('断开连接')
        print('当前连接次数: '+str(next(y)))
        u=time.time()
        d=time.strftime("此连接断开时间  :%Y-%m-%d %H:%M:%S",time.localtime(u))
        print(d)
        
if __name__=="__main__":
    uvicorn.run(app, host="172.23.140.174", port=3389)

<!--index.html-->
{% extends "/base.html" %}

{% block head %}
<title>Fastapi+Fastsqlmodel+jinja2+socketserver
</title>
<link href="static/css/styles.css" rel="stylesheet">
<link href="static/css/socket.css" rel="stylesheet">
{% endblock head %}

{% block body %}
<h1>用户页面</h1>



 <!--python对象显示在html测试页面-->  
{% for x in hd %}
<p>{{x}}</p>
{% endfor %}
<p>{{s}}</p>  

<!--数据库数据简单显示测试-->
<p>{{response_msg_list}}</p>
<p>{{distinct_channel_list}}</p>
<p>{{doc}}</p>

<!--socketserver-->
<form action="" onsubmit="sendMessage(event)">
<input type="text" id="messageText" autocomplete="off"/>
<button>Send</button>
</form>
<ul id='messages'></ul>

{% include "js/socket.js" %}


<!--db_send_json-->
<input type="text" id="channel" placeholder="channel">
<p id=channel1></p>
<input type="text" id="author" placeholder="author"> 
<input type="text" id="text" placeholder="txt">
<!-- Button to send data -->
<button id="send">Send JSON</button> 


{% include "js/sendjson1.js" %}


<img src="static/images/1.png" alt="" width="30" height="24">
<h1> A super stylish home page </h1>
<p>
     Python really interesting content, full of buzzwords like AI and MACHINE LEARNING!
     </p>
{% endblock body %}

<!--sendjson1.js-->
<script async>
Buttons=document.getElementById("send")
Buttons.addEventListener("click",sendJSON)

Buttons.addEventListener("click",reload);

function reload() {
    reload = location.reload();
    //setTimeout(refresh , 3000);
 }
function sendJSON(){ 

            let result = document.querySelector('.result'); 

            let channel = document.querySelector('#channel'); 

            let author = document.querySelector('#author');  
	    let text= document.querySelector('#text');     

            // Creating a XHR object 

            let xhr = new XMLHttpRequest(); 

            let url = "/post_message"; 

        
            // open a connection 

            xhr.open("POST", url, true); 
// Set the request header i.e. which type of content you are sending
            xhr.setRequestHeader("Content-Type", "application/json");
  
            // Create a state change callback 

            xhr.onreadystatechange = function () { 

                if (xhr.readyState === 4 && xhr.status === 200) { 

		// Print received data from server 

                result.innerHTML = this.responseText; 

                } 

            }; 

            var data = JSON.stringify({ 'channel':channel.value,'author':author.value,'text':text.value}); 
	  
  
            // Sending data with the request 
          if (channel.value.length>0 && (author.value.length>0 && text.value.length>0)){
            xhr.send(data); 
          }
        } 
</script>


<!--socket.js-->
<script async>
var ws = new WebSocket("ws:/47.108.229.189:3389/ws");
        ws.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) {
                var input = document.getElementById("messageText")
                ws.send(input.value)
                input.value = ''
                event.preventDefault()
            }
</script>

  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
### 回答1: 你好!可以使用 Python 的 Flask 框架来将 MongoDB 中的数据可视化到 web 页面上。 首先,你需要安装 Flask 和 PyMongo: ``` pip install flask pymongo ``` 然后,你可以使用 PyMongo 连接到 MongoDB 数据库,并使用 Flask 将数据渲染到 HTML 模板中: ```python from flask import Flask, render_template from pymongo import MongoClient app = Flask(__name__) client = MongoClient("mongodb://localhost:27017/") db = client["mydatabase"] collection = db["mycollection"] @app.route("/") def index(): documents = collection.find() return render_template("index.html", documents=documents) if __name__ == "__main__": app.run() ``` 在这段代码中,我们连接到本地的 MongoDB 数据库,并获取名为 "mydatabase" 的数据库中名为 "mycollection" 的集合。然后,我们使用 Flask 的 `render_template` 函数将数据渲染到名为 "index.html" 的 HTML 模板中。 在 HTML 模板中,你可以使用 Jinja2 模板语法来显示数据: ```html <table> <tr> <th>Name</th> <th>Age</th> </tr> {% for document in documents %} <tr> <td>{{ document.name }}</td> <td>{{ document.age }}</td> </tr> {% endfor %} </table> ``` 这样,你就可以使用 Python 代码将 MongoDB 中的数据可视化到 web 页面上了。希望这对你有帮助! ### 回答2: 要将MongoDB中的数据可视化到web页面,可以使用Python的Flask框架和PyMongo库来完成。 首先,安装Flask和PyMongo库: ``` pip install Flask pip install pymongo ``` 然后,创建一个Flask应用,并连接MongoDB数据库: ```python from flask import Flask, render_template from pymongo import MongoClient app = Flask(__name__) # 连接MongoDB数据库 client = MongoClient('mongodb://localhost:27017/') db = client['your_database'] # 替换为自己的数据库名称 collection = db['your_collection'] # 替换为自己的集合名称 ``` 接下来,查询MongoDB数据库中的数据,并将数据传递给模板页面: ```python @app.route('/') def index(): # 查询MongoDB数据库中的数据 data = collection.find() # 渲染模板页面并传递数据 return render_template('index.html', data=data) ``` 在模板页面index.html中,可以使用模板语言来渲染数据: ```html <!DOCTYPE html> <html> <head> <title>Data Visualization</title> </head> <body> <h1>Data Visualization</h1> <table> <tr> <th>Name</th> <th>Age</th> <th>Gender</th> </tr> {% for item in data %} <tr> <td>{{item.name}}</td> <td>{{item.age}}</td> <td>{{item.gender}}</td> </tr> {% endfor %} </table> </body> </html> ``` 最后,启动Flask应用并访问web页面,即可将MongoDB中的数据可视化到web页面: ```python if __name__ == '__main__': app.run() ``` 通过以上代码,我们可以将MongoDB中的数据查询出来,并通过web页面表格的形式展示出来。你还可以根据具体需求,对数据进行更多的处理和可视化操作,例如使用图表库将数据转换成图表形式展示。 ### 回答3: 要将MongoDB中的数据可视化到web页面,可以使用Python的Flask框架和图表库(如Matplotlib、Plotly等)进行实现。 首先,需要安装Flask和相关的图表库。使用以下命令安装相关库: ``` pip install flask pip install matplotlib ``` 接下来,创建一个Flask应用,并导入所需的模块: ```python from flask import Flask, render_template import matplotlib.pyplot as plt from pymongo import MongoClient ``` 然后,连接MongoDB数据库并获取数据: ```python # 连接MongoDB数据库 client = MongoClient('mongodb://localhost:27017/') db = client['your_database_name'] collection = db['your_collection_name'] # 获取数据 data = collection.find() # 根据需求进行数据查询 ``` 接下来,使用Matplotlib或其他图表库对数据进行可视化处理: ```python # 对数据进行可视化处理 # (这里以Matplotlib为例,具体使用的图表库可以根据需求进行选择) x = [] y = [] for item in data: x.append(item['x']) # 根据数据结构获取x轴的值 y.append(item['y']) # 根据数据结构获取y轴的值 plt.plot(x, y) # 根据需求进行具体的图表绘制操作 plt.xlabel('X轴') plt.ylabel('Y轴') plt.title('数据可视化') # 保存图表为临时文件 plt.savefig('static/images/plot.png') ``` 最后,创建Flask的由处理函数,并在模板中展示图片: ```python app = Flask(__name__) @app.route('/') def index(): return render_template('index.html') if __name__ == '__main__': app.run() ``` 在根目录下新建一个templates文件夹,并在该文件夹中创建一个index.html文件。在index.html中展示可视化结果: ```html <!DOCTYPE html> <html> <head> <title>数据可视化</title> </head> <body> <h1>数据可视化</h1> <img src="{{ url_for('static', filename='images/plot.png') }}" alt="plot"> </body> </html> ``` 运行Flask应用,即可在网页上看到MongoDB数据的可视化结果。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值