In this article, we are going to see how to autosave the document in AWS S3. You can automatically save the edited content in regular intervals of time. It helps reduce the risk of data loss by saving an open document automatically at customized intervals.
The following example illustrates how to auto save the document in AWS S3.
contentChanged
boolean, the document send as Docx format to server-side using saveAsBlob
method.import {
DocumentEditorContainer,
Toolbar,
} from '@syncfusion/ej2-documenteditor';
let container: DocumentEditorContainer = new DocumentEditorContainer({ enableToolbar: true, height: '590px' });
let contentChanged: boolean = false;
DocumentEditorContainer.Inject(Toolbar);
container.serviceUrl = 'https://ej2services.syncfusion.com/production/web-services/api/documenteditor/';
container.created = function () {
setInterval(() => {
if (contentChanged) {
//You can save the document as below
container.documentEditor.saveAsBlob('Docx').then((blob: Blob) => {
console.log('Saved sucessfully');
let exportedDocument: Blob = blob;
//Now, save the document where ever you want.
let formData: FormData = new FormData();
formData.append('fileName', 'sample.docx');
formData.append('data', exportedDocument);
/* tslint:disable */
var req = new XMLHttpRequest();
// Replace your running Url here
req.open(
'POST',
'http://localhost:62869/api/documenteditor/SaveToS3',
true
);
req.onreadystatechange = () => {
if (req.readyState === 4) {
if (req.status === 200 || req.status === 304) {
console.log('Saved sucessfully');
}
}
};
req.send(formData);
});
contentChanged = false;
}
}, 1000);
};
container.appendTo('#container');
container.contentChange = (): void => {
contentChanged = true;
};
web.config
file and register profile in startup.cs
.In web.config
, add key like below format:
<appSettings>
<add key="AWSProfileName" value="sync_development" />
<add key="AWSAccessKey" value="" />
<add key="AWSSecretKey" value="" />
</appSettings>
In startup.cs
, register profile in below format:
Amazon.Util.ProfileManager.RegisterProfile("sync_development","", "");
[AcceptVerbs("Post")]
[HttpPost]
[EnableCors("AllowAllOrigins")]
[Route("SaveToS3")]
public string SaveToS3()
{
IFormFile file = HttpContext.Request.Form.Files[0];
Stream stream = new MemoryStream();
file.CopyTo(stream);
UploadFileStreamToS3(stream, "documenteditor", "", "GettingStarted.docx");
stream.Close();
return "Sucess";
}
public bool UploadFileStreamToS3(System.IO.Stream localFilePath, string bucketName, string subDirectoryInBucket, string fileNameInS3)
{
AWSCredentials credentials = new StoredProfileAWSCredentials("sync_development");
IAmazonS3 client = new AmazonS3Client(credentials, Amazon.RegionEndpoint.USEast1);
TransferUtility utility = new TransferUtility(client);
TransferUtilityUploadRequest request = new TransferUtilityUploadRequest();
if (subDirectoryInBucket == "" || subDirectoryInBucket == null)
{
request.BucketName = bucketName; //no subdirectory just bucket name
}
else
{ // subdirectory and bucket name
request.BucketName = bucketName + @"/" + subDirectoryInBucket;
}
request.Key = fileNameInS3; //file name up in S3
request.InputStream = localFilePath;
utility.Upload(request); //commensing the transfer
return true; //indicate that the file was sent
}
Get the complete working sample in this link
.