JAVA web 文件上传

js文件:

<%@ page language="java" contentType="text/html; charset=GBK"
         pageEncoding="GBK" import="entity.*"%>



<!DOCTYPE html>
<html>
<head>
    <title>添加商品</title>
    <style>
        #lo{
            width: 200px;
            height:200px;
            box-sizing:border-box;
            background-color:aquamarine;
            margin: auto;
        }
    </style>
    <style>
    body{
        text-align: center;
        line-height: 50px;
    }
</style>
</head>

<body id="lo">
<form action="add_products" method="post" enctype="multipart/form-data">
  <b>商品名称</b><input name="pname" value=><br>
  <b>商品介绍</b>  <textarea name="pintro" rows="20" cols="20"></textarea><br>
   <b>商品单价</b> <input name="pprice" value=><br>

   <%-- <div>
        <img id="preview"  alt="预览图片">
    </div>--%>
    <b> 商品图片</b><input type="file" name="ppricurl " id="fileInput" accept="image/*"><br>
     <div> <img id="preview" src="#" alt="预览图片" width="109" height="127" ></div>
    <p>
        <div>
    <button type="submit" onclick="return confirm('是否提交?')">提交</button>
    <button type="reset" onclick="return confirm('是否重置?')">重置</button>
        </div>
    </p>
</form>
<%--图片预览功能实现--%>
    <script>
        document.getElementById('fileInput').addEventListener('change', function(e) {
            var file = e.target.files[0];
            var reader = new FileReader();
            var preview = document.getElementById('preview');

            if (file) {
                // 清除之前的预览
                preview.src = "";

                reader.onloadend = function() {
                    // 设置预览图片的src属性为文件内容
                    preview.src = reader.result;
                };

                // 确保是图片文件
                if (file.type.match('image.*')) {
                    // 读取文件内容
                    reader.readAsDataURL(file);
                } else {
                    alert('请选择一个图片文件!');
                }
            }
        });
    </script>

</body>
</html>

重点代码1

<form action="add_products" method="post" enctype="multipart/form-data">

重点代码2

<%--图片预览功能实现--%>
    <script>
        document.getElementById('fileInput').addEventListener('change', function(e) {
            var file = e.target.files[0];
            var reader = new FileReader();
            var preview = document.getElementById('preview');

            if (file) {
                // 清除之前的预览
                preview.src = "";

                reader.onloadend = function() {
                    // 设置预览图片的src属性为文件内容
                    preview.src = reader.result;
                };

                // 确保是图片文件
                if (file.type.match('image.*')) {
                    // 读取文件内容
                    reader.readAsDataURL(file);
                } else {
                    alert('请选择一个图片文件!');
                }
            }
        });
    </script>

Servlet

package servlet;

import java.io.File;
import java.io.FileOutputStream;
import java.io.IOException;
import java.io.InputStream;
import java.util.List;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.*;
import org.apache.tomcat.util.http.fileupload.*;
import org.apache.tomcat.util.http.fileupload.disk.DiskFileItemFactory;
import org.apache.tomcat.util.http.fileupload.servlet.*;


import entity.Product;

import service.*;

@WebServlet(name = "aes", urlPatterns = { "/add_products" })
public class ProductaddServlet extends HttpServlet {
    private static final String UPLOAD_DIRECTORY = "uploads";
    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        request.setCharacterEncoding("GBK");//设置接收数据的字符集为中文
        FileUpload fu = new FileUpload();
        fu.setFileItemFactory(new DiskFileItemFactory());
try {
    IProductService ps=new ProductServiceImpl();
            // List<FileItem> inputs =
            // fu.parseRequest(request);//旧版Tomcat写法,新版不支持
            List<FileItem> inputs = fu.parseRequest(new ServletRequestContext(request));
            // 获取每个输入框的数据
            String name = inputs.get(0).getString("GBK");
            String intro = inputs.get(1).getString("GBK");
            String priceStr = inputs.get(2).getString();
            double price = Double.parseDouble(priceStr);
  //截取文件名
    String pricurl = inputs.get(3).getName();
           System.out.println(pricurl);
//获取本地文件路径
    String path="D:\\ja\\rpq\\web\\img\\";
 //获取远程服务器的文件路径
    path+=pricurl;
 //创建远程服务器的文件对象,并上传到服务器
    inputs.get(3).write(new File(path));
          ps.adder(name,intro,price,pricurl);
           response.sendRedirect("product_list");
        } catch (FileUploadException e) {
            e.printStackTrace();
        } catch (Exception e) {
            throw new RuntimeException(e);
        }


    }
}


重点代码1

 request.setCharacterEncoding("GBK");//设置接收数据的字符集为中文
        FileUpload fu = new FileUpload();
        fu.setFileItemFactory(new DiskFileItemFactory());
try {
    IProductService ps=new ProductServiceImpl();
            // List<FileItem> inputs =
            // fu.parseRequest(request);//旧版Tomcat写法,新版不支持
            List<FileItem> inputs = fu.parseRequest(new ServletRequestContext(request));
            // 获取每个输入框的数据
            String name = inputs.get(0).getString("GBK");
            String intro = inputs.get(1).getString("GBK");
            String priceStr = inputs.get(2).getString();
            double price = Double.parseDouble(priceStr);
  //截取文件名
    String pricurl = inputs.get(3).getName();
           System.out.println(pricurl);
//获取本地文件路径
    String path="D:\\ja\\rpq\\web\\img\\";
 //获取远程服务器的文件路径
    path+=pricurl;
 //创建远程服务器的文件对象,并上传到服务器
    inputs.get(3).write(new File(path));
          ps.adder(name,intro,price,pricurl);
           response.sendRedirect("product_list");
        } catch (FileUploadException e) {
            e.printStackTrace();
        } catch (Exception e) {
            throw new RuntimeException(e);
        }

上述代码是实现购物网站中添加商品功能:

有不懂的或者需要全部源代码的可以私信或评论

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值