叮叮车不是车 2023-07-02 17:23 采纳率: 20%
浏览 16

路由数据无法传输至前端页面显示

我的路由代码是:

@app.route('/index', methods=['GET', 'POST'])
def user_upload_file():
    global data
    if request.method == 'POST':
        allowed_formats = ['pdf', 'doc', 'docx', 'jpg', 'png']
        files = request.files.get('pdf' or 'doc' or 'docx' or 'jpg' or 'png')
        if files and files.filename.endswith(tuple(allowed_formats)):
            basepath = os.path.dirname(__file__)  # 当前文件所在路径
            filepath = os.path.join(basepath, 'files', files.filename)
            # 注意:没有的文件夹一定要先创建,不然会提示没有该路径
            filepath = os.path.abspath(filepath)  # 将路径转换为绝对路径
            files.save(filepath)
            if not files.filename.endswith('.pdf'):
                # global_var = filepath
                comtypes.CoInitialize()
                # return 'File uploaded successfully.'
                global_var = convert_to_pdf(filepath)
            else:
                global_var = filepath
            filtered_name,filtered_age, filtered_collage, filtered_phnum, filtered_email=request_webimage(global_var)
            data = {
                'filtered_name': filtered_name or '',
                'filtered_age': filtered_age or '',
                'filtered_collage': filtered_collage or '',
                'filtered_phnum': filtered_phnum or '',
                'filtered_email': filtered_email or ''
            }
        else:
            data={}

        print(f"filtered_name: {data['filtered_name']}, filtered_age: {data['filtered_age']}, filtered_collage: {data['filtered_collage']}, filtered_phnum: {data['filtered_phnum']}, filtered_email: {data['filtered_email']}") #此处可以正常输出每一项的内容

        return render_template('index.html', filtered_name=data['filtered_name'], filtered_age=data['filtered_age'], filtered_collage=data['filtered_collage'], filtered_phnum=data['filtered_phnum'], filtered_email=data['filtered_email'])
    else:
        return render_template('index.html', data={})

我的html代码是:


<!DOCTYPE html>
<html>
<head>
    <title>用户端</title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.9.3/css/bulma.min.css">
 
    <script>
        function handleDrop(event) {
            event.preventDefault();

            var file = event.dataTransfer.files[0];
            var formData = new FormData();
            formData.append('pdf', file);

            var xhr = new XMLHttpRequest();
            xhr.open('POST', '/index', true);
            xhr.onload = function () {
                if (xhr.status === 200) {
                    alert('文件上传成功');
                    location.reload();
                } else {
                    alert('文件上传失败');
                }
            };
            xhr.send(formData);
        }

        function handleDragOver(event) {
            event.preventDefault();
        }
    </script>
</head>
<body>
    <script src="js/flexible.js"></script>
        <div class="section">
            <div class="container">
                <h1 class="title">Upload PDF</h1>
                <form onsubmit="submitForm(event)" enctype="multipart/form-data">
                    <div class="field">
                        <div class="file has-name">
                            <label class="file-label">
                                <input class="file-input" type="file" name="" accept="application/pdf, application/msword, application/vnd.openxmlformats-officedocument.wordprocessingml.document, image/jpeg, image/png">
                                <span class="file-cta">
                                    <span class="file-icon">
                                        <i class="fas fa-upload"></i>
                                    </span>
                                    <span class="file-label">
                                        Choose a file…
                                    </span>
                                </span>
                                <span class="file-name">No file chosen</span>
                            </label>
                        </div>
                    </div>
                    <div class="drop-zone" ondrop="handleDrop(event)" ondragover="handleDragOver(event)" value="Upload">
                        <p>将PDF文件拖拽到此处</p>
                    </div>
                    <div class="field">
                        <div class="control">
                            <input class="button is-primary" type="submit" value="Upload">
                        </div>
                    </div>
                </form>
                <h1 class="title">个人信息</h1>
                <div class="field">
                    <label class="label" for="title" style="display: inline-block; width: 100px;">姓名:</label>
                    <input class="input" type="text" id="name" name="name" value="{{ filtered_name }}" readonly>
                </div>
                <div class="field">
                    <label class="label" for="title" style="display: inline-block; width: 100px;">年龄:</label>
                    <input class="input" type="text" id="age" name="age" value="{{ filtered_age }}" readonly>
                </div>
                <div class="field">
                    <label class="label" for="title" style="display: inline-block; width: 100px;">学历:</label>
                    <input class="input" type="text" id="collage" name="collage" value="{{ filtered_collage }}" readonly>
                </div>
                <div class="field">
                    <label class="label" for="title" style="display: inline-block; width: 100px;">电话:</label>
                    <input class="input" type="text" id="phnum" name="phnum" value="{{ filtered_phnum }}" readonly>
                </div>
                <div class="field">
                    <label class="label" for="title" style="display: inline-block; width: 100px;">邮箱:</label>
                    <input class="input" type="text" id="email" name="email" value="{{ filtered_email }}" readonly>
                </div>
            </div>
        </div>
</body>
</html>

路由中可以正确输出每一项,但前端页面无法在inputbox中显示对应的内容?

  • 写回答

2条回答 默认 最新

  • Lemon2050 2023-07-02 22:41
    关注

    你在访问index的时候,默认是GET方法,所以data={}。你的所有数据都在POST方法里,所以你得做一次提交后,才能显示你的这些数据。

    如果你已经了解这个逻辑,那可以看看数据是否已经正确返回给了HTML端。

    评论

报告相同问题?

问题事件

  • 创建了问题 7月2日

悬赏问题

  • ¥15 装 pytorch 的时候出了好多问题,遇到这种情况怎么处理?
  • ¥20 IOS游览器某宝手机网页版自动立即购买JavaScript脚本
  • ¥15 手机接入宽带网线,如何释放宽带全部速度
  • ¥30 关于#r语言#的问题:如何对R语言中mfgarch包中构建的garch-midas模型进行样本内长期波动率预测和样本外长期波动率预测
  • ¥15 ETLCloud 处理json多层级问题
  • ¥15 matlab中使用gurobi时报错
  • ¥15 这个主板怎么能扩出一两个sata口
  • ¥15 不是,这到底错哪儿了😭
  • ¥15 2020长安杯与连接网探
  • ¥15 关于#matlab#的问题:在模糊控制器中选出线路信息,在simulink中根据线路信息生成速度时间目标曲线(初速度为20m/s,15秒后减为0的速度时间图像)我想问线路信息是什么