upload.js 8.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295
  1. std_name=''
  2. std_id=''
  3. accessid = ''
  4. accesskey = ''
  5. host = ''
  6. policyBase64 = ''
  7. signature = ''
  8. callbackbody = ''
  9. filename = ''
  10. upfilename = ''
  11. key = ''
  12. expire = 0
  13. g_object_name = ''
  14. g_object_name_type = 'random_name'
  15. max_file_size=0
  16. files=''
  17. mime_types={}
  18. aspect_num=''
  19. now = timestamp = Date.parse(new Date()) / 1000;
  20. var file_type=getQueryVariable("file_type");
  21. var a = send_request( '../../vod/status.htm?aspect_id='+ getQueryVariable("id")+'&file_type='+ file_type);
  22. if (a.errorCode=='1102')
  23. window.location = '../';
  24. if (a.errorCode=='1901'){
  25. document.getElementById('h').innerText=a.errorMsg;
  26. document.getElementById('selectfiles').style.display="none";
  27. }else if(a.errorCode=='20000'){
  28. document.getElementById('h').innerHTML ="文件已经上传成功";
  29. document.getElementById('selectfiles').style.display="none";
  30. }else{
  31. max_file_size=a.map.max_file_size;
  32. std_name=a.map.std_name;
  33. std_id=a.map.std_id;
  34. files=a.map.files;
  35. console.log(files);
  36. document.getElementById('h').innerHTML ="请上传文件(最大"+max_file_size+"MB) <br>只有一次上传成功的机会。上传前请预览,并确认预览的文件名称和上传的文件名称一致!<br><font color='red'>未显示上传成功前请不要离开本页面,切勿切屏、息屏。</font>";
  37. }
  38. if (file_type==='voide')
  39. mime_types=[ { title : 'mov', extensions : '*' }];
  40. else if(file_type==='file')
  41. mime_types=[ { title : 'pdf', extensions : 'pdf' }];
  42. function send_request(serverUrl)
  43. {
  44. var xmlhttp = null;
  45. if (window.XMLHttpRequest){
  46. xmlhttp=new XMLHttpRequest();
  47. } else if (window.ActiveXObject){
  48. xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  49. }
  50. if (xmlhttp!=null){
  51. // serverUrl是 用户获取 '签名和Policy' 等信息的应用服务器的URL,请将下面的IP和Port配置为您自己的真实信息。
  52. //serverUrl = 'http://10072.hmsoft.cn/bk/vod/postkey.htm'
  53. xmlhttp.open( "GET", serverUrl, false );
  54. xmlhttp.send( null );
  55. return eval ("(" + xmlhttp.responseText + ")");
  56. }else{
  57. alert("Your browser does not support XMLHTTP.");
  58. }
  59. };
  60. function check_object_radio() {
  61. var tt = document.getElementsByName('myradio');
  62. for (var i = 0; i < tt.length ; i++ )
  63. {
  64. if(tt[i].checked)
  65. {
  66. g_object_name_type = tt[i].value;
  67. break;
  68. }
  69. }
  70. }
  71. function get_signature()
  72. {
  73. // 可以判断当前expire是否超过了当前时间, 如果超过了当前时间, 就重新取一下,3s 作为缓冲。
  74. now = timestamp = Date.parse(new Date()) / 1000;
  75. if (expire < now + 3)
  76. {
  77. var obj = send_request( '../../vod/postkey.htm?aspect_id='+ getQueryVariable("id")+'&std_id='+std_id+'&file_type='+ getQueryVariable("file_type"));
  78. if(obj['success']!=null){
  79. console.log(obj['errorMsg']);
  80. alert(obj['errorMsg']);
  81. if (a.errorCode=='1102')
  82. window.location = '../';
  83. return false;
  84. }
  85. host = obj['host']
  86. policyBase64 = obj['policy']
  87. accessid = obj['accessid']
  88. signature = obj['signature']
  89. expire = parseInt(obj['expire'])
  90. callbackbody = obj['callback']
  91. key = obj['dir']
  92. aspect_num = obj['aspect_num']
  93. return true;
  94. }
  95. return false;
  96. };
  97. function random_string(len) {
  98.   varlen = len || 32;
  99.   var chars = 'ABCDEFGHJKMNPQRSTWXYZabcdefhijkmnprstwxyz2345678';
  100.   var maxPos = chars.length;
  101.   var pwd = '';
  102.   for (i = 0; i < len; i++) {
  103.   pwd += chars.charAt(Math.floor(Math.random() * maxPos));
  104. }
  105. return pwd;
  106. }
  107. function get_suffix(filename) {
  108. pos = filename.lastIndexOf('.')
  109. suffix = ''
  110. if (pos != -1) {
  111. suffix = filename.substring(pos)
  112. }
  113. return suffix;
  114. }
  115. function get_name(filename) {
  116. pos = filename.lastIndexOf('.')
  117. f = ''
  118. if (pos != -1) {
  119. f = filename.substring(0,pos)
  120. }
  121. return f;
  122. }
  123. function calculate_object_name(filename)
  124. {
  125. if (g_object_name_type == 'local_name')
  126. {
  127. g_object_name += "${filename}"
  128. }
  129. else if (g_object_name_type == 'random_name')
  130. {
  131. suffix = get_suffix(filename)
  132. g_object_name = key + random_string(10) + suffix
  133. }
  134. else if (g_object_name_type == 'upfilename')
  135. {
  136. suffix = get_suffix(filename)
  137. g_object_name = key + upfilename + suffix
  138. }
  139. return ''
  140. }
  141. function get_uploaded_object_name(filename)
  142. {
  143. if (g_object_name_type == 'local_name')
  144. {
  145. tmp_name = g_object_name
  146. tmp_name = tmp_name.replace("${filename}", filename);
  147. return tmp_name
  148. }
  149. else if(g_object_name_type == 'random_name')
  150. {
  151. return g_object_name
  152. }
  153. }
  154. function set_upload_param(up, filename, ret)
  155. {
  156. if (ret == false)
  157. {
  158. ret = get_signature()
  159. }
  160. if (ret){
  161. g_object_name = key;
  162. if (filename != '') { suffix = get_suffix(filename)
  163. calculate_object_name(filename)
  164. }
  165. new_multipart_params = {
  166. 'key' : g_object_name,
  167. 'policy': policyBase64,
  168. 'OSSAccessKeyId': accessid,
  169. 'success_action_status' : '200', //让服务端返回200,不然,默认会返回204
  170. 'callback' : callbackbody,
  171. 'signature': signature,
  172. };
  173. up.setOption({
  174. 'url': host,
  175. 'multipart_params': new_multipart_params
  176. });
  177. up.start();
  178. }
  179. }
  180. function getQueryVariable(variable)
  181. {
  182. var query = window.location.search.substring(1);
  183. var vars = query.split("&");
  184. for (var i=0;i<vars.length;i++) {
  185. var pair = vars[i].split("=");
  186. if(pair[0] == variable){return pair[1];}
  187. }
  188. return(false);
  189. }
  190. var uploader = new plupload.Uploader({
  191. runtimes : 'html5,flash,silverlight,html4',
  192. browse_button : 'selectfiles',
  193. multi_selection: false,
  194. container: document.getElementById('container'),
  195. flash_swf_url : 'lib/plupload-2.1.2/js/Moxie.swf',
  196. silverlight_xap_url : 'lib/plupload-2.1.2/js/Moxie.xap',
  197. url : 'http://oss.aliyuncs.com',
  198. filters: {
  199. mime_types : mime_types,
  200. max_file_size :max_file_size+'mb', //最大上传
  201. prevent_duplicates : true //不允许选取重复文件
  202. },
  203. init: {
  204. PostInit: function() {
  205. document.getElementById('ossfile').innerHTML = '';
  206. },
  207. FilesAdded: function(up, files) {
  208. console.log("FilesAdded"+files.length);
  209. plupload.each(files, function(file) {
  210. document.getElementById('ossfile').innerHTML += '<div id="' + file.id + '">' + file.name + ' (' + plupload.formatSize(file.size) + ')<b></b>'
  211. +'<div class="progress"><div class="progress-bar" style="width: 0%"></div></div>'
  212. +'</div>';
  213. });
  214. set_upload_param(up, '', false);
  215. },
  216. BeforeUpload: function(up, file) {
  217. set_upload_param(up, file.name, true);
  218. },
  219. UploadProgress: function(up, file) {
  220. var d = document.getElementById(file.id);
  221. d.getElementsByTagName('b')[0].innerHTML = '<span>' + file.percent + "%</span>";
  222. var prog = d.getElementsByTagName('div')[0];
  223. var progBar = prog.getElementsByTagName('div')[0]
  224. progBar.style.width= 2*file.percent+'px';
  225. progBar.setAttribute('aria-valuenow', file.percent);
  226. },
  227. FileUploaded: function(up, file, info) {
  228. if (info.status == 200)
  229. {
  230. document.getElementById(file.id).getElementsByTagName('b')[0].innerHTML = '文件已经上传成功';
  231. document.getElementById('selectfiles').style.display="none";
  232. }
  233. else if (info.status == 203)
  234. {
  235. document.getElementById(file.id).getElementsByTagName('b')[0].innerHTML = '上传成功,但是oss访问用户设置的上传回调服务器失败,失败原因是:' + info.response;
  236. }
  237. else
  238. {
  239. document.getElementById(file.id).getElementsByTagName('b')[0].innerHTML = info.response;
  240. }
  241. },
  242. Error: function(up, err) {
  243. if (err.code == -600) {
  244. document.getElementById('console').appendChild(document.createTextNode("\n上传的文件太大了,最大允许上传"+max_file_size+"MB"));
  245. }
  246. else if (err.code == -601) {
  247. document.getElementById('console').appendChild(document.createTextNode("\n选择的文件类型不正确"));
  248. }
  249. else if (err.code == -602) {
  250. document.getElementById('console').appendChild(document.createTextNode("\n选择文件重复"));
  251. }
  252. else
  253. {
  254. document.getElementById('console').appendChild(document.createTextNode("\nError xml:" + err.response));
  255. }
  256. }
  257. }
  258. });
  259. uploader.init();
  260. //console.log( uploader.settings.filters.max_file_size);