思享工具箱

multipart/form-data 文件上传表单中 传递参数无法获取的原因!

摘要：
表单项type=filed只能获取获取文件的名字不能获取文件的内容。name=%22hello+world%22&file=temp.png&submit=submitHTTP/1.1get请求get请求和multipart/form-data结合无效，因为文件上传需要请求体。...A8..LS...(.u.......D.b......b.....o&..;..˂.1......IEND.B`.------WebKitFormBoundaryIZDrYHwuf2VJdpHwContent-Disposition:form-data;name="submit"submit------WebKitFormBoundaryIZDrYHwuf2VJdpHw--总结：参数获取不到主要是因为在使用multipart/form-data属性之后请求体发生了变化。otherName="+document.upload.otherName.value;document.upload.action=action;document.upload.submit();}通过修改服务器端代码。
1.什么是multipart/form-data

首先我们需要明白在html中的enctype属性，
enctype：规定了form表单在发送到服务器时候编码方式。他有如下的三个值。

  • ①application/x-www-form-urlencoded。默认的编码方式。
    但是在用文本的传输和MP3等大型文件的时候，使用这种编码就显得 效率低下。
  • ②multipart/form-data 。
    指定传输数据为二进制类型，比如图片、mp3、文件。
  • ③text/plain。
    纯文体的传输。
    空格转换为 “+” 加号，但不对特殊字符编码。
2.明确在enctype参数为application/x-www-form-urlencoded的时候post和get请求参数和请求体是什么形式的

get请求

请求头：

GET  /www.xxx.com?name=%22hello+world%22&**file=temp.png**&submit=submit HTTP/1.1

因为get请求没有请求体，所有他的所有参数都是在url的后边添加。type=file的表单项只能获取到文件的名字，并不能获取文件的内容。

post请求

请求头：

POST /www.baidu.com HTTP/1.1

请求体：

name=%22hello+world%22&file=temp.png&submit=submit

总结

  • （1）我们可以发现不管是post请求和get请求，他们的参数存在的形式都是不变的，通过key=value的形式存在。
  • （2）表单项type=filed只能获取获取文件的名字不能获取文件的内容。
3. 明确在enctype参数为multipart/form-data的时候post和get请求参数和请求体是什么形式的

get请求
请求头：

GET/www.xxx.com?name=%22hello+world%22&file=temp.png&submit=submit HTTP/1.1

get请求

get请求和multipart/form-data结合无效，因为文件上传需要请求体。

post请求：

请求头：

POST /www.xxx.com HTTP/1.1

请求体：

------WebKitFormBoundaryIZDrYHwuf2VJdpHw
Content-Disposition: form-data; name="name"

"hello world"
------WebKitFormBoundaryIZDrYHwuf2VJdpHw
Content-Disposition: form-data; name="file"; filename="temp.png"
Content-Type: image/png

.PNG
.
...
IHDR...
..........Y../..,+|.$aIk.v...G?...P.P,,...m..e.2....v.7.	pHYs...%...%.IR$....|IDAT(.cTT....................:.?.......}.(.Pd`A..V...L...?..#.....4.o..LS.....W.d.?...A8..LS...(.u.......D.b......b.....o&..;..<.1......IEND.B`.
------WebKitFormBoundaryIZDrYHwuf2VJdpHw
Content-Disposition: form-data; name="submit"

submit
------WebKitFormBoundaryIZDrYHwuf2VJdpHw--

通过观察发现这个的请求体就发生了变化。这种请求体被称之为多部件请求体。
什么是多部件请求体：就是把每一个表单项分割为一个部件。
因为表单项分为普通表单项和文件表单项，所以说部件也有区别。

  • 普通表单项：
    一个请求头：Content-Disposition: form-data; name=”name”
    一个请求体：里面就是我们表单的值”hello world”

  • 文件表单项：
    两个请求头：

Content-Disposition: form-data; name="file"; filename="temp.png"
Content-Type: image/png

一个请求体：

.PNG
.
...
IHDR...
..........Y../..,+|.$aIk.v...G?...P.P,,...m..e.2....v.7.	pHYs...%...%.IR$....|IDAT(.cTT....................:.?.......}.(.Pd`A..V...L...?..#.....4.o..LS.....W.d.?...A8..LS...(.u.......D.b......b.....o&..;..<.1......IEND.B`.
------WebKitFormBoundaryIZDrYHwuf2VJdpHw
Content-Disposition: form-data; name="submit"

submit
------WebKitFormBoundaryIZDrYHwuf2VJdpHw--

总结：参数获取不到主要是因为在使用multipart/form-data属性之后请求体发生了变化。不是key=value的形式出现所以说获取不到。
解决办法：
（1）我们可以通过js代码来些修改，把我们的参数追加在url的后边。

<form   name="upload" action="fileftp.jsp" method="post" ENCTYPE="multipart/form-data">
    <input type="hidden" name="otherName"   value="abcdefg"/>  
    <td nowrap>
        <input type="file"   name="file1" value="" size="40"  />
        <input type="submit" value="上传"  />
    </td>   
</form>

<script language="javascript">      
function formSubmit(){
    var action="fileftp.jsp";       
    action+="?otherName="+document.upload.otherName.value;
    document.upload.action=action;      
    document.upload.submit();
}
</script>

（2）通过修改服务器端代码。前提是利用jar包。
commons-fileupload-1.2.2.jar和commons-io-1.4.jar

//创建工厂
DiskFileItemFactory factoy=new DiskFileItemFactory();
//创建解析器
ServletFileUpload sfu=new ServletFileUpload(factoy);
//解析request
try {
    List<FileItem> list=sfu.parseRequest(request);

    for (FileItem fileItem : list) {

        fileItem.getFieldName();
        System.out.println(fileItem.getString());
    }

} catch (FileUploadException e) {
    // TODO Auto-generated catch block
    e.printStackTrace();
}

package cn.zll.bookstore.adminbook.servlet;

import java.awt.Image;
import java.io.File;
import java.io.IOException;
import java.util.List;
import java.util.UUID;

import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.swing.ImageIcon;

import org.apache.commons.fileupload.FileItem;
import org.apache.commons.fileupload.FileUploadBase;
import org.apache.commons.fileupload.FileUploadException;
import org.apache.commons.fileupload.disk.DiskFileItemFactory;
import org.apache.commons.fileupload.servlet.ServletFileUpload;

import cn.zll.bookstore.adminbook.service.service;
import cn.zll.bookstore.book.domain.Book;

public class UploadServlet extends HttpServlet {


    public void doPost(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {
        service s=new service();
        response.setContentType("text/html;charset=utf-8");
        request.setCharacterEncoding("utf-8");

        //文件上传的三部曲
        //创建工厂
        DiskFileItemFactory factoy=new DiskFileItemFactory();
        //创建解析器
        ServletFileUpload sfu=new ServletFileUpload(factoy);
        //设置上传文件的大小
        sfu.setFileSizeMax(20*1024);
        //解析request
        try {
            List<FileItem> list=sfu.parseRequest(request);
            Book b=new Book();
            b.setBid(UUID.randomUUID().toString().replace("-", ""));
            String bname=list.get(0).getString("utf-8");
            b.setBname(bname);
            System.out.println(bname);
            String price=list.get(2).getString("utf-8");
            b.setPrice(price);
            String author=list.get(3).getString("utf-8");
            b.setAuthor(author);
            String cid=list.get(4).getString("utf-8");
            b.setCid(cid);
            System.out.println(bname+price+author+cid);
//          图书名称：<input   type="text" name="bname"/><br/>
//          图书图片：<input   type="file" name="image"/><br/>
//          图书单价：<input   type="text" name="price"/><br/>
//          图书作者：<input   type="text" name="author"/><br/>
//          图书分类：<select   name="cid">
//      
//          
            //设置图片保存的目录
            String path=this.getServletContext().getRealPath("/book_img");
            //得到文件名称
            String fileName=UUID.randomUUID().toString().replace("-", "")+"_"+list.get(1).getName();
            //校验图片的格式
            if(!fileName.toLowerCase().endsWith("jpg")){
                System.out.println("图片格式不是jpg");
                request.setAttribute("msg", "你的图片格式不是jpg格式");
                request.getRequestDispatcher("/adminjsps/admin/book/add.jsp").forward(request, response);
                return;
            }
            //使用目录和文件名称创建目标文件
            File f=new File(path,fileName);
            //保存文件
            list.get(1).write(f);
            //校验图片的尺寸
            Image image=new ImageIcon(f.getAbsolutePath()).getImage();
            if(image.getWidth(null)>200 || image.getHeight(null)>200){
                f.delete();
                request.setAttribute("msg", "图片的尺寸太大");
                request.getRequestDispatcher("/adminjsps/admin/book/add.jsp").forward(request, response);

            }
            //设置book的属性
            b.setImage("book_img/"+fileName);
            s.add(b);
            request.setAttribute("msg", "添加成功");
            request.getRequestDispatcher("/adminjsps/admin/book/add.jsp").forward(request, response);
            System.out.println("fileName:"+fileName);
            System.out.println(path);
        } catch (FileUploadException e) {
            if(e instanceof FileUploadBase.FileSizeLimitExceededException){

                System.out.println("你上传的文件大于15K");
                request.setAttribute("msg", "你的图片大于15k");
                request.getRequestDispatcher("/adminjsps/admin/book/add.jsp").forward(request, response);
                return;
            }

            e.printStackTrace();
        } catch (Exception e) {
            // TODO Auto-generated catch block
            e.printStackTrace();
        }


    }

}

标签：#submit#html表单 | 浏览：622 | 发布日期：

免责声明：文章转载自《multipart/form-data 文件上传表单中 传递参数无法获取的原因!》仅用于学习参考。如对内容有疑问，请及时联系本站处理。

上篇CVE2016-8863libupnp缓冲区溢出漏洞原理分析及PocSTM32CubeMX + LWIP---无操作系统以太网实现下篇

宿迁高防，2C2G15M，22元/月；香港BGP，2C5G5M，25元/月 雨云优惠码：MjYwNzM=

相关文章

Form表单提交数据的几种方式

一、submit提交 在form标签中添加Action(提交的地址)和method(post),且有一个submit按钮（<input type=’submit’>）就可以进行数据的提交，每一个input标签都需要有一个name属性，才能进行提交。 <form action=’http://www.123.com/postValue’ me...

基于Python的Web应用开发实战——3 Web表单

第2章中介绍的 请求对象 包含客户端发出的所有请求信息。 其中， request.form 能获取 POST请求 中提交的表单数据。 尽管Flask的请求对象提供的信息足够用于处理Web表单，但有些任务很单调，而且要重复操作。 比如，生成表单的HTML代码和验证提交的表单数据。 Flask-WTF（https://flask-wtf.readthedocs...

4 使用Selenium模拟登录csdn，取出cookie信息，再用requests.session访问个人中心（保持登录状态）

代码： # -*- coding: utf-8 -*- """ Created on Fri Jul 13 16:13:52 2018 @author: a """ from selenium import webdriver from selenium.webdriver.common.by import By from selenium.webdr...

前端笔记——如何控制表单控件中的disabled

0.前言     本文主要说明如何使能或禁止表单控件。表单控件具有disabled属性，通过设置该属性可以禁止所有的input控件，input的更多属性请参考资料【1】。下面就通过一个简单的例子说明如何设置和读取disabled属性。 [html] <!DOCTYPE html> <html> <head>...

PHP WEB安全问题

规则 1：绝不要信任外部数据或输入 关于 Web 应用程序安全性，必须认识到的第一件事是不应该信任外部数据。外部数据（outside data） 包括不是由程序员在 PHP 代码中直接输入的任何数据。在采取措施确保安全之前，来自任何其他来源（比如 GET 变量、表单 POST、数据库、配置文件、会话变量或 cookie）的任何数据都是不可信任的。 例如，下...

js 控制按钮点击后不可用

为了防止用户多次点击某按钮，造成多次提交表单的操作。某些按钮需要在点击后实现不可用操作。 例子： <html> <head> <title>同意条款</title> </head> <body> <form id="form1"name="form1"method="post"a...

最新文章

随机推荐

思享工具箱导航