Html5下载文件前后端的示例代码

发布时间:2021-09-18 13:37:18 作者:小新
来源:亿速云 阅读:149

这篇文章主要为大家展示了“Html5下载文件前后端的示例代码”,内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带领大家一起研究并学习一下“Html5下载文件前后端的示例代码”这篇文章吧。

一、前端代码

</!DOCTYPE html>
<html>
<head>
	<title></title>
	<script>
		function download(){
			const link = document.createElement('a')
		      link.download = "template.xlsx"
		      link.style.display = 'none'
		      link.href = 'http://localhost:8080/test/downloadTemplate'
		      document.body.appendChild(link)
		      link.click()
		}
	</script>
</head>
<body>
	<input type="button" onclick="download()" name="download" value="download" />
</body>
</html>

二、后端代码

 /**
     * 下载导入模板
     *
     * @param response
     * @return
     */
    @GetMapping(value = "downloadTemplate")
    @ResponseBody
    public void downloadTemplate(HttpServletResponse response) {
        File templatePath = new File("D:/tempTest");
        if (!templatePath.exists()) {
            templatePath.mkdirs();
        }

        InputStream in = null;
        OutputStream out = null;
        try {
            String fileName = "template.txt";
            File file = new File("D:/tempTest/" + fileName);

            if(!file.exists()){
                file.createNewFile();
            }

            in = new BufferedInputStream(new FileInputStream(file));
            // 设置response的Header
            response.addHeader("Content-Disposition", "attachment;filename=" + new String(fileName.getBytes()));
            response.addHeader("Content-Length", "" + file.length());
            out = new BufferedOutputStream(response.getOutputStream());
            response.setContentType("application/octet-stream");

            byte[] buffer = new byte[1024];
            int count;
            while ((count = in.read(buffer)) > 0) {
                out.write(buffer, 0, count);
            }

            out.flush();
        } catch (Exception e) {
            e.printStackTrace();
        } finally {
            try {
                if (in != null) {
                    in.close();

                }
                if (out != null) {
                    out.close();
                }
            } catch (IOException e) {
            }
        }

    }

以上是“Html5下载文件前后端的示例代码”这篇文章的所有内容,感谢各位的阅读!相信大家都有了一定的了解,希望分享的内容对大家有所帮助,如果还想学习更多知识,欢迎关注亿速云行业资讯频道!

推荐阅读:
  1. 【HTML5示例代码分享】HTML5图片自动归类特效
  2. 【示例代码】超萌休闲HTML5小游戏—打地鼠

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

html5

上一篇:如何利用Prototype污染方法绕过常见的HTML XSS检查器

下一篇:JavaScript中标签属性和历史遗留问题的示例分析

相关阅读

您好,登录后才能下订单哦!

密码登录
登录注册
其他方式登录
点击 登录注册 即表示同意《亿速云用户服务条款》