Python配合前端写简单接口（加前端vue代码）

Posted 2023-04-23

参考技术A 服务器端：

# 开发人员: hanhan丶

# 开发时间: 2020/11/12 14:36

import flask, json                           #Flask 一个轻量级的web框架

from flask_corsimport *

server = flask.Flask(__name__)      # __name__代表当前的python文件。把当前的python文件当做一个服务启动

CORS(server, supports_credentials=True)     # 解决跨域

@server.route('/login', methods=['post'])

# 第一个参数就是路径,第二个参数支持的请求方式，不写的话默认是get，

# 加了@server.route才是一个接口，不然就是一个普通函数

def login():

user = flask.request.values.to_dict()

for itemin user:

items = json.loads(item)

loginName = items.get("loginName")

password = items.get("password")

if loginNameand password:

res = "code":0, "msg":"请求成功", "data": "loginName": loginName, "password": password

else:

res = 'msg':'调用失败'

# json.dumps 序列化时对中文默认使用的ascii编码，输出中文需要设置ensure_ascii=False

        return json.dumps(res, ensure_ascii=False)

if __name__ =='__main__':

# port可以指定端口，默认端口是5000

    # host默认是服务器，默认是127.0.0.1

    # debug=True 修改时不关闭服务

    server.run(debug=True)

前端：

<template>

  <div>

    账号：<input type="text" v-model="loginName">

    <br>

     密码：<input type="text" v-model="password">

    <br>

    <br>

    <br>

    <button @click="btn">点击</button>

  </div>

</template>

<script>

import axios from "axios";

export default

  data()

    return

      loginName: "",

      password: ""

    ;

  ,

  methods:

    getDate()

      axios(

        headers:

          "X-Requested-With": "XMLHttpRequest",

          "Content-Type": "application/x-www-form-urlencoded; charset=UTF-8"

        ,

        url: "http://127.0.0.1:5000/login",

        method: "post",

        data:

          loginName: this.loginName,

          password: this.password

       

      ).then(res =>

        console.log(res);

      );

    ,

    btn()

      this.getDate();

   

 

;

</script>

<style>

</style>

通过前端js给远程PDF文件加水印

最近写了一个简单的工具网站，可以上传PDF文件，加完水印/文字后下载下来，整个过程唯一需要后端的时候就是需要把文件传到服务器上，提供一个远程的PDF路径，方便操作，本来可以直接抛开服务端，直接在浏览器上解析，但是会丢失文字，所以采用了操作远程PDF文件的方式。直通车(链接).

 

技术栈：vue + elementui + pdf-lib.js

由于实在太懒，虽然网站很简单，还是使用了elementui去布局，具体的PDF文件操作，可以参考pdf-lib.js的doc，这里记录一个写过程中的问题。

生成写的pdfDocument后，在下载过程中遇到了困难。库本身提供了save方法，可以生成Uint8Array数组，但是直接转Blob下载时，下载的PDF文件无法打开，经过多方查询，最终使用了一个下载库，完美解决。

希望本文能给有PDF处理需求的小伙伴提供思路。