Skip to content

Latest commit

 

History

History
278 lines (187 loc) · 4.91 KB

508-2745347-网页翻译官_翻译.sy.md

File metadata and controls

278 lines (187 loc) · 4.91 KB
show version enable_checker
step
1.0
true

前端和后端

我们来回顾一下 😌

  • 上次了解了 请求和响应

    • 请求就是客户发出的订单
    • 响应就是堂倌做出的反应
    • 堂倌会看人下菜碟
    • 来了请求
    • 能把浏览器基本信息都得到
  • 请求和响应这套东西

    • 能做点什么呢?

翻译

  • 比如说翻译

图片描述

  • 我发出中文请求
    • 要求得到英文响应

图片描述

  • 来试试

尝试翻译

  • 安装包
pip install translate
  • 传统本地翻译
from translate import Translator

# 创建Translator对象
translator = Translator(to_lang = 'zh')

# 进行翻译
translation = translator.translate('Hello, world!')

# 获取翻译结果
print(translation)
  • 运行结果

图片描述

  • 怎么把这套放到网上呢?

构建flask应用服务器

from flask import Flask

app = Flask(__name__)

@app.route('/')
def index():
    return "hello"

if __name__ == "__main__":
    app.run(debug=True)
  • 访问首页成功

图片描述

打造静态页面

mkdir my_app
cd my_app
mkdir static
vi static/pre.html        
tree

图片描述

  • 构造网页
<html lang="zh">
	<head>
        <title>preCalculate</title>
	</head>
	<body>
        <form method="GET" id="preCal" action="../trans">
            <input type="text" id="sen" name="sentence">
            <input type="submit" value="go"/>
        </form>
	</body>
</html>
  • 注意此时 form 提交的方法为
    • GET

准备浏览网页

  • 后台运行应用服务器
nohup python3 app.py >> f.log 2>&1 &
firefox http://localhost:5000/static/pre.html &
  • 查看结果

图片描述

  • 静态页
    • 访问成功

发送请求

  • F12调出工具
    • 选择 网络 页面

图片描述

  • 点击 按钮
    • 发送请求

图片描述

  • 发送GET请求
    • 找不到该URI
    • 得到404状态码
  • 为什么会这样?

设置路由

  • /trans没有对应的路由
from flask import Flask
from flask import request
from translate import Translator


app = Flask(__name__)

@app.route('/')
def index():
    return "hello"

@app.route('/trans',methods=['POST',"GET"])
def trans():
    s = request.args.get("sentence")
    translator = Translator(to_lang = 'zh')
    translation = translator.translate(s)
    return translation

if __name__ == "__main__":
    app.run(debug=True)

  • 处理之后

准备再次提交

firefox http://localhost:5000/static/pre.html &
  • 准备再次提交

图片描述

提交结果

  • 确实可以翻译

图片描述

  • 提交的参数都在uri里面
    • 写的清清楚楚
    • 这就是GET的提交方式
  • 还可以在uri中隐藏
    • 请求的数据吗?

修改页面

vi static/pre.html    
  • 把提交方式method
    • 从GET
    • 修改为POST

图片描述

  • 这样也能提交吗?

再次准备提交

firefox http://localhost:5000/static/pre.html &
  • 再次准备提交

图片描述

提交结果

  • 状态码500
    • 服务器内部错误

图片描述

  • 该如何修改?

修改app.py

from flask import Flask
from flask import request
from translate import Translator


app = Flask(__name__)

@app.route('/')
def index():
    return "hello!"

@app.route('/trans',methods=['POST',"GET"])
def trans():
    s = request.form["sentence"]
    print(s)
    translator = Translator(to_lang = 'zh')
    translation = translator.translate(s)
    return translation

if __name__ == "__main__":
    app.run(debug=True)
  • 可以看到url中的参数消失了
    • 方法确实是POST
    • 参数被放到了
    • 请求表单中

图片描述

  • 为什么要放请求表单呢?

安全性

图片描述

总结 🤨

  • 这次应用了 请求和响应
    • 请求 就是 客户发出的 文字
    • 响应 就是 翻译官 翻译好的 文字
    • 后台就是翻译官
  • 可以用表单
    • 来做个webshell吗?
  • 下次再说!👋