напиши впереди

Сегодня мы напишем про многочастную загрузку js, потому что в работе загружаемые файлы зачастую относительно большие. Чтобы они не застревали, мы можем использовать многочастную загрузку для передачи файлов. Давайте вкратце разберемся с идеями. ., а затем вставьте код

Анализ идеи

Поскольку это загрузка из нескольких частей, вы должны сначала знать, как загрузить файл без фрагментации. Обычно мы используем файл file напрямую, а затем помещаем его в объект formData и загружаем в качестве параметра. На самом деле это самый простой способ. , фильм должен выполнить всю эту операцию несколько раз, и каждый раз число Объем данных делится в соответствии с нашим определением. То есть, если размер файла составляет 10 МБ, мы делим его на десять частей. Каждая часть загружается в соответствии с полным процессом загрузки, упомянутым выше, а затем повторяется десять раз. Загрузите все и закончите. Это наша основная идея. Далее мы вставим анализ. код

Реализация исходного кода

			const size = 10000 //размер фрагмента
			const url = 'https://httpbin.org/post' // Загруженный URL
			/**
			 * @function fragmentAtionUpload Многочастная загрузка
			 * @params file Загруженные файлы
			 * @params cbUrl Загрузить функцию обратного вызова
			 * @params size Размер осколка
			 */
			let fragmentAtionUpload = async (file = '', cbUrl, size = 1) => {
				for (let i = 0; i < file.size; i += size) {
					let chunk = file.slice(i, i + size)
					let formData = new FormData()
					formData.append('frmgmentData', chunk)
					await cbUrl(formData)
				}
			}
			/**
			 * @function cbUrl Многочастная загрузка функции обратного вызова
			 * @params fileData Загруженные файлы
			 */
			let cbUrl = (fileData) => {
				fetch(url, {
					method: 'post',
					body: fileData
				}).then(data => {
					return data.text()
				}).then(res => {
          			// Здесь получаются реальные данные каждой детали, которые можно загрузить и отобразить.
					console.log(res)
				})
			}
			// Операция загрузки файла
			let uploadByFragment = () => {
				let file = document.getElementById('file').files[0]
				fragmentAtionUpload(file, cbUrl, size)
			}

<input type="file" id="file" οnchange="uploadByFragment()">

анализ кода

Как показано выше, мы сначала объявляем функцию для передачи файла, URL-адреса и размера фрагмента. Функция обратного вызова выполняет одну задачу: ее не волнует размер загрузки, поэтому мы можем вызывать эту функцию несколько раз в течение цикла. , и, наконец, я не буду вдаваться в подробности о функциях работы с файлами. Вообще говоря, самая базовая многочастная загрузка относительно проста.

Анализ проблемы

Здесь есть фатальная проблема, то есть из-за того, что загружается частями, файл разрезается на разделы, а это значит, что если процесс загрузки прервется по сети или по другим причинам, то проблема будет более серьезной. вы можете выбрать повторную загрузку, но поскольку некоторые из предыдущих фрагментов были загружены, но поскольку они не являются полным целым, они, по сути, представляют собой грязные данные. Чтобы решить эту проблему, вам необходимо использовать возобновление точки останова, что следует предположить. что загрузка прервана. После этого мы можем продолжить загрузку в прерванном месте, что может решить эту проблему.