免费三级大片,日日操天天操,色阁五月

Layui框架實現文件上傳

基本的思路就是隨便創建一個元素，然后使用layui的upload組件對創建的元素進行渲染，詳見代碼

				?

									<!DOCTYPE html>

									<html lang="en">

									<head>

									    <script src="jquery-3.5.0.min.js" type="text/javascript"></script> <!-- jquery包，記得替換為你本地的路徑 -->

									    <link rel="stylesheet" href="layui/css/layui.css" rel="external nofollow" > <!--layui框架的樣式庫 同樣你本地的路徑 -->

									    <script src="pkg/layui/layui.js"></script><!--enmmm 沒錯，路徑-->

									</head>   

									<body>

									<!-- 這里我是用的a標簽，當然你可以使用別的 label、button等均可-->

									 <a href="javascript:(0);" rel="external nofollow"  id="attachment-upload">+添加附件</a>

									</body>

									<script>

									    //以layui.js的方式引入使用時需要手動加載layui的組件

									    layui.use(['layer','upload'],function(){ // PS：個人理解，該行只是為了引入layui框架的組件，html文件加載完畢后執行，內部的代碼和直接寫在script標簽內沒啥區別，只是可以在代碼中使用layer了

									    // 此處引入layer只是為了打印一些東西

									        var layer = layui.layer,

									        upload = layui.upload;

									    // 渲染元素，使其支持文件上傳

									    // 詳情請移步 https://www.layui.com/doc/modules/upload.html

									    // https://www.layui.com/demo/upload.html

									     upload.render({

									            elem: '#attachment-upload', // 感覺利用了jquery的id選擇器，這里用#id(上傳附件的標簽、按鈕值類型元素id)就可以了

									            url: dev_url + "fc/upload", // 后端接收上傳文件的接口地址

									            headers: {   // 這里官方文檔中沒有，是在請求后端接口時在request header中增加一些請求參數，實測可行

									                'api_token': uInfo

									            },

									            accept: 'file', // 這里可以限定支持上傳文件的類型，詳見文檔

									            done: function (res) { // 調用后端上傳文件接口后的返回

									           // 這里解析下后端的返回字段，具體怎么著看業務吧

									                if (res.success == false) {

									                    layer.msg("上傳文件失敗!" + res.msg);

									                }

									        });

									})

									</script>

									</html>

PS：注意下使用layui上傳文件的請求格式為multiply/form-data，參數為file,(binary)格式

Golang Gin框架實現文件下載功能的示例代碼

Gin框架獲取前端上傳的文件

				?

									func UploadFileControl(c *gin.Context) {

									    logrus.Infof("[UploadFileControl] user_id =%d", userId)

									    // GIN框架獲取前端上傳文件

									    // 這里的參數其實是上傳文件時的字段名，也就是上面圖片中的file，如果前端是自己定義的其他字段名，需要替換下

									    uploadFile, fileHeader, err := c.Request.FormFile("file")

									    if err != nil {

									        c.JSON(http.StatusOK, gin.H{

									            "success": false,

									            "msg":     "獲取文件信息失敗!" + err.Error(),

									        })

									    }

									    if uploadFile != nil { // 記得及時關閉文件，避免內存泄漏

									        defer uploadFile.Close()

									    }

									// 讀取上傳文件的內容

									// 其實這里直接讀取所有不太合理,如果文件過大時會占用很多內存，可以考慮使用緩沖區讀取

									    fileContent, err := ioutil.ReadAll(uploadFile)

									    if err != nil {

									        c.JSON(http.StatusOK, gin.H{

									            "success": false,

									            "msg":     "讀取文件內容失敗!" + err.Error(),

									        })

									    }

									// 接受到文件后的處理方式，可以保存到本地，也可以上傳到文件對象，看自己了

									    /*fileId, err := oss.GetOssClient().UploadFile(userId, fileHeader.Filename, fileContent)

									    if err != nil {

									        logrus.Errorf("[UploadFile] error,user_id = %d,err_msg= %s", userId, err.Error())

									        c.JSON(http.StatusOK, gin.H{

									            "success": false,

									            "msg":     "上傳文件失敗!請稍后再試",

									        })

									    }*/

									// 這里向前端返回下上傳成功的信息

									    c.JSON(http.StatusOK, gin.H{

									        "success":   true,

									        "msg":       "",

									    })

									}

Gin框架的文件下載

Response Header中的Content-Type指定了服務器端返回數據的類型，瀏覽器自己是可以處理這些類型的，當返回的數據為文件類型時，瀏覽器會自行下載。具體的類型和content-type的對應方式可見

文件擴展名	Content-Type(Mime-Type)	文件擴展名	Content-Type(Mime-Type)
.*（二進制流，不知道下載文件類型）	application/octet-stream	.tif	image/tiff
.001	application/x-001	.301	application/x-301
.323	text/h323	.906	application/x-906
.907	drawing/907	.a11	application/x-a11
.acp	audio/x-mei-aac	.ai	application/postscript
.aif	audio/aiff	.aifc	audio/aiff
.aiff	audio/aiff	.anv	application/x-anv
.asa	text/asa	.asf	video/x-ms-asf
.asp	text/asp	.asx	video/x-ms-asf
.au	audio/basic	.avi	video/avi
.awf	application/vnd.adobe.workflow	.biz	text/xml
.bmp	application/x-bmp	.bot	application/x-bot
.c4t	application/x-c4t	.c90	application/x-c90
.cal	application/x-cals	.cat	application/vnd.ms-pki.seccat
.cdf	application/x-netcdf	.cdr	application/x-cdr
.cel	application/x-cel	.cer	application/x-x509-ca-cert
.cg4	application/x-g4	.cgm	application/x-cgm
.cit	application/x-cit	.class	java/*
.cml	text/xml	.cmp	application/x-cmp
.cmx	application/x-cmx	.cot	application/x-cot
.crl	application/pkix-crl	.crt	application/x-x509-ca-cert
.csi	application/x-csi	.css	text/css
.cut	application/x-cut	.dbf	application/x-dbf
.dbm	application/x-dbm	.dbx	application/x-dbx
.dcd	text/xml	.dcx	application/x-dcx
.der	application/x-x509-ca-cert	.dgn	application/x-dgn
.dib	application/x-dib	.dll	application/x-msdownload
.doc	application/msword	.dot	application/msword
.drw	application/x-drw	.dtd	text/xml
.dwf	Model/vnd.dwf	.dwf	application/x-dwf
.dwg	application/x-dwg	.dxb	application/x-dxb
.dxf	application/x-dxf	.edn	application/vnd.adobe.edn
.emf	application/x-emf	.eml	message/rfc822
.ent	text/xml	.epi	application/x-epi
.eps	application/x-ps	.eps	application/postscript
.etd	application/x-ebx	.exe	application/x-msdownload
.fax	image/fax	.fdf	application/vnd.fdf
.fif	application/fractals	.fo	text/xml
.frm	application/x-frm	.g4	application/x-g4
.gbr	application/x-gbr	.	application/x-
.gif	image/gif	.gl2	application/x-gl2
.gp4	application/x-gp4	.hgl	application/x-hgl
.hmr	application/x-hmr	.hpg	application/x-hpgl
.hpl	application/x-hpl	.hqx	application/mac-binhex40
.hrf	application/x-hrf	.hta	application/hta
.htc	text/x-component	.htm	text/html
.html	text/html	.htt	text/webviewhtml
.htx	text/html	.icb	application/x-icb
.ico	image/x-icon	.ico	application/x-ico
.iff	application/x-iff	.ig4	application/x-g4
.igs	application/x-igs	.iii	application/x-iphone
.img	application/x-img	.ins	application/x-internet-signup
.isp	application/x-internet-signup	.IVF	video/x-ivf
.java	java/*	.jfif	image/jpeg
.jpe	image/jpeg	.jpe	application/x-jpe
.jpeg	image/jpeg	.jpg	image/jpeg
.jpg	application/x-jpg	.js	application/x-javascript
.jsp	text/html	.la1	audio/x-liquid-file
.lar	application/x-laplayer-reg	.latex	application/x-latex
.lavs	audio/x-liquid-secure	.lbm	application/x-lbm
.lmsff	audio/x-la-lms	.ls	application/x-javascript
.ltr	application/x-ltr	.m1v	video/x-mpeg
.m2v	video/x-mpeg	.m3u	audio/mpegurl
.m4e	video/mpeg4	.mac	application/x-mac
.man	application/x-troff-man	.math	text/xml
.mdb	application/msaccess	.mdb	application/x-mdb
.mfp	application/x-shockwave-flash	.mht	message/rfc822
.mhtml	message/rfc822	.mi	application/x-mi
.mid	audio/mid	.midi	audio/mid
.mil	application/x-mil	.mml	text/xml
.mnd	audio/x-musicnet-download	.mns	audio/x-musicnet-stream
.mocha	application/x-javascript	.movie	video/x-sgi-movie
.mp1	audio/mp1	.mp2	audio/mp2
.mp2v	video/mpeg	.mp3	audio/mp3
.mp4	video/mpeg4	.mpa	video/x-mpg
.mpd	application/vnd.ms-project	.mpe	video/x-mpeg
.mpeg	video/mpg	.mpg	video/mpg
.mpga	audio/rn-mpeg	.mpp	application/vnd.ms-project
.mps	video/x-mpeg	.mpt	application/vnd.ms-project
.mpv	video/mpg	.mpv2	video/mpeg
.mpw	application/vnd.ms-project	.mpx	application/vnd.ms-project
.mtx	text/xml	.mxp	application/x-mmxp
.net	image/pnetvue	.nrf	application/x-nrf
.nws	message/rfc822	.odc	text/x-ms-odc
.out	application/x-out	.p10	application/pkcs10
.p12	application/x-pkcs12	.p7b	application/x-pkcs7-certificates
.p7c	application/pkcs7-mime	.p7m	application/pkcs7-mime
.p7r	application/x-pkcs7-certreqresp	.p7s	application/pkcs7-signature
.pc5	application/x-pc5	.pci	application/x-pci
.pcl	application/x-pcl	.pcx	application/x-pcx
.pdf	application/pdf	.pdf	application/pdf
.pdx	application/vnd.adobe.pdx	.pfx	application/x-pkcs12
.pgl	application/x-pgl	.pic	application/x-pic
.pko	application/vnd.ms-pki.pko	.pl	application/x-perl
.plg	text/html	.pls	audio/scpls
.plt	application/x-plt	.png	image/png
.png	application/x-png	.pot	application/vnd.ms-powerpoint
.ppa	application/vnd.ms-powerpoint	.ppm	application/x-ppm
.pps	application/vnd.ms-powerpoint	.ppt	application/vnd.ms-powerpoint
.ppt	application/x-ppt	.pr	application/x-pr
.prf	application/pics-rules	.prn	application/x-prn
.prt	application/x-prt	.ps	application/x-ps
.ps	application/postscript	.ptn	application/x-ptn
.pwz	application/vnd.ms-powerpoint	.r3t	text/vnd.rn-realtext3d
.ra	audio/vnd.rn-realaudio	.ram	audio/x-pn-realaudio
.ras	application/x-ras	.rat	application/rat-file
.rdf	text/xml	.rec	application/vnd.rn-recording
.red	application/x-red	.rgb	application/x-rgb
.rjs	application/vnd.rn-realsystem-rjs	.rjt	application/vnd.rn-realsystem-rjt
.rlc	application/x-rlc	.rle	application/x-rle
.rm	application/vnd.rn-realmedia	.rmf	application/vnd.adobe.rmf
.rmi	audio/mid	.rmj	application/vnd.rn-realsystem-rmj
.rmm	audio/x-pn-realaudio	.rmp	application/vnd.rn-rn_music_package
.rms	application/vnd.rn-realmedia-secure	.rmvb	application/vnd.rn-realmedia-vbr
.rmx	application/vnd.rn-realsystem-rmx	.rnx	application/vnd.rn-realplayer
.rp	image/vnd.rn-realpix	.rpm	audio/x-pn-realaudio-plugin
.rsml	application/vnd.rn-rsml	.rt	text/vnd.rn-realtext
.rtf	application/msword	.rtf	application/x-rtf
.rv	video/vnd.rn-realvideo	.sam	application/x-sam
.sat	application/x-sat	.sdp	application/sdp
.sdw	application/x-sdw	.sit	application/x-stuffit
.slb	application/x-slb	.sld	application/x-sld
.slk	drawing/x-slk	.smi	application/smil
.smil	application/smil	.smk	application/x-smk
.snd	audio/basic	.sol	text/plain
.sor	text/plain	.spc	application/x-pkcs7-certificates
.spl	application/futuresplash	.spp	text/xml
.ssm	application/streamingmedia	.sst	application/vnd.ms-pki.certstore
.stl	application/vnd.ms-pki.stl	.stm	text/html
.sty	application/x-sty	.svg	text/xml
.swf	application/x-shockwave-flash	.tdf	application/x-tdf
.tg4	application/x-tg4	.tga	application/x-tga
.tif	image/tiff	.tif	application/x-tif
.tiff	image/tiff	.tld	text/xml
.top	drawing/x-top	.torrent	application/x-bittorrent
.tsd	text/xml	.txt	text/plain
.uin	application/x-icq	.uls	text/iuls
.vcf	text/x-vcard	.vda	application/x-vda
.vdx	application/vnd.visio	.vml	text/xml
.vpg	application/x-vpeg005	.vsd	application/vnd.visio
.vsd	application/x-vsd	.vss	application/vnd.visio
.vst	application/vnd.visio	.vst	application/x-vst
.vsw	application/vnd.visio	.vsx	application/vnd.visio
.vtx	application/vnd.visio	.vxml	text/xml
.wav	audio/wav	.wax	audio/x-ms-wax
.wb1	application/x-wb1	.wb2	application/x-wb2
.wb3	application/x-wb3	.wbmp	image/vnd.wap.wbmp
.wiz	application/msword	.wk3	application/x-wk3
.wk4	application/x-wk4	.wkq	application/x-wkq
.wks	application/x-wks	.wm	video/x-ms-wm
.wma	audio/x-ms-wma	.wmd	application/x-ms-wmd
.wmf	application/x-wmf	.wml	text/vnd.wap.wml
.wmv	video/x-ms-wmv	.wmx	video/x-ms-wmx
.wmz	application/x-ms-wmz	.wp6	application/x-wp6
.wpd	application/x-wpd	.wpg	application/x-wpg
.wpl	application/vnd.ms-wpl	.wq1	application/x-wq1
.wr1	application/x-wr1	.wri	application/x-wri
.wrk	application/x-wrk	.ws	application/x-ws
.ws2	application/x-ws	.wsc	text/scriptlet
.wsdl	text/xml	.wvx	video/x-ms-wvx
.xdp	application/vnd.adobe.xdp	.xdr	text/xml
.xfd	application/vnd.adobe.xfd	.xfdf	application/vnd.adobe.xfdf
.xhtml	text/html	.xls	application/vnd.ms-excel
.xls	application/x-xls	.xlw	application/x-xlw
.xml	text/xml	.xpl	audio/scpls
.xq	text/xml	.xql	text/xml
.xquery	text/xml	.xsd	text/xml
.xsl	text/xml	.xslt	text/xml
.xwd	application/x-xwd	.x_b	application/x-x_b
.sis	application/vnd.symbian.install	.sisx	application/vnd.symbian.install
.x_t	application/x-x_t	.ipa	application/vnd.iphone
.apk	application/vnd.android.package-archive	.xap	application/x-silverlight-app

當Content-Type是一些文件類型時，使用Content-Disposition可以指定瀏覽器下載文件時的默認文件名
因此，我們想要使用gin實現下載文件的功能，只需要在接口返回時設置Response-Header中的Content-Type為文件類型，并設置Content-Disposition指定默認的文件名，然后將文件數據返回瀏覽器即可，具體代碼如下：

				?

									func DownloadFileControl(c *gin.Context) {

									    //  查詢一些必要的參數 進行一些必要的驗證

									    attchIdStr := c.Query("attachment_id")

									    attachmentName = c.Query("attachment_name")

									    // 獲取要返回的文件數據流

									    // 看你文件存在哪里了，本地就直接os.Open就可以了，總之是要獲取一個[]byte

									    /*  fileContent, err := oss.GetOssClient().DownloadFile(req.AttachmentId, req.AttachmentName)

									    if err != nil {

									        logrus.Errorf("[DownloadFile] download file error,file_id = %d,file_name = %s,user_is = %d,err_msg= %s", req.UserId, req.AttachmentId, req.AttachmentName, err.Error())

									        c.JSON(http.StatusOK, gin.H{

									            "success": false,

									            "msg":     "下載文件失敗,請聯系管理員",

									        })

									        return

									    }*/

									// 設置返回頭并返回數據

									    fileContentDisposition := "attachment;filename=\"" + attachmentName + "\""

									    c.Header("Content-Type", "application/zip") // 這里是壓縮文件類型 .zip

									    c.Header("Content-Disposition", fileContentDisposition)

									    c.Data(http.StatusOK, contentType, fileContent)