當前位置:首頁 » 文件管理 » webuploader重新上傳

webuploader重新上傳

發布時間: 2022-08-30 05:03:27

Ⅰ webuploader為什麼總是上傳失敗

上傳文件一般是不用指定類型的,除非他要解析你的文件。比如我傳個aa.txt,他會按照文本來解析,但如果我把aa.mp4的後綴強制改成aa.txt,他就會解析不了了。

Ⅱ QQ瀏覽器里突然就不能上傳照片了,webuploader 不支持,怎麼解決

從你的描述來看,你的QQ瀏覽器突然就不能上傳圖片了,我覺得主要是瀏覽器出現了問題,建議你重新打開,重新上傳。

Ⅲ 用webuploader怎麼解決跨域上傳文件的問題

跨域請求前瀏覽器會自動發出一個options請求,如果伺服器的響應頭部中有如下信息:
Access-Control-Allow-Origin: #允許訪問的源,如http://localhost:3000
Access-Control-Allow-Methods: #允許的方法,如get, post
瀏覽器收到這個響應就會繼續原來的請求,否則就會終止。
在webuploader中可以在uploadBeforeSend的回調中設置請求的頭部,例如

uploader.on('uploadBeforeSend', function(obj, data, headers) {
_.extend(headers, {
"Origin": "http://localhost:3000",
"Access-Control-Request-Method": "POST"
});
});

在服務端的post響應中增加頭部:Access-Control-Allow-Origin: http://localhost:3000

Ⅳ WebUploader暫停後再開始上傳怎麼沒有反應

換插件啊 uploadify

Ⅳ webuploader.js怎麼給java後端上傳

使用webuploader頁面如下

點擊上傳按鈕,或者復制粘貼或者拖拉圖片導下面區域里都可以上傳圖片

點擊上傳,java代碼如下。 servlet里的dopost方法

點擊上傳後,圖片會存入你寫入的文件夾

需要注意的是,需要修改js文件請求後台的路徑

前段代碼如下,需要源碼的可以回復。

Ⅵ jquery WebUploader 插件 怎麼取消避免重復上傳.

webuploader文檔 裡面有個plicate屬性,是可選的, true為可重復 ,false為不可重復 默認為undifind 也是不可重復。

所以只需在屬性的後面追加plicate:true 就可以實現重復上傳。

Ⅶ webuploader上傳成功後怎麼刪除

<div id="uploader">
<div class="queueList">
<div id="dndArea" class="placeholder">
<div id="filePicker"></div>
<p>或將照片拖到這里,單次最多可選30張</p>
</div>
</div>
<div class="statusBar" style="display:none;">
<div class="progress">
<span class="text">0%</span>
<span class="percentage"></span>
</div><div class="info"></div>
<div class="btns">
<div id="filePicker2"></div><div class="uploadBtn">開始上傳</div>
</div>
</div>
</div>

