基于axiox vue与python交互

基于axiox vue与python交互

https://www.axios-http.***/docs/cancellation

import axios from ‘axios’; // 导入axios库
import { ref } from ‘vue’

1.向后端传递参数的axios请求-请求头

const test_data = axios.create({
  baseURL: url,
  timeout: 1000,
  headers: {'X-Custom-Header': 'foobar'}
});

请求头

get请求

test_data.get('/user', {
            params: {
            data: inputValue.value
            }
        })
        .then(function (response) {
            console.log(response.data);
            console.log(response.data.name);
        })
        .catch(function (error) {
            console.log(error);
        })
        .finally(function () {
            // 总是会执行
            console.log('运行完毕');
        });

form可以直接转化json

console.log('下面是post的返回');
    test_data.post('/user',{
          params: 'nihao',
          data: inputValue.value
          //直接写数据
      })
      .then(function (response) {
          console.log(response.data);
          console.log(response.data.name);
      })
      .catch(function (error) {
          console.log(error);
      })
      .finally(function () {
          // 总是会执行
          console.log('运行完毕');
      });

python代码·

from flask import Flask, request, jsonify

app = Flask(__name__)
from flask_cors import CORS
CORS(app)  # 启用 CORS 支持 解决跨域问题
@app.route(rule='/user', methods=['GET','post'])
def get_user() :
    if request.method=='GET':
        data=request.args.get("data")
        # 根据 user_id 执行相应的操作,例如从数据库中获取用户信息
        print('get接受数据',data)
        # 构造响应数据
        user = {
            'data': data,
            'name': 'John Doe',
            'age': 30
        }
        return jsonify(user)
    else:
        data = request.get_json()
        data = data.get('data')#直接写就行
        print('data_post',data)
        # 构造响应数据
        response = {
            'message': 'Data received su***essfully',
            'data': data
        }

        return jsonify(response)
if __name__ == '__main__':
    app.run(debug=True)

全局变量
main.js

const back_url=" http://127.0.0.1:5000"
const app = createApp(App)
app.provide("back_url",back_url) 第一个关键字

应用

const url = inject("back_url");
console.log('正在请求',url)
转载请说明出处内容投诉
CSS教程_站长资源网 » 基于axiox vue与python交互

发表评论

欢迎 访客 发表评论

一个令你着迷的主题!

查看演示 官网购买