html5檔案(圖片,音訊,視訊)上傳
html程式碼片段:
<input type="file" id="fileInput"/>
js:
var fileInput = document.querySelector('#fileInput');
fileInput.onchange = function () {var file = this.files[0];
if (!/audio\/\w+/.test(file.type)) {/*可以把autio改成其他檔案型別 比如 image*/
alert("只能選擇音訊檔案")
return false;
}
console.log(file.type)/*檔案型別*/
var reader = new FileReader();
reader.readAsDataURL(file);
reader.onload = function () {
var audioBlob=convertBase64UrlToBlob(reader.result,file.type)
/*request("audio",audioBlob)這裡是我的ajax請求*/
};
};
function convertBase64UrlToBlob(urlData,type){ /*轉成二進位制物件*/
var bytes=window.atob(urlData.split(',')[1]);
var ab = new ArrayBuffer(bytes.length);
var ia = new Uint8Array(ab);
for (var i = 0; i < bytes.length; i++) {
ia[i] = bytes.charCodeAt(i);
}
return new Blob( [ab] , {type : type});
}
function request(type,Blob){
var formData = new FormData();/*建立formData物件*/
formData.append("cover_img", Blob);
$.ajax({
url:"檔案上傳地址",
type:"POST",
processData: false,
contentType: false,
data: formData,
dataType: 'json',
success: function (data) {
}
})
}
相關推薦
html5檔案(圖片,音訊,視訊)上傳
html程式碼片段:<input type="file" id="fileInput"/>js: var fileInput = document.querySelector('#fileInput'); fileInput.onchange = funct
阿里雲 javascript上傳檔案(圖片、視訊、壓縮包等檔案)到 物件儲存 OSS ,返回上傳檔案、圖片、音訊、視訊等URL路徑
目的:前端上傳檔案(圖片、視訊、音訊等)到阿里雲伺服器裡面,並且獲得上傳檔案的URL路徑 前提:首先要買一個阿里雲伺服器,自己百度不會; 第一步:登入阿里雲賬號,點選管理控制檯-->物件儲存 OSS 第二步:新建儲存空間(圖一、圖二) (圖一) (圖二
iOS獲取網頁上資料(圖片、文字、視訊)
獲取網頁上所有圖片、獲取所有html、獲取網頁title、獲取網頁內容文字。。。 .h 檔案 程式碼: //網頁 //NSString *strPath = [NSString stringWithFormat:@"http://www.bai
基於C/C++的讀取資料夾下所有檔案(圖片、文件等)的程式碼
<pre name="code" class="cpp">#include <iostream> #include <string> #include <vector> #include <io.h> #inclu
django2.0 中如何顯示靜態檔案(圖片、css 和js )
參考了幾個部落格,然後總結了一下,有誤請指正。 這是我相關檔案的路徑 1.在settings.py 檔案的末尾加上加上以下程式碼: STATIC_URL = '/static/' HERE = os.path.dirname(os.path.abspath(
Wireshark抓包儲存檔案(圖片,視訊,音訊等)
1、首先選擇一個圖片的分組 如圖的9801 就是JPG 2、對下面的窗口裡面選中JPEG File Interchange Format 右鍵選擇 匯出分組位元組流 3、檔案輸入XXX.jpg,注意儲存格式選擇All Files 所有檔案 ok!其他檔案格式步驟雷同
Android 媒體庫圖片,音訊,視訊,檔案的查詢
轉載:Android 媒體庫圖片,音訊,視訊,檔案的查詢 首先,我們該怎樣獲取查詢這些資訊? 其實android中其實系統已經給我們提供了一個數據庫,裡面包含了sd卡中所有檔案的資訊(大小、位置、建立時間等)。 多媒體資料庫存放的位置: - data/data
form表單提交帶有圖片,音訊,視訊這樣的檔案時
應該寫上 enctype="multipart/form-data" <form class="form-horizontal" role="form" action="{{url('admin/article/store')}}" enctype="mu
實時去除瀏覽器快取的檔案,音訊,視訊,圖片等
程式碼: <!DOCTYPE HTML> <html> <body> <audio src= url +"/i/horse.ogg?ran=" + Math.random() controls="controls"> You
ueditor單圖片(simpleupload)上傳,設置其 width:100%,height:auto。以適應各種屏幕大小顯示
適應 () 技術 width png 屏幕大小 bsp 代碼 操作 打開ueditor.all.js,按下圖操作(修改後註意清緩存): 附上待搜索的關鍵字:function callback() 附上代碼 loader.setAttribute(‘width‘
關於瀏覽器快取問題(圖片更換後,頁面仍優先讀取快取)
因為部分需求(跟換頭像,切換輪播圖等等)改變圖片或者本地上傳新圖片,會導致圖片快取問題,從而達不到預期效果,還是載入原圖片查找了一些資料,總結出2個步驟: 1.在圖片的路徑的後面拼接 ‘?內容’ 解決,具體如下 (1)在圖片src路徑後面加上時間戳,使瀏覽
PostgreSQL生態、原理、應用案例、開發與管理實踐 - 南京站 (最全資料下載,PPT+回顧視訊)
活動介紹 PostgreSQL發展非常的迅猛,覆蓋OLTP,OLAP,NoSQL,搜尋,時空,流,圖,影象等應用場景,往企業級全棧資料庫的方向發展。PostgreSQL的應用場景豐富,在穩定性、效能、可用性、可靠性、容災、安全性、擴充套件性等方面不亞於商用資料庫Oracle,常被業界稱為“開源界的Oracl
Html5學習筆記四—播放音訊和視訊檔案
1, 載入音訊檔案: Key word :<audio src=”路徑” controls=”controls”> Src是音訊路徑 ,controls屬性用來提供播放,暫停,音量控制 下面是一個簡單程式碼進行播放本地音訊 <!DOCTYPE HTML&
關於富文字編輯器ueditor(jsp版)上傳檔案到阿里雲OSS的簡單例項,適合新手
本人菜鳥一枚,最近公司有需求要用到富文字編輯器,我選擇的是百度的ueditor富文字編輯器,閒話不多說,進入正題:一:ueditor的下載及安裝以及OSS的下載及引入我就不詳細說了,這裡說下要注意的幾點: 1,ueditor下載地址:點選開啟連結
頻道管理頁面(高仿頭條等新聞app,騰訊視訊)
頻道管理頁面(高仿頭條等新聞app) 1,頻道名稱資料是儲存在Sqlite資料庫中 DragGrid 繼承 GridView 我的頻道頁面 點選刪除頻道,長按拖拽順序 3 。 OtherGridView 繼承 GridView 更多頻道 點選新增頻道 更多頻道
利用Freemarker生成doc檔案(包含list迴圈,ifelse判斷,合併單元格,嵌入表格單元格字數過多報錯等)
1、利用office等軟體開啟doc文件,另存為word2003xml形式的檔案。 2、修改xml中的需要動態生成的值,Freemarker變數為${data}格式的,修改完改成ftl字尾,複製到載入
Android 使用intent開啟手機自帶應用播放視訊,音訊,文件,還有開啟應用市場
1 開啟手機上的視訊播放器播放視訊 String url = "http://192.168.0.1/1.mp4" Intent intent = new Intent(); intent.setAc
ajaxFileUpload 上傳檔案/圖片,傳引數,解決第二次無法上傳問題
html: <script charset="utf-8" src="js/ajaxfileupload.js"></script> <input style="display:;" type="file" id="userfile" o
js(頭像,圖片)上傳,如何立即展示?圖片詳解。
我個人覺得,這個js(頭像,圖片)上傳,立即展示,對做web前端的童鞋來說,還是非常有用的。 主要的js previewImage.js: function PreviewImage(obj, imgPreviewId, divPreviewId) { var a
移動端(h5)上傳,壓縮,預覽圖片
專案裡邊這次用到了移動端上傳圖片,拿出來分享下。 1.首先是思路,在input 發生change的時候判斷瀏覽器時候支援圖片預覽,支援的情況下校驗圖片的格式,圖片的大小,之後將拿到的圖片進行canvas壓縮,圖片轉base64,然後上傳。 2.程式碼