<script>
require(['jquery', 'webuploader' ], function($, WebUploader) {
return;
// 當domReady的時候開始初始化
$(function() {
var $wrap = $('#uploader'),

// 圖片容器
$queue = $( '<ul class="filelist"></ul>' )
.appendTo( $wrap.find( '.queueList' ) ),

// 狀態欄,包括進度和控制按鈕
$statusBar = $wrap.find( '.statusBar' ),

// 文件總體選擇信息。
$info = $statusBar.find( '.info' ),

// 上傳按鈕
$upload = $wrap.find( '.uploadBtn' ),

// 沒選擇文件之前的內容。
$placeHolder = $wrap.find( '.placeholder' ),

$progress = $statusBar.find( '.progress' ).hide(),

// 添加的文件數量
fileCount = 0,

// 添加的文件總大小
fileSize = 0,

// 優化retina, 在retina下這個值是2
ratio = window.devicePixelRatio || 1,

// 縮略圖大小
thumbnailWidth = 110 * ratio,
thumbnailHeight = 110 * ratio,

// 可能有pedding, ready, uploading, confirm, done.
state = 'pedding',

// 所有文件的進度信息,key為file id
percentages = {},

supportTransition = (function(){
var s = document.createElement('p').style,
r = 'transition' in s ||
'WebkitTransition' in s ||
'MozTransition' in s ||
'msTransition' in s ||
'OTransition' in s;
s = null;
return r;
})(),

// WebUploader實例
uploader;

// 實例化
uploader = WebUploader.create({
pick: {
id: '#filePicker',
label: '點擊選擇圖片'
},
dnd: '#dndArea',
paste: '#uploader',
// swf文件路徑
swf: '{$_W['siteroot']}app/resource/componets/webuploader/Uploader.swf',
// 文件接收服務端。
server: '{$_W['siteroot']}app/{php echo str_replace('./','',url('utility/file',array('do'=>'upload', 'type'=>'image'), true))}',
chunked: true,
// runtimeOrder: 'flash',
// sendAsBinary: true,
fileNumLimit: 30,
fileSizeLimit: 30 * 1024 * 1024, // 30 M
fileSingleSizeLimit: 4 * 1024 * 1024 // 1 M
});

// 添加「添加文件」的按鈕,
uploader.addButton({
id: '#filePicker2',
label: '繼續添加'
});

// 當有文件添加進來時執行,負責view的創建
function addFile( file ) {
var $li = $( '<li id="' + file.id + '">' +
'<p class="title">' + file.name + '</p>' +
'<p class="imgWrap"></p>'+
'<p class="progress"><span></span></p>' +
'</li>' ),
$btns = $('<div class="file-panel">' +
'<span class="cancel">刪除</span>' +
'<span class="rotateRight">向右旋轉</span>' +
'<span class="rotateLeft">向左旋轉</span></div>').appendTo( $li ),
$prgress = $li.find('p.progress span'),
$wrap = $li.find( 'p.imgWrap' ),
$info = $('<p class="error"></p>'),

showError = function( code ) {
switch( code ) {
case 'exceed_size':
text = '文件大小超出';
break;

case 'interrupt':
text = '上傳暫停';
break;

default:
text = '上傳失敗,請重試';
break;
}

$info.text( text ).appendTo( $li );
};

if ( file.getStatus() === 'invalid' ) {
showError( file.statusText );
} else {
// @todo lazyload
$wrap.text( '預覽中' );
uploader.makeThumb( file, function( error, src ) {
if ( error ) {
$wrap.text( '不能預覽' );
return;
}

var img = $('<img src="'+src+'">');
$wrap.empty().append( img );
}, thumbnailWidth, thumbnailHeight );

percentages[ file.id ] = [ file.size, 0 ];
file.rotation = 0;
}

file.on('statuschange', function( cur, prev ) {
if ( prev === 'progress' ) {
$prgress.hide().width(0);
} else if ( prev === 'queued' ) {
$li.off( 'mouseenter mouseleave' );
$btns.remove();
}
// 成功
if ( cur === 'error' || cur === 'invalid' ) {
console.log( file.statusText );
showError( file.statusText );
percentages[ file.id ][ 1 ] = 1;
} else if ( cur === 'interrupt' ) {
showError( 'interrupt' );
} else if ( cur === 'queued' ) {
percentages[ file.id ][ 1 ] = 0;
} else if ( cur === 'progress' ) {
$info.remove();
$prgress.css('display', 'block');
} else if ( cur === 'complete' ) {
$li.append( '<span class="success"></span>' );
}
$li.removeClass( 'state-' + prev ).addClass( 'state-' + cur );
});

$li.on( 'mouseenter', function() {
$btns.stop().animate({height: 30});
});

$li.on( 'mouseleave', function() {
$btns.stop().animate({height: 0});
});

$btns.on( 'click', 'span', function() {
var index = $(this).index(),
deg;

switch ( index ) {
case 0:
uploader.removeFile( file );
return;

case 1:
file.rotation += 90;
break;

case 2:
file.rotation -= 90;
break;
}

if ( supportTransition ) {
deg = 'rotate(' + file.rotation + 'deg)';
$wrap.css({
'-webkit-transform': deg,
'-mos-transform': deg,
'-o-transform': deg,
'transform': deg
});
} else {
$wrap.css( 'filter', 'progid:DXImageTransform.Microsoft.BasicImage(rotation='+ (~~((file.rotation/90)%4 + 4)%4) +')');
}
});
$li.appendTo( $queue );
}

// 負責view的銷毀
function removeFile( file ) {
var $li = $('#'+file.id);
delete percentages[ file.id ];
updateTotalProgress();
$li.off().find('.file-panel').off().end().remove();
}

function updateTotalProgress() {
var loaded = 0,
total = 0,
spans = $progress.children(),
percent;

$.each( percentages, function( k, v ) {
total += v[ 0 ];
loaded += v[ 0 ] * v[ 1 ];
} );

percent = total ? loaded / total : 0;

spans.eq( 0 ).text( Math.round( percent * 100 ) + '%' );
spans.eq( 1 ).css( 'width', Math.round( percent * 100 ) + '%' );
updateStatus();
}

function updateStatus() {
var text = '', stats;

if ( state === 'ready' ) {
text = '選中' + fileCount + '張圖片,共' + WebUploader.formatSize( fileSize ) + '。';
} else if ( state === 'confirm' ) {
stats = uploader.getStats();
if ( stats.uploadFailNum ) {
text = '已成功上傳' + stats.successNum+ '張照片至XX相冊,'+
stats.uploadFailNum + '張照片上傳失敗,<a class="retry" href="#">重新上傳</a>失敗圖片或<a class="ignore" href="#">忽略</a>'
}
} else {
stats = uploader.getStats();
text = '共' + fileCount + '張(' +
WebUploader.formatSize( fileSize ) +
'),已上傳' + stats.successNum + '張';

if ( stats.uploadFailNum ) {
text += ',失敗' + stats.uploadFailNum + '張';
}
}

$info.html( text );
}

function setState( val ) {
var file, stats;

if ( val === state ) {
return;
}

$upload.removeClass( 'state-' + state );
$upload.addClass( 'state-' + val );
state = val;

switch ( state ) {
case 'pedding':
$placeHolder.removeClass( 'element-invisible' );
$queue.hide();
$statusBar.addClass( 'element-invisible' );
uploader.refresh();
break;

case 'ready':
$placeHolder.addClass( 'element-invisible' );
$( '#filePicker2' ).removeClass( 'element-invisible');
$queue.show();
$statusBar.removeClass('element-invisible');
uploader.refresh();
break;
case 'uploading':
$( '#filePicker2' ).addClass( 'element-invisible' );
$progress.show();
$upload.text( '暫停上傳' );
break;
case 'paused':
$progress.show();
$upload.text( '繼續上傳' );
break;
case 'confirm':
$progress.hide();
$upload.text( '開始上傳' ).addClass( 'disabled' );
stats = uploader.getStats();
if ( stats.successNum && !stats.uploadFailNum ) {
setState( 'finish' );
return;
}
break;
case 'finish':
stats = uploader.getStats();
if ( stats.successNum ) {
alert( '上傳成功' );
} else {
// 沒有成功的圖片,重設
state = 'done';
location.reload();
}
break;
}
updateStatus();
}

uploader.onUploadProgress = function( file, percentage ) {
var $li = $('#'+file.id),
$percent = $li.find('.progress span');

$percent.css( 'width', percentage * 100 + '%' );
percentages[ file.id ][ 1 ] = percentage;
updateTotalProgress();
};

uploader.onFileQueued = function( file ) {
fileCount++;
fileSize += file.size;

if ( fileCount === 1 ) {
$placeHolder.addClass( 'element-invisible' );
$statusBar.show();
}

addFile( file );
setState( 'ready' );
updateTotalProgress();
};

uploader.onFileDequeued = function( file ) {
fileCount--;
fileSize -= file.size;

if ( !fileCount ) {
setState( 'pedding' );
}

removeFile( file );
updateTotalProgress();
};

uploader.on( 'all', function( type ) {
var stats;
switch( type ) {
case 'uploadFinished':
setState( 'confirm' );
break;
case 'startUpload':
setState( 'uploading' );
break;
case 'stopUpload':
setState( 'paused' );
break;
}
});

uploader.onError = function( code ) {
alert( 'Eroor: ' + code );
};

$upload.on('click', function() {
if ( $(this).hasClass( 'disabled' ) ) {
return false;
}
if ( state === 'ready' ) {
uploader.upload();
} else if ( state === 'paused' ) {
uploader.upload();
} else if ( state === 'uploading' ) {
uploader.stop();
}
});

$info.on( 'click', '.retry', function() {
uploader.retry();
} );

$info.on( 'click', '.ignore', function() {
alert( 'todo' );
} );

$upload.addClass( 'state-' + state );
updateTotalProgress();
});
});
</script>

Ⅷ webuploader上傳成功後怎麼刪除

webuploader上傳成功後可以通過輸入刪除程序進行刪除。

Ⅸ WebUploader暫停後再開始上傳怎麼沒有反應

IP協議是傳輸層協議,
而HTTP是應用層協議,
socket則是對TCP,可以只使用(傳輸層)TCP:
「我們在傳輸數據時,但是那樣的話;IP和HTTP協議的關系,主要解決如何包裝數據;IP協議的封裝和應用(程序員層面上)。
也可以說;IP協議,TPC,主要解決數據如何在網路中傳輸上傳控制項 WebUploader 判斷有沒有上傳成功
三者從本質上來說沒有可比性,網路有一段比較容易理解的介紹。
關於TCP。
如果想要使傳輸的數據有意義,則必須使用到應用層協議,如果沒有應用層,便無法識別數據內容

Ⅹ webuploader 怎麼上傳失敗

當validate不通過時,會以派送錯誤事件的形式通知調用者。通過upload.on('error', handler)可以捕獲到此類錯誤,目前有以下錯誤會在特定的情況下派送錯來。 Q_EXCEED_NUM_LIMIT 在設置了fileNumLimit且嘗試給uploader添加的文件數量超出這個值時派送。 Q_EXCEED_SIZE_LIMIT 在設置了Q_EXCEED_SIZE_LIMIT且嘗試給uploader添加的文件總大小超出這個值時派送。 Q_TYPE_DENIED 當文件類型不滿足時觸發。。 應該是你的upload.js中fileSingleSizeLimit參數設置過小,你可以修改大一點試試

熱點內容
酒商城源碼 發布:2024-10-13 01:58:54 瀏覽:135
我的世界伺服器圈地設計 發布:2024-10-13 01:46:16 瀏覽:217
配置升級到什麼型號好 發布:2024-10-13 01:38:35 瀏覽:195
面試java基礎 發布:2024-10-13 01:38:34 瀏覽:891
製作加密dvd 發布:2024-10-13 01:32:41 瀏覽:570
java批量發送簡訊 發布:2024-10-13 01:27:00 瀏覽:223
androidstring特殊 發布:2024-10-13 01:21:19 瀏覽:239
nginxphp配置 發布:2024-10-13 01:12:55 瀏覽:570
網路游戲Server編程 發布:2024-10-13 00:41:44 瀏覽:227
androidqq分組 發布:2024-10-13 00:41:09 瀏覽:20