Поддержка RichFaces FileUpload и Fla sh заканчивается в 2020 г. - PullRequest
0 голосов
/ 05 мая 2020

Ну, в моей компании у нас есть устаревшая веб-система, которая использует JSF 1.2, Seam 2.2 и RichFaces 3.3

Ну, есть одна часть системы, которая использует rich: fileUpload с FlashSupport, но, как мы знаем Fla sh больше не будет поддерживаться к концу 2020 года.

Вопрос в том, есть ли способ изменить это, а не переносить систему на новые технологии? (Это обязательно будет, но, вероятно, только в 2021 году).

Заранее спасибо. Рафаэль

1 Ответ

0 голосов
/ 29 мая 2020

Моя компания столкнулась с той же проблемой, и мы разработали способ использования компонента без fla sh с несколькими загрузками. Следуйте коду. Обычно javascript принимает несколько файлов на входе и отправляет их в очереди в расширенный компонент, моделирующий множественную загрузку.

arquivo. js

var files = []

function FileListItem(a) {
	a = [].slice.call(Array.isArray(a) ? a : arguments)
	for (var c, b = c = a.length, d = !0; b-- && d;)
		d = a[b] instanceof File
	if (!d)
		throw new TypeError(
				"expected argument to FileList is File or array of File objects")
	for (b = (new ClipboardEvent("")).clipboardData || new DataTransfer; c--;)
		b.items.add(a[c])
	return b.files
}

function docUpload(f) {

	// Popula files
	for (var i = 0; i < jQuery("#fUpload")[0].files.length; i++) {
		files[i] = jQuery("#fUpload")[0].files[i]
	}

	if (files.length > 0) {
        //just a loading modal not nedded
		document.getElementById('loading_mp').component.show();

		file = files[0]
		files.splice(0, 1)

		upload(file);
	} else {
        //just a loading modal not nedded
		document.getElementById('loading_mp').component.hide();
	}
}

function upload(file) {
	console.log('Starting Upload  ')
	jQuery(".rich-fileupload-hidden")[0].files = FileListItem([ file ])
	jQuery(".rich-fileupload-hidden").change();
	console.log('End  ')
}

function uploadMult() {
	if (files.length > 0) {
		file = files[0]
		files.splice(0, 1)
		upload(file);
	} else {
		jQuery("#fUpload")[0].files = null
		document.getElementById('loading_mp').component.hide();
	}

}
<style type="text/css">
		#fileUploadSingle {
			float: left;
			border: none;
		}
		.rich-fileupload-list-decor {
			display: none;
		}
		
		#fileUploadSingle table.rich-fileupload-toolbar-decor {
			border: none;
			!
			important
		}
		/* Esconde o input */
		#fUpload {
		  display: none
		}
		
		/* Aparência que terá o seletor de arquivo */
		.labelInputFile {
		    background-color: #3498db;
		    border-radius: 5px;
		    color: #fff;
		    cursor: pointer;
		    margin: 10px;
		    padding-left: 20px;
		    padding-right: 20px !important;
		    padding-top: 6px;
		    padding-bottom: 6px;
		}
	</style>
<a4j:jsFunction name="doOnUpload" action="#{documentoBean.onUpload}" />

<label class="labelInputFile" for='fUpload'>Select File &#187;</label>
<input id="fUpload" type="file" onchange="docUpload(this)" multiple="multiple" />
			
<br/><br/>
			
<rich:fileUpload fileUploadListener="#{documentoBean.listener}"
				id="upload" autoclear="true" immediateUpload="true"
				clearAllControlLabel="Limpar" addControlLabel="Adicionar"
				maxFilesQuantity="30" allowFlash="false" ajaxSingle="true"
				listHeight="60" listWidth="700" onupload="doOnUpload(event)" >
				<a4j:support event="onfileuploadcomplete" reRender="list" ignoreDupResponses="true"
					oncomplete="uploadMult()" />
</rich:fileUpload>

PS:
doOnUpload not required

On Bean: 
 public void listener(UploadEvent event) throws Exception {
    	event.getUploadItem().getFile();
    	event.getUploadItem().getFileName();
    }
    
     public void onUpload() {
        this.msgList.clear();
    }
...