최대 1 분 소요

FastAPI 사용하기

uvicorn web_OCPP201:app –reload –host 주소–port 8000

메인 함수 web_OCPP201.py


from fastapi.templating import Jinja2Templates #템플릿 추가
from starlette.middleware.cors import CORSMiddleware

from fastapi import FastAPI, WebSocket, WebSocketDisconnect, Request
from fastapi.responses import HTMLResponse,RedirectResponse
from fastapi.staticfiles import StaticFiles


app = FastAPI()


app.add_middleware(
    CORSMiddleware,
    allow_origins=["*"],
    allow_credentials=True,
    allow_methods=["*"],
    allow_headers=["*"],
)


app.mount("/templates", StaticFiles(directory="templates"), name="static")
templates = Jinja2Templates(directory="templates")


@app.get("/")
async def get(request: Request):
    context = {}
    context['request'] = request
    return templates.TemplateResponse("main.html",context)

템플릿 파일 위치에 templates 안에 파일 경로 만들어야함

@@ -0,0 +1,44 @@
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>User list</title>

        <script>
        function getCookie(name) {
            var cookieValue = null;
            if (document.cookie && document.cookie !== '') {
                var cookies = document.cookie.split(';');
                for (var i = 0; i < cookies.length; i++) {
                    const cookie = cookies[i].trim();
                    // Does this cookie string begin with the name we want?
                    if (cookie.substring(0, name.length + 1) === (name + '=')) {
                        cookieValue = decodeURIComponent(cookie.substring(name.length + 1));
                        break;
                    }
                }
            }
            return cookieValue;
        }
        var csrftoken = getCookie('csrftoken');

    </script>


</head>
<body>

    <div style="padding:10px;">
        <a href="/">HOME</a>
        <a href="/users">유저 정보</a>
        <a href="/ChargeBox">충전소 정보</a>
        <a href="/Server_Admin">서버 정보</a>
        <a href="/transactions">연결 히스토리</a>
        <a href="/ocppTags">OcppTagTable</a>
        <a href="meterValues">충전 내용</a>
    </div>

</body>
</html>

참고 링크

FAST API 공식 문서

댓글남기기