文件的上传和下载

1->文件的上传

文件的上传，采用的是uploadify.js这个插件.

本事例实现的是上传图片文件，其他的文件上传也一样。

2->文件的下载

文件的下载有两个实现的方式：

1->url路径指向文件的路径，浏览器自行下载。但此方法存在缺陷：图片文件，text，pdf等文件会在浏览器中自动显示，不会执行下载功能

2->使用beego带有的下载方法，执行下载功能

3>新建一个fileopt.go控制器,具体代码如下:

package controllers

import (

	"fmt"

	"strings"

	"path"

	"github.com/astaxie/beego"

)

type FileOptUploadController struct {

	beego.Controller

}

//上传下载文件的页面

func (c *FileOptUploadController) Get() {

	c.TplName = "fileopt.html"

}

//上传文件

func (this *FileOptUploadController) Post() {

    //image，这是一个key值，对应的是html中input type-‘file’的name属性值

	f, h, _ := this.GetFile("image")

	//得到文件的名称

	fileName := h.Filename

	arr := strings.Split(fileName, ":")

	if len(arr) > 1 {

	  index := len(arr) - 1

	  fileName = arr[index]

	}

	fmt.Println("文件名称:")

	fmt.Println(fileName)

	//关闭上传的文件，不然的话会出现临时文件不能清除的情况

	f.Close()

	//保存文件到指定的位置

	//static/uploadfile,这个是文件的地址，第一个static前面不要有/

	this.SaveToFile("image", path.Join("static/uploadfile",fileName))

	//显示在本页面，不做跳转操作

	this.TplName = "fileopt.html"

}

//下载文件

type FileOptDownloadController struct {

	beego.Controller

}

func (this *FileOptDownloadController) Get() {

	//图片,text,pdf文件全部在浏览器中显示了，并没有完全的实现下载的功能

	//this.Redirect("/static/img/1.jpg", 302)

	//第一个参数是文件的地址，第二个参数是下载显示的文件的名称

	this.Ctx.Output.Download("static/img/1.jpg","tu1.jpg")

}

　　

4>新建一个html页面,名为fileopt.html,其代码如下:

<!DOCTYPE html>

 

<html>

      <head>

        <title>首页 - 用户列表页面</title>

        <link rel="shortcut icon" href="/static/img/favicon.png" />

        <link rel="stylesheet" href="/static/uploadify/uploadify.css" rel="stylesheet"/>

        <script type="text/javascript" src="/static/js/jquery-2.1.1.min.js"></script> 

        <script src="/static/uploadify/jquery.uploadify.min.js"></script>

      </head>    

    <body>

        <!--上传部分-->

        <form method="POST" action="/Home/UploadFile" enctype="multipart/form-data">

            <input type="file" name="image" id="file_upload">

            <div id="imgdiv" style="display:none;">

            </div>

        </form>

        <!--下载图片-->

        <button value="下载图片" onclick="download()">下载图片</button>

        <!--JS部分-->

       <script type="text/javascript">

        //页面的初始化

        $(function () {

            $("#file_upload").uploadify({       //绑定元素

            'fileObjName':'image',//html input标签的name属性的值吧。

            'debug':false,

            'auto':true,    //自动上传

            'multi':true,

            'removeCompleted':false, //上传完成以后是否保存进度条

            'buttonText':'选择文件',

            'cancelImg':'/static/uploadify/uploadify-cancel.png',

            'swf':'/static/uploadify/uploadify.swf', //必须设置  swf文件路径

            'uploader':'/Home/FileOpt',         //必须设置，上传文件触发的url

            'fileTypeDesc':'FileType',

            'fileTypeExts':'*.jpg;*.jpge;*.gif;*.png;',

            'multi':true,

            'onUploadSuccess': function (file, data, response) {

               $("#imgdiv").show();

               var html='<image src="/static/uploadfile/'+file.name+'" style="height:150px;width:150px;margin:20px;"/>';

               $("#imgdiv").append(html);

            }

          });         

        });

        //下载图片

        function download(){

          window.location.href="/Home/FileDown";

        }

</script>

    </body>

</html>

　　

5>在路由中添加路由

package routers

import (

         "secondweb/controllers"

         "github.com/astaxie/beego"

)

func init() {

         beego.Router("/", &controllers.MainController{})

         beego.Router("/Home/PageData", &controllers.UserController{})

         beego.Router("/Home/PageNextData", &controllers.YonghuController{})

         beego.Router("/Home/Index", &controllers.PageController{})

         beego.Router("/Home/EasyUI", &controllers.EasyUIController{})

         beego.Router("/Home/EasyUIData", &controllers.EasyUIDataController{})

         beego.Router("/Home/FileOpt", &controllers.FileOptUploadController{})

         beego.Router("/Home/FileDown", &controllers.FileOptDownloadController{})

}

　　

6>项目的结构如下:

7>执行的效果如下:

1->文件操作的页面如下，路由如下:

2->点击选择文件按钮，选择需要上传的图片，点击打开按钮，效果如下:

3->点击下载图片按钮，浏览器下载一张指定的图片

8>下一章，将文件内容的读取。

Beego 学习笔记11：文件的上传下载的更多相关文章

  1. [原创]java WEB学习笔记72：Struts2 学习之路-- 文件的上传下载，及上传下载相关问题

    本博客的目的:①总结自己的学习过程,相当于学习笔记 ②将自己的经验分享给大家,相互学习,互相交流,不可商用 内容难免出现问题,欢迎指正,交流,探讨,可以留言,也可以通过以下方式联系. 本人互联网技术爱 ...

  2. php学习笔记：文件的上传（包含设置文件的上传大小限制）

    今天写的是文件上传,前几天自学的正规则又忘记了,用了很笨的方法去判断格式,直接上代码: <?php /** * Created by PhpStorm. * User: Administrato ...

  3. JAVAWEB之文件的上传下载

    文件上传下载 文件上传: 本篇文章使用的文件上传的例子使用的都是原生技术,servelt+jdbc+fileupload插件,这也是笔者的习惯,当接触到某些从未接触过的东西时,总是喜欢用最原始的东西将 ...

  4. 在Window的IIS中创建FTP的Site并用C#进行文件的上传下载

    文件传输协议 (FTP) 是一个标准协议,可用来通过 Internet 将文件从一台计算机移到另一台计算机. 这些文件存储在运行 FTP 服务器软件的服务器计算机上. 然后,远程计算机可以使用 FTP ...

  5. 创建FTP的Site并用C#进行文件的上传下载

    创建FTP的Site并用C#进行文件的上传下载 文件传输协议 (FTP) 是一个标准协议,可用来通过 Internet 将文件从一台计算机移到另一台计算机. 这些文件存储在运行 FTP 服务器软件的服 ...

  6. linux链接及文件互相上传下载

    若排版紊乱可查看我的个人博客原文地址 基本操作 本篇博客主要介绍如何去链接远程的linux主机及如何实现本地与远程主机之间文件的上传下载操作,下面的linux系统是CentOS6.6 链接远程linu ...

  7. Spring实现文件的上传下载

    背景:之前一直做的是数据库的增删改查工作,对于文件的上传下载比较排斥,今天研究了下具体的实现,发现其实是很简单.此处不仅要实现单文件的上传,还要实现多文件的上传. 单文件的下载知道了,多文件的下载呢? ...

  8. SocketIo+SpringMvc实现文件的上传下载

    SocketIo+SpringMvc实现文件的上传下载 socketIo不仅可以用来做聊天工具,也可以实现局域网(当然你如果有外网也可用外网)内实现文件的上传和下载,下面是代码的效果演示: GIT地址 ...

  9. SSM框架之中如何进行文件的上传下载

    SSM框架的整合请看我之前的博客:http://www.cnblogs.com/1314wamm/p/6834266.html 现在我们先看如何编写文件的上传下载:你先看你的pom.xml中是否有文件 ...

  10. python使用ftplib模块实现FTP文件的上传下载

    python已经默认安装了ftplib模块,用其中的FTP类可以实现FTP文件的上传下载 FTP文件上传下载 # coding:utf8 from ftplib import FTP def uplo ...

随机推荐

  1. Nginx——请求head被过滤

    前言 nginx代理服务器,app发出的请求头被直接过滤了,当时想到nginx会自动过滤掉带有_的请求头信息,所以直接改了Nginx的配置当然也可以将app的request中header中的_改为- ...

  2. 搭建代理服务器时的笔记，request使用笔记

    request 请求笔记: 1.opation中使用form字段传参 对应 content-type': 'application/x-www-form-urlencoded',如果想要content ...

  3. split分割字符串返回字符串数组

    <script type="text/javascript"> var str='liu jin yu'; var str1=str.split(' '); docum ...

  4. ValueError: Dependency on app with no migrations: customuser

    You haven't run manage.py makemigrations customuser to create the migrations for your CustomUser app ...

  5. IIS 报错 Cannot open database "test4" requested by the login. The login failed. Login failed for user 'IIS APPPOOL\test1'.

    报错: Cannot open database "test4" requested by the login. The login failed. Login failed fo ...

  6. 从$a_n=f(n)$的角度理解数列中的表达式$a_{n+1}=\frac{k}{a_n}$

    函数周期性 前面我们学习过函数的周期性的给出方式: \(f(x+a)=f(x)\) \(\hspace{2cm}\) \(T=a\) \(f(x+a)=-f(x)\) \(\hspace{2cm}\) ...

  7. vue+element table的弹窗组件

    在处理表格编辑相关的需求,是需要做一个弹框进行保存的:或者查看表格数据的详细信息时,也是需要做弹窗: 当然 ,这是类似于这样的 ,当然 element 已经帮我们做好 弹窗这一块 主要 我想记录的是 ...

  8. bat无线热点设置

    netsh wlan set hostednetwork mode=allow ssid=happyla key=1234567890netsh wlan start hostednetwork

  9. 【计算机视觉】BRIEF特征匹配

    Binary Robust Independent Elementary Features www.cnblogs.com/ronny 1. BRIEF的基本原理 我们已经知道SIFT特征采用了128 ...

  10. python三级联动

    #以字典的形式 保存相关省市数据 menu={ '北京':{ '朝阳':{ '国贸':{ 'CICC':{}, 'HP':{}, '银行':{}, 'CCTV':{} }, '望京':{ '陌陌':{ ...