php點選連結直接下載檔案寫法
阿新 • • 發佈：2018-12-31
<?php $file = "avater.jpg"; //計算機上的一個檔案 $fileName = basename($file); //獲取檔名 header("Content-Type:application/octet-stream"); //告訴瀏覽器文件型別(mime型別); octet-stream指的是二進位制檔案型別;下載任何型別的檔案都可以這麼指定 header("Content-Disposition:attachment;filename=".$fileName); //告訴瀏覽器以附件方式對待檔案(即下載檔案);並設定下載後的檔名 header("Accept-ranges:bytes"); //告訴瀏覽器檔案大小的單位 header("Accept-Length:".filesize($file)); //告訴瀏覽器檔案的大小 $h = fopen($file, 'r'); //開啟檔案 echo fread($h, filesize($file));
<!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <!-- 上述3個meta標籤*必須*放在最前面，任何其他內容都*必須*跟隨其後！ --> <title>Bootstrap 101 Template</title> <!-- Bootstrap --> <link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> <script> </script> <style> .fade-enter-active, .fade-leave-active { transition: opacity .5s } .fade-enter, .fade-leave-to /* .fade-leave-active in below version 2.1.8 */ { opacity: 0 } </style> </head> <body style="text-align:center"> <h1 class="text-center">測試用</h1> <div id="app"> <div v-show="1" class="panel panel-default" v-for="permission in permissions"> <div class="panel-heading"> <h3 class="panel-title" v-bind:data-id="5" v-on:click="changeShow">面板標題</h3> </div> <div class="panel-body" v-show="0"> <div> hehe </div> </div> </div> 姓名:<input id='start_time' type="text"><br/> 年齡: <input id='end_time' type="text"> 下載檔案: <button @click="download" type="button">ajax下載檔案</button> <a href="download.php">直接連結下載檔案</a> </div> <script src="https://cdn.bootcss.com/jquery/1.12.4/jquery.min.js"></script> <script src="/laydate/laydate.js"></script> <script src="vue.js"></script> <script src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script> </body> </html> <script> laydate.render({ elem:'#start_time' //指定元素 }); laydate.render({ elem:'#end_time' //指定元素 }); var app = new Vue({ el:'#app', data:{ permissions:[{'name':'zxj'},{'name':'shepeng'},{'name':'zhangqiang'},{'name':'jiachang'}], show:[], }, methods:{ changeShow:function (event) { // console.log(event.target.dataset.id); // event.target.dataset.id = !event.target.dataset.id; console.log(event.target.appendChild(para)); }, download:function (e) { $.ajax({ type:'post', url:'download.php', data:{ name:e.target.innerHTML }, dataType:'json', success:function (res) { console.log(res); alert(res.name); } }); } } }); </script>