done chunk upload

This commit is contained in:
Peter Maquiran
2024-02-08 10:14:21 +01:00
parent 60edd1ca01
commit 0e383c85a8
5 changed files with 31 additions and 61 deletions
@@ -75,7 +75,7 @@ class ReconnectingWebSocketSignalR {
private onDisconnect: Function[] = [] private onDisconnect: Function[] = []
private onConnect: Function[] = [] private onConnect: Function[] = []
private whenConnected: Function[] = [] private whenConnected: Function[] = []
private stop = true stop = true
constructor() {} constructor() {}
@@ -182,28 +182,19 @@ export class MiddlewareServiceService {
CMAPIFileContent({length, path, index, blobFile}) { CMAPIFileContent({length, path, index, base64}) {
const headers = new HttpHeaders();
headers.set('Authorization', 'Bearer ' + SessionStore.user.Authorization);
// const geturl = 'http://localhost:3001/FileHub'; // const geturl = 'http://localhost:3001/FileHub';
const geturl = environment.apiPCURL + 'FileContent/UploadFile'; const geturl = environment.apiPCURL + 'FileContent/UploadFile';
let options = { const data = {
headers: headers index,
}; length,
base64,
const formData = new FormData(); path,
formData.append("blobFile", blobFile);
formData.append("length", length);
formData.append("index", index.toString());
if(path) {
formData.append("path", path);
} }
return this.http.post<IuploadFileLK>(`${geturl}`, formData, options) return this.http.post<IuploadFileLK>(`${geturl}`, data)
} }
CMAPIRequestUpload() { CMAPIRequestUpload() {
@@ -430,8 +430,6 @@ export class NewPublicationPage implements OnInit {
if (this.publicationType == ActionType.edit) { if (this.publicationType == ActionType.edit) {
if (this.seletedContent.length >= 1) { if (this.seletedContent.length >= 1) {
const loader = this.toastService.loading() const loader = this.toastService.loading()
@@ -459,8 +457,6 @@ export class NewPublicationPage implements OnInit {
return e return e
}) })
console.log("this.publication.Files", this.publication.Files)
} }
this.publication.Files = this.publication.Files.map( (e: PublicationAttachmentEntity) => ({ this.publication.Files = this.publication.Files.map( (e: PublicationAttachmentEntity) => ({
@@ -481,7 +477,7 @@ export class NewPublicationPage implements OnInit {
this.httpErroHandle.httpStatusHandle(error) this.httpErroHandle.httpStatusHandle(error)
if (error.status == 404) { if (error.status == 404) {
this.PublicationFolderService.deletePost(this.publication.ProcessId, this.publication.DocumentId) this.PublicationFolderService.deletePost(this.publication.ProcessId, this.publication.DocumentId)
//this.goBack(); this.goBack();
} }
} finally { } finally {
loader.remove() loader.remove()
@@ -512,14 +508,13 @@ export class NewPublicationPage implements OnInit {
const upload = await this.publicationFormMV.uploadVideosFiles() const upload = await this.publicationFormMV.uploadVideosFiles()
if(upload) { if(upload) {
this.publication.Files = this.publication.Files.map((e:PublicationAttachmentEntity)=> { this.publication.Files = this.publication.Files.map((e:PublicationAttachmentEntity) => {
if(e.FileType == 'video') { if(e.FileType == 'video') {
e.OriginalFileName = e.chucksManager.path.replace(".mp4", "") e.OriginalFileName = e.chucksManager.path.replace(".mp4", "")
e.FileExtension = "mp4" e.FileExtension = "mp4"
e.Base64 = "" e.Base64 = ""
} }
alert("commit")
this.publicationFormMV.ObjectMergeNotification.socket.commit(e.chucksManager.path) this.publicationFormMV.ObjectMergeNotification.socket.commit(e.chucksManager.path)
return e return e
@@ -550,7 +545,7 @@ export class NewPublicationPage implements OnInit {
this.httpErroHandle.httpsSucessMessagge('Editar publicação') this.httpErroHandle.httpsSucessMessagge('Editar publicação')
} }
//this.goBackToViewPublications.emit(); this.goBackToViewPublications.emit();
} catch (error) { } catch (error) {
this.httpErroHandle.httpStatusHandle(error) this.httpErroHandle.httpStatusHandle(error)
} finally { } finally {
@@ -568,11 +563,11 @@ export class NewPublicationPage implements OnInit {
} }
// this.publicationFormMV.ObjectMergeNotification.close() this.publicationFormMV.ObjectMergeNotification.close()
} }
ngOnDestroy() { ngOnDestroy() {
// this.publicationFormMV.ObjectMergeNotification.close() this.publicationFormMV.ObjectMergeNotification.close()
} }
close() { close() {
@@ -12,7 +12,6 @@ export enum UploadError {
export type IOUploadError = "noConnection" | "slow" export type IOUploadError = "noConnection" | "slow"
@Injectable({ @Injectable({
providedIn: 'root' providedIn: 'root'
}) })
@@ -34,21 +33,7 @@ class UploadFileUseCase {
const base64 = await PublicationAttachmentEntity.chucksManager.chunks.getChunks(index) const base64 = await PublicationAttachmentEntity.chucksManager.chunks.getChunks(index)
if(index == 2) { const uploadRequest = this.CMAPIService.FileContent({length, path: PublicationAttachmentEntity.chucksManager.path, index, base64})
const base1 = await PublicationAttachmentEntity.chucksManager.chunks.getChunks(2)
// Get the video element from the DOM
const videoElement: any = document.getElementById("yourVideoElementId");
// Set the src attribute of the video element to the blob URL
videoElement.src = "data:video/mp4;base64,"+ base1 + base64 ;
// Optionally, you can also set other attributes or play the video
videoElement.controls = true; // Add controls for play, pause, etc.
videoElement.play(); // Auto-play the vid
}
const uploadRequest = this.CMAPIService.FileContent({length, path: PublicationAttachmentEntity.chucksManager.path, index, blobFile: base64})
uploadRequest.then((uploadRequest) => { uploadRequest.then((uploadRequest) => {
if(uploadRequest.isOk()) { if(uploadRequest.isOk()) {
@@ -59,21 +44,21 @@ class UploadFileUseCase {
return uploadRequest; return uploadRequest;
} }
// if(!PublicationAttachmentEntity.chucksManager.hasPath()) { if(!PublicationAttachmentEntity.chucksManager.hasPath()) {
// const guidRequest = await this.CMAPIService.RequestUpload() const guidRequest = await this.CMAPIService.RequestUpload()
// if(guidRequest.isOk()) { if(guidRequest.isOk()) {
// path = guidRequest.value+".mp4" path = guidRequest.value+".mp4"
// PublicationAttachmentEntity.chucksManager.setPath(path) PublicationAttachmentEntity.chucksManager.setPath(path)
// } else { } else {
// const pingRequest = await this.CMAPIService.ping() const pingRequest = await this.CMAPIService.ping()
// if( pingRequest.isErr()) { if( pingRequest.isErr()) {
// return resolve(err(UploadError.noConnection)) return resolve(err(UploadError.noConnection))
// } else { } else {
// return resolve(err(UploadError.slow)) return resolve(err(UploadError.slow))
// } }
// } }
// } }
const allRequest: Promise<any>[] = [] const allRequest: Promise<any>[] = []
let connection = true let connection = true
@@ -219,14 +204,13 @@ export class PublicationFormMV {
if(!PublicationAttachmentEntity.hasChunkManger) { if(!PublicationAttachmentEntity.hasChunkManger) {
const fileBlob = PublicationAttachmentEntity.blobFile; const fileBlob = PublicationAttachmentEntity.blobFile;
const fileChunks = new Chunks({chunkSize: 70 }) const fileChunks = new Chunks({chunkSize: 1024 })
fileChunks.setFile(fileBlob) fileChunks.setFile(fileBlob)
PublicationAttachmentEntity.setChunkManger(fileChunks) PublicationAttachmentEntity.setChunkManger(fileChunks)
PublicationAttachmentEntity.chucksManager.registerOnLastChunk(() => { PublicationAttachmentEntity.chucksManager.registerOnLastChunk(() => {
console.log("last chunk ===============================================")
const guid = PublicationAttachmentEntity.chucksManager.path const guid = PublicationAttachmentEntity.chucksManager.path
this.ObjectMergeNotification.subscribe(guid, (data) => { this.ObjectMergeNotification.subscribe(guid, (data) => {
@@ -17,9 +17,9 @@ export class CMAPIService {
window["CMAPIAPIRepository"] = this window["CMAPIAPIRepository"] = this
} }
async FileContent({length, path, index, blobFile}): Promise<Result<IuploadFileLK, "badRequest" | "other">> { async FileContent({length, path, index, base64}): Promise<Result<IuploadFileLK, "badRequest" | "other">> {
try { try {
const result = await this.MiddlewareServiceService.CMAPIFileContent({length, path, index, blobFile}).toPromise(); const result = await this.MiddlewareServiceService.CMAPIFileContent({length, path, index, base64}).toPromise();
return ok(result) return ok(result)
} catch (error) { } catch (error) {
if(error.status >= 400 && error.status >= 499) { if(error.status >= 400 && error.status >= 499) {