踩坑小结：JavaScript与Python函数间的交互

不吃鱼的傻猫
344 阅读4分钟

一 、前言

在技术选型上,可以选择Flask框架,应该还可以选择另一个Django.但是我不会哎=.=

连Python Flask 都是因为工作中的一个需求需要,才去接触到的.

关于编辑工具用的是VSCode,本人就一枚菜鸟小前端.

一个简单的实现方案,给大家参考一下吧...

二 、安装Flask

pip3 install flask

安装完就能通过pip3 list查看到

image.png

三 、一个最简单的案例

3.1 案例长酱紫

# 导包 创建实例
from flask import Flask, request
app = Flask(__name__)


# 定义路由
@app.route('/queryTest', methods=['GET', 'POST'])
def queryDataList():
    # 通过request.json 获取传参
    params = request.json
    
    # 假设传参格式定义为这样,前端调用时传name和age两个参数
    # {
    #     name:"xxxx",
    #     age:18
    # }
    # 通过params.get 分别获取 接收到的 name和 age 并且打印
    
    paramName = params.get('name')
    paramAge = params.get('age')
    print("接收到的参数-name:", paramName)
    print("接收到的参数-age:", paramAge)


    # 这边就可以根据获取到的参数,调用python函数进行逻辑处理等等
    

    # 将结果封装,实际开发中可以将 这部分内容放至上一步 处理数据的时候封装
    # 在这边 显示效果为 将前端传过来的参数,略微封装一下(也可不封装),直接返回
    res = {
        "params": params
    }

    return res


if __name__ == "__main__":
    app.run(port=1111, host="127.0.0.1", debug=True)
# 这边设置 端口, ip 等等

3.2 、让最简单的案例跑起来

在控制台 输入

python ./main.py

#关于这个python 还是 python3,我本地用的是python 部署到服务器上用的是python3 应该都可以吧=.=

image.png

这样就暂时可以了.

关于这个警告:WARNING: This is a development server. Do not use it in a production deployment.

我们先不管,晚点再来看这个~

3.3 、调用

关于调用,我们就用postman来调用API

image.png

如图所示:
API: http://127.0.0.1:1111/queryTest

请求参数:
{
    "name":"不吃鱼的傻猫",
    "age":18
}

返回的数据:
{
    "params": {
        "age": 18,
        "name": "不吃鱼的傻猫"
    }
}

image.png

控制台也能正常打印数据.

3.4 完结?撒花不...

如上所示,好像我们看上去就已经达到目的...实现了JavaScript与Python函数间的交互.但是不撒花...还有一些小问题不是...

四 、 一些补充

4.1 WSGI

4.1.1 WARNING: This is a development server. Do not use it in a production deployment.

翻译一下就是：这是一个开发服务器。 不要在生产部署中使用它。写的项目总是要部署到生产环境的.所以这个警告我们也还是解决一下吧

解决办法控制台也有说.Use a production WSGI server instead.

image.png

我先show一下我的实现吧

4.1.2 实现

1、引入 gevent

pip/pip3 install gevent

2、修改代码

from flask import Flask, request
from gevent import pywsgi  # 新增引包 
app = Flask(__name__)


# 定义路由
@app.route('/queryTest', methods=['GET', 'POST'])
def queryDataList():
    # 通过request.json 获取传参
    params = request.json
    # 假设传参格式定义为这样,前端调用时传name和age两个参数
    # {
    #     name:"xxxx",
    #     age:18
    # }
    # 通过params.get 分别获取 接收到的 name和 age 并且打印
    paramName = params.get('name')
    paramAge = params.get('age')
    print("接收到的参数-name:", paramName)
    print("接收到的参数-age:", paramAge)

    #
    # 这边就可以根据获取到的参数,调用python函数进行逻辑处理等等
    #

    # 将结果封装,实际开发中可以将 这部分内容放至上一步 处理数据的时候封装
    # 在这边 显示效果为 将前端传过来的参数,略微封装一下(也可不封装),直接返回
    res = {
        "params": params
    }

    return res


# 这边设置 端口, ip 等等   
if __name__ == "__main__":
    # app.run(port=1111, host="127.0.0.1", debug=True)
    server = pywsgi.WSGIServer(('127.0.0.1', 1111), app)
    server.serve_forever()

3、启动

image.png

启动之后就没有之前那么多东西了。看上去好像没发生啥。

4、再次调用

image.png

image.png

5、这个就OK啦~

关于WSGI，涉及的知识,实现的方案有好多好多。。。。我就不补充了（其实我也没法补充,因为暂时我也不会更多的了==!）

4.2 跨域

这个问题, 在实际开发中,也容易碰到。尤其是一个项目中,调用的API,既有Java的,又有Python的时候。同一个域名下,不同端口。

4.2.1 准备工作-引库

pip install flask-cors

4.2.2 配置

flask-cors 有两种用法，一种为全局使用，一种对指定的路由使用

1、 使用 CORS函数 配置全局路由

from flask import Flask, request
from flask_cors import CORS

app = Flask(__name__)
CORS(app, supports_credentials=True)

2、 使用 @cross_origin 来配置单行路由

from flask import Flask, request
from flask_cors import cross_origin

@app.route('/queryTest', methods=['GET', 'POST'])
@cross_origin(supports_credentials=True)
def queryDataList():
    # 通过request.json 获取传参
    params = request.json

4.3 部署

再简单聊聊部署中可能会碰到的一些问题吧.

启进程的时候，有没有将之前的那个kill掉了呢?

端口，防火墙开了吗？

关于服务器上安装Python环境的,可以看下我之前的一篇文章：踩坑小结：Linux安装python环境 、安装OpenSSL

后言

本人就一枚python的菜鸟小白，如果文章中有什么问题，希望能不吝指教~多谢!

avatar
文章
阅读
粉丝