Question

我一次使用p-upload上传多文件。 HTML代码如下。

 <p-fileUpload name="file" url="./upload.php" (onUpload)="onUpload($event)" (uploadHandler)="uploadHandler($event,form)"
                          multiple="multiple" accept="image/*,application/*" (onBeforeUpload)="onBeforeUpload($event)"
                          chooseLabel="choose" uploadLabel="upload" cancelLabel="cancel" #form>
                <ng-template pTemplate="content">
                    <ul *ngIf="uploadedFiles.length">
                        <li *ngFor="let file of uploadedFiles">{{file.name}} - {{file.size}} bytes</li>
                    </ul>
                </ng-template>

发送请求后，请求playload：

------WebKitFormBoundarymBQWZzMTQIYWChSD
Content-Disposition: form-data; name="access_token"

token_725186200
------WebKitFormBoundarymBQWZzMTQIYWChSD
Content-Disposition: form-data; name="file"; 
filename="32735073444_83b7a691dc_k.jpg"
Content-Type: image/jpeg

------WebKitFormBoundarymBQWZzMTQIYWChSD
Content-Disposition: form-data; name="file"; 
filename="32764885503_1a04915b11_k.jpg"
Content-Type: image/jpeg

------WebKitFormBoundarymBQWZzMTQIYWChSD--

查看代码，名称属性是相同的。但是我想 name =“file1”，name =“file2”。如何解决这个问题？有人可以帮帮我吗？我很迷惑。

Answer 1

这是您获得的正常响应标头。

name属性实际上是表单中HTML字段的名称。您无法将输入字段名称设置为您上传的每个文件，例如：＆＃39; 文件1 ＆＃39;，＆＃39; 文件2 ＆＃39;

检查Content-Disposition文档

如果要在后端标识多个文件，可以使用字符串数组作为名称值

<p-fileUpload name="myfile[]

Answer 2

总之，首先，当您使用一个输入并请求多个文件时，name属性可以设置相同的值。请求playload将如下所示：

------WebKitFormBoundarymBQWZzMTQIYWChSD
Content-Disposition: form-data; name="access_token"

token_725186200
------WebKitFormBoundarymBQWZzMTQIYWChSD
Content-Disposition: form-data; name="file"; 
filename="32735073444_83b7a691dc_k.jpg"
Content-Type: image/jpeg

------WebKitFormBoundarymBQWZzMTQIYWChSD
Content-Disposition: form-data; name="file"; 
filename="32764885503_1a04915b11_k.jpg"
Content-Type: image/jpeg

------WebKitFormBoundarymBQWZzMTQIYWChSD--

其次，当使用多输入和请求多个文件时，名称将无法设置相同的值。请求将如下所示：

------WebKitFormBoundarymBQWZzMTQIYWChSD
Content-Disposition: form-data; name="access_token"

token_725186200
------WebKitFormBoundarymBQWZzMTQIYWChSD
Content-Disposition: form-data; name="file_1"; 
filename="32735073444_83b7a691dc_k.jpg"
Content-Type: image/jpeg

------WebKitFormBoundarymBQWZzMTQIYWChSD
Content-Disposition: form-data; name="file_2"; 
filename="32764885503_1a04915b11_k.jpg"
Content-Type: image/jpeg

------WebKitFormBoundarymBQWZzMTQIYWChSD--

顺便说一句，name属性值取决于你设置的值。

第三，无论是使用输入还是多输入来上传多文件，服务器代码都是不同的。

primeNG p-upload一次上传muti文件时如何设置不同的名称值

2 个答案: