JavaScript 可以使用表单提交来实现文件上传。首先，在 HTML 中创建一个文件输入框：
<input type="file" id="fileInput">
然后，在 JavaScript 中获取文件输入框的引用，并在其上设置事件监听器，如下所示：
var fileInput = document.getElementById('fileInput');
fileInput.addEventListener('change', function () {
// 在这里处理选择的文件
});在事件监听器中，可以使用 fileInput.files[0] 属性获取选择的文件，然后对文件进行处理。
接下来可以使用 XMLHttpRequest 或 fetch API 来上传文件。
使用 XMLHttpRequest：
var file = fileInput.files[0];
var formData = new FormData();
formData.append('file', file);
var xhr = new XMLHttpRequest();
xhr.open('POST', 'url', true);
xhr.onload = function () {
if (xhr.status === 200) {
console.log('upload success');
}
};
xhr.send(formData);使用 fetch：
var file = fileInput.files[0];
var formData = new FormData();
formData.append('file', file);
fetch('url', {
method: 'POST',
body: formData
}).then(response => {
if (response.ok) {
console.log('upload success');
}
});另外还可以使用第三方库如 axios 来实现文件上传，具体实现方法可以参考相关文档。
在上传大文件时，通常采用分块上传的方式。将大文件分成若干个块，每块一个 HTTP 请求上传。
实现大文件上传的步骤如下：
JavaScript 可以使用 File API（File 和 Blob 对象）来实现文件的读取和上传。
下面是一个使用 JavaScript 实现大文件上传的简单实例，使用分块上传的方法。
<input type="file" id="file-input">
// 上传文件块
function uploadChunk(file, start, end, chunk) {
var xhr = new XMLHttpRequest();
xhr.open('POST', '/upload', true);
xhr.setRequestHeader('Content-Type', 'application/octet-stream');
xhr.setRequestHeader('Content-Range', 'bytes ' + start + '-' + end + '/' + file.size);
xhr.send(chunk);
}
// 上传文件
function uploadFile(file) {
var chunkSize = 1 * 1024 * 1024; // 分块大小为1MB
var chunks = Math.ceil(file.size / chunkSize); // 计算分块数
var currentChunk = 0; // 当前分块
var start, end;
while (currentChunk < chunks) {
start = currentChunk * chunkSize;
end = start + chunkSize >= file.size ? file.size : start + chunkSize;
var chunk = file.slice(start, end);
uploadChunk(file, start, end, chunk);
currentChunk++;
}
}
// 监听文件选择事件
document.getElementById('file-input').addEventListener('change', function(e) {
var file = e.target.files[0];
if (file) {
uploadFile(file);
}
});在这个实例中，我们使用了 XMLHttpRequest 对象上传文件，并设置了 Content-Type 和 Content-Range 消息头。Content-Type 消息头表示上传的数据类型是二进制数据，Content-Range 消息头表示上传的文件块的范围。
在这个示例中，我们将文件分成若干块，每块大小为 1MB。我们使用 File API 中的 slice 方法截取文件块，并使用 XMLHttpRequest 将文件块上传到服务器。
注意，这只是一个简单的实例，代码仅供参考，在实际应用中还需要考在考虑以下几点：
通过分块上传的方式，我们可以将大文件分成若干块上传，避免一次性上传大文件造成的超时或者内存不足的问题，同时也方便实现断点续传和上传进度的显示。
除了上面提到的方法外，还可以使用第三方库来实现大文件上传。常见的第三方库有：
这些库都提供了文件分块、断点续传、上传进度等功能，可以让你更快捷地实现大文件上传。
不过要注意的是，使用第三方库可能会增加代码的复杂性和对第三方库的依赖。在选择使用第三方库时需要权衡其优缺点，并确保它满足你的需求。
关于文件上传需要了解的知识点：
在 JavaScript 中实现文件下载，常见的方法如下：
1、使用 window.location 实现：通过更改当前页面的 URL 为文件下载地址，从而实现下载。
window.location = 'file-download-url';
2、使用 a 标签实现：通过创建一个 a 标签并设置其 href 和 download 属性，从而实现下载。
var link = document.createElement("a");
link.download = "filename";
link.href = "file-download-url";
link.click();3、使用 fetch API 实现：通过使用 fetch API 获取文件内容，并将其写入 Blob 对象，最后利用 URL.createObjectURL 将其下载。
fetch('file-download-url')
.then(response => response.blob())
.then(blob => {
const url = URL.createObjectURL(blob);
const link = document.createElement('a');
link.href = url;
link.download = 'filename';
link.click();
URL.revokeObjectURL(url);
document.body.removeChild(link);
});
