Fix: UI Azure pre-sign upload (#6764)

* Fix: UI Azure pre-sign upload * Fix docs
treeverse · Oct 12, 2023 · b8e67e3 · b8e67e3
1 parent 386507b
commit b8e67e3
Show file tree

Hide file tree

Showing 3 changed files with 10 additions and 3 deletions.
diff --git a/docs/reference/security/presigned-url.md b/docs/reference/security/presigned-url.md
@@ -68,7 +68,7 @@ For using presigned URLs in the UI:
           <AllowedOrigins>lakefs.endpoint</AllowedOrigins>  
           <AllowedMethods>PUT,GET</AllowedMethods>  
           <AllowedHeaders>*</AllowedHeaders>  
-          <ExposedHeaders>ETag</ExposedHeaders>  
+          <ExposedHeaders>ETag,x-ms-*</ExposedHeaders>  
           <MaxAgeInSeconds>3600</MaxAgeInSeconds>  
       </CorsRule>  
   </Cors>

diff --git a/webui/src/lib/api/index.js b/webui/src/lib/api/index.js
@@ -586,7 +586,7 @@ class Tags {
 
 // uploadWithProgress uses good ol' XMLHttpRequest because progress indication in fetch() is
 //  still not well supported across browsers (see https://stackoverflow.com/questions/35711724/upload-progress-indicators-for-fetch).
-export const uploadWithProgress = (url, file, method = 'POST', onProgress = null) => {
+export const uploadWithProgress = (url, file, method = 'POST', onProgress = null, additionalHeaders = null) => {
     return new Promise((resolve, reject) => {
         const xhr = new XMLHttpRequest();
         xhr.upload.addEventListener('progress', event => {
@@ -606,6 +606,9 @@ export const uploadWithProgress = (url, file, method = 'POST', onProgress = null
         xhr.open(method, url, true);
         xhr.setRequestHeader('Accept', 'application/json')
         xhr.setRequestHeader('X-Lakefs-Client', 'lakefs-webui/__buildVersion')
+        Object.keys(additionalHeaders).map(function(key, _) {
+            xhr.setRequestHeader(key, additionalHeaders[key])
+        })
         if (url.startsWith(API_ENDPOINT)) {
             // swagger API requires a form with a "content" field
             const data = new FormData();

diff --git a/webui/src/pages/repositories/repository/objects.jsx b/webui/src/pages/repositories/repository/objects.jsx
@@ -229,8 +229,12 @@ const ImportModal = ({config, repoId, referenceId, referenceType, path = '', onD
 const uploadFile = async (config, repo, reference, path, file, onProgress) => {
   const fpath = destinationPath(path, file);
   if (config.pre_sign_support_ui) {
+      let additionalHeaders;
+      if (config.blockstore_type === "azure") {
+          additionalHeaders = { "x-ms-blob-type": "BlockBlob" }
+      }
     const getResp = await staging.get(repo.id, reference.id, fpath, config.pre_sign_support_ui);
-    const { status, etag } = await uploadWithProgress(getResp.presigned_url, file, 'PUT', onProgress)
+    const { status, etag } = await uploadWithProgress(getResp.presigned_url, file, 'PUT', onProgress, additionalHeaders)
     if (status >= 400) {
       throw new Error(`Error uploading file: HTTP ${status}`)
     }