HTML形式数据的结构

Question

我知道这是愚蠢的问题，但是该表格数据的有效负载如何格式化。我无法提出一次以上的要求，因此我看不到真正的请求发送。

我在本地HTML文件上尝试过同样的尝试，然后尝试提出请求，但我不知道图像附件是否正确。

<form method="post" id="txnForm" class="form-horizontal" enctype="multipart/form-data" autocomplete="off" action="https://example.com"> 

<div class="col-md-12">
                                    <div class="col-md-3">
                                        <label>Name : </label><br>
                                        <input type="text" class="form-control" name="name[]" required="" />
                                    </div>
                                    <div class="col-md-6">
                                        <label>Address : </label><br>
                                        <input type="text" class="form-control" name="address[]" required="" />
                                    </div>
                                    <div class="col-md-3">
                                        <label>Occupation : </label><br>
                                        <input type="text" class="form-control" name="occupation[]" required="" />
                                    </div>
                                    <div class="col-md-3">
                                        <label>Mobile : </label><br>
                                        <input type="text" class="form-control" name="mobile[]" required="" />
                                    </div>
                                    <div class="col-md-3">
                                        <label>Email : </label><br>
                                        <input type="text" class="form-control" name="email[]" required="" />
                                    </div>
                                    <div class="col-md-3">
                                        <label>Aadhar No: </label><br>
                                        <input type="text" class="form-control" name="aadhar_no[]" required="" />
                                    </div>
                                    <div class="col-md-3">
                                        <label>Aadhar Image: </label><br>
                                        <input type="file" class="form-control" name="aadhar_image" required="" />
                                    </div>
                                </div>
                          

                                <div class="col-md-12">
                                    <div class="col-md-3">
                                        <label>Name : </label><br>
                                        <input type="text" class="form-control" name="name[]" required="" />
                                    </div>
                                    <div class="col-md-6">
                                        <label>Address : </label><br>
                                        <input type="text" class="form-control" name="address[]" required="" />
                                    </div>
                                    <div class="col-md-3">
                                        <label>Occupation : </label><br>
                                        <input type="text" class="form-control" name="occupation[]" required="" />
                                    </div>
                                    <div class="col-md-3">
                                        <label>Mobile : </label><br>
                                        <input type="text" class="form-control" name="mobile[]" required="" />
                                    </div>
                                    <div class="col-md-3">
                                        <label>Email : </label><br>
                                        <input type="text" class="form-control" name="email[]" required="" />
                                    </div>
                                    <div class="col-md-3">
                                        <label>Aadhar No: </label><br>
                                        <input type="text" class="form-control" name="aadhar_no[]" required="" />
                                    </div>
                                    <div class="col-md-3">
                                        <label>Aadhar Image: </label><br>
                                        <input type="file" class="form-control" name="aadhar_image" required="" />
                                    </div>
                                </div>
                                <div class="clearfix">&nbsp;</div>
</form>

如果我对的话，则形式的数据看起来像这样：

        formData = {
            'aadhar_no[]' : ['123456789', '123456789', '123456789', '123456789'],
            'address[]' : [],
            'csrf_token' : csrf_token,
            'email[]' : [],
            'member_id' : member_id,
            'mobile[]' : [],
            'name[]' : [],
            'occupation[]' : [],
            'aadhar_image' : []
        }

Answer 1

HTML表单数据永远不会通过JavaScript发送。这两种主要类型是multipart/form-data，在您有文件字段时需要，application/x-www-form-urlencoded，这是默认，更紧凑。 Multipart/form-data像MIME编码的电子邮件一样发送：

您的数据将像这样发送。该规格在RFC 7578中： https：///wwwww.rfc-editor

Content-Type: multipart/form-data, boundary=---1234

---1234
Content-Disposition: form-data; name="name[]"

value-of-name-field
---1234 
Content-Disposition: form-data; name="address[]"

value-of-address-field
---1234 
Content-Disposition: form-data; name="occupation[]"

value-of-occupation-field
---1234 
......
Content-Disposition: form-data; name="aadhar_image[]"
Content-Type: multipart/mixed; boundary=---5678

--5678
Content-Disposition: file; filename="image.jpg"
Content-Type: image/jpg
Content-Transfer-Encoding: binary

.... jpeg image data ...
--5678
--1234

许多Web框架会为您转换为JSON，但这不是跨线的方式。