Fah*_*hmi 6 html python fastapi
提交按钮时出现错误
主要.py
from fastapi import FastAPI, Request
from fastapi.templating import Jinja2Templates
from pydantic import BaseModel
from googletrans import Translator
import uvicorn
#from googletrans import Translator
#init
app = FastAPI(debug=True)
templates = Jinja2Templates(directory="template")
#route
@app.get('/')
async def home(request: Request):
data = {'request': request}
return templates.TemplateResponse('translates.html', data)
class variable(BaseModel):
Input_text: str
trans: str
#def translator(request):
@app.post('/',response_model=variable)
async def trans(request: Request, form: variable ):
text = request.get('Input_text')
lang = request.get('trans')
# print('text:',text,'lang:',lang)
# connect the translator
translator = Translator(service_urls=['translate.googleapis.com'])
# detect langguage
dt = translator.detect(text)
dt2 = dt.lang
# translate the text
translated = translator.translate(text, lang)
tr = translated.text
data = {
'request': request,
'translated': tr
, 'u_lang': dt2
, 't_lang': lang}
return templates.TemplateResponse(data, "translates.html",)
if __name__=="__main__":
uvicorn.run(app,host="127.0.0.1",port=8000)
然后是HTML代码
翻译.html
<!DOCTYPE html>
<html lang="en">
<head>
<title>Translate</title>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css">
<script src="https://cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.js"></script>
</head>
<body>
<div class="ui container">
<h2>Translation</h2>
<form action="" method="post">
<br>
<div class="form-input">
<center><label for="TextareaInput">Enter Text </label></center>
<center><textarea class="form-control" name="Input_text" id="TextareaInput" rows="3"></textarea></center>
</div>
<div class="ui divider"></div>
<div class="selection list">
<center><label for="languages">Choose Langguage:</label></center>
<center><select name="trans" id="languages">
<option value="en">English</option>
<option value="ms">Malay</option>
<option value="zh-cn">Mandarin</option>
<option value="ko">Korean</option>
<option value="ja">Japanese</option>
<option value="vi">Vietnamese</option>
<option value="th">Thailand</option>
</select></center>
</div>
<div class="ui divider"></div>
<div>
<center> <button type="Submit" class="button">Translate</button></center>
</div>
<div class="ui divider"></div>
<div class="form-output">
<!---<center><textarea class="form-control" id="TextareaOutput" rows="3" value={{translated}} placeholder="Translate..."></textarea></center>-->
<div class="Output Translation">
<br><br>
<h1>Text translated {{u_lang}} from {{t_lang}}</h1>
<center>
<h1>{{translated}}</h1>
</center>
</div>
</div>
</form>
</div>
</body>
</html>
当我尝试按钮提交时，这些情况发生 ->
{
"detail": [
{
"loc": [
"body",
0
],
"msg": "Expecting value: line 1 column 1 (char 0)",
"type": "value_error.jsondecode",
"ctx": {
"msg": "Expecting value",
"doc": "Input_text=hi&trans=zh-cn",
"pos": 0,
"lineno": 1,
"colno": 1
}
}
]
}
很确定错误发生在我的 BaseModel 参数上，但我似乎无法纠正它，已经在互联网上搜索了。
当您将pydantic模型用于请求正文参数时，FastAPI将它们解释为json对象：
通过 Python 类型声明，FastAPI 将：
- 将请求正文读取为 JSON。
- 转换相应的类型（如果需要）。
- 验证数据...
但HTML表单不是以 的形式发送到服务器json，而是以特殊x-www-form-urlencoded格式（更多信息请参见此处），因此要读取表单值，您需要使用Form参数，如下所示：
@app.post("/")
async def path_operation(Input_text: str = Form(...), trans: str = Form(...)):
return {"Input_text": Input_text, "trans": trans}