實現步驟如下:
**1. 服務端代碼**
```java
@Component
@ServerEndpoint(value = "/v1/download")
public class DownLoadController {
@OnMessage
public void download(String message, Session session) throws IOException, EncodeException {
File file = new File(message);
FileInputStream input = new FileInputStream(file);
byte[] content = new byte[1024];
while (input.read(content) != -1) {
session.getBasicRemote().sendObject(content);
}
session.getBasicRemote().sendText(200 + "");
}
}
```
**2. 前端代碼**
```js
var socket = null
const blobList = []
/**
* 連接服務端
*/
function connect() {
socket = new WebSocket('ws://localhost:8090/v1/download')
socket.onmessage = (e) => {
if (e.data instanceof Blob) {
blobList.push(e.data)
}
if(e.data === '200') {
let blob = new Blob(blobList)
const link = document.createElement('a');
link.href = window.URL.createObjectURL(blob);
link.download = new Date() + '.mp4'
link.click();
window.URL.revokeObjectURL(link.href);
}
}
}
/**
* 上傳下載參數
*/
function downloadFile() {
socket.send('e:/upload/websocket/tem.mp4')
}
```
>[warning]提醒:上面的代碼下載文件時需要將文件合并,使用的計算資源是客戶的瀏覽器,如果下載較大的文件時可能會導致客戶瀏覽器卡。
- 跨域問題
- 跨域是什么
- 跨域解決方案
- 從后端解決
- nginx反向代理
- WebSocket
- websocket是什么
- websocket協議
- 使用場景
- 實現方式
- 注解與html5原生方式
- websocketAPI
- 實現步驟
- 文件上傳
- 文件下載
- 廣播通信
- 定時推送
- 編程與socketjs方式
- socketjs與stompjs框架
- 實現步驟
- 重載目的地
- SimpMessagingTemplate
- 定時向前端推送數據
- 5種監聽事件
- 點對點通信
- 攔截器
- HandshakeInterceptor
- ChannelInterceptor
- poi之excel表格
- 表格版本
- POI常用類
- POI依賴
- 寫表格
- 編寫表格過程
- 單元格邊框樣式
- 單元格背景色
- 凍結行或列
- 單元格合并
- 單元格內換行
- 文檔內跳轉
- 讀表格
- Web中的Excel操作
- 導出表格
- 讀取表格
- poi之word文檔
- word版本
- 寫word
- 基本使用
- 標題樣式
- 添加圖片
- EasyExcel表格
- EasyExcel是什么
- 與其他Excel工具對比
- EasyExcel依賴
- 讀Excel
- 簡單讀取
- 指定列位置
- 讀取多個sheet
- 格式轉換
- 多行表頭
- 同步讀
- 寫Excel
- 簡單寫入
- 單元格樣式
- 攔截器
- 列寬
- 凍結行或列
- 合并單元格
- 填充Excel
- SpringSecurity
- SpringSecurity是什么
- 同類型產品對比
- 環境搭建
- 相關概念
- 密碼加密
- Web權限控制
- UserDetailsService接口
- 登錄認證
- 自定義登錄頁
- 未授權跳轉登錄頁
- 權限控制
- 自定義403頁面
- 權限注解
- 記住我功能
- 注銷功能
- CSRF
- CSRF是什么
- CSRF保護演示
- 前后端分離權限控制
- 環境搭建
- 認證實現
- 會話管理
- 動態權限管理
- 微服務權限控制
- 權限控制方案
- SpringBoot整合RabbitMQ
- 整合步驟
- Fanout交換機演示
- Direct交換機演示
- Topic交換機演示
- @RabbitListener方法
- JWT認證與授權
- 環境搭建
- 密碼加密
- 認證與授權