web/satellite: abort request to get object count in 10 seconds
When entering passphrase to open bucket we make a ListObjectsV2Command request to figure out if there are objects encrypted with different passphrase. If there are a lot of objects then this request takes forever to process. By this change I added 10 seconds timeout for that request to not block user. Issue: https://github.com/storj/storj/issues/5954 Change-Id: I5243fba68d0b56dff2fb2b3a608a5e71860724c2
This commit is contained in:
parent
d38b8fa2c4
commit
cb41c51692
@ -52,6 +52,10 @@
|
||||
:is-transparent="isWarningState"
|
||||
/>
|
||||
</div>
|
||||
<div v-if="isLoading" class="modal__loading-wrap">
|
||||
<VLoader width="50px" height="50px" is-white />
|
||||
<p class="modal__loading-wrap__label">Counting objects...</p>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</VModal>
|
||||
@ -73,6 +77,7 @@ import { useProjectsStore } from '@/store/modules/projectsStore';
|
||||
import VModal from '@/components/common/VModal.vue';
|
||||
import VInput from '@/components/common/VInput.vue';
|
||||
import VButton from '@/components/common/VButton.vue';
|
||||
import VLoader from '@/components/common/VLoader.vue';
|
||||
|
||||
import AccessEncryptionIcon from '@/../static/images/accessGrants/newCreateFlow/accessEncryption.svg';
|
||||
import OpenWarningIcon from '@/../static/images/objects/openWarning.svg';
|
||||
@ -148,9 +153,9 @@ async function onContinue(): Promise<void> {
|
||||
|
||||
closeModal();
|
||||
analytics.pageVisit(RouteConfig.Buckets.with(RouteConfig.UploadFile).path);
|
||||
await router.push(RouteConfig.Buckets.with(RouteConfig.UploadFile).path);
|
||||
router.push(RouteConfig.Buckets.with(RouteConfig.UploadFile).path);
|
||||
} catch (error) {
|
||||
await notify.error(error.message, AnalyticsErrorEventSource.OPEN_BUCKET_MODAL);
|
||||
notify.error(error.message, AnalyticsErrorEventSource.OPEN_BUCKET_MODAL);
|
||||
isLoading.value = false;
|
||||
}
|
||||
}
|
||||
@ -182,6 +187,7 @@ function setPassphrase(value: string): void {
|
||||
flex-direction: column;
|
||||
padding: 32px;
|
||||
max-width: 350px;
|
||||
position: relative;
|
||||
|
||||
&__header {
|
||||
display: flex;
|
||||
@ -250,6 +256,23 @@ function setPassphrase(value: string): void {
|
||||
row-gap: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
&__loading-wrap {
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
background: rgb(27 37 51 / 40%);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
&__label {
|
||||
font-family: 'font_medium', sans-serif;
|
||||
font-size: 18px;
|
||||
margin-top: 16px;
|
||||
color: var(--c-white);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.orange-border {
|
||||
|
@ -220,11 +220,31 @@ export const useBucketsStore = defineStore('buckets', () => {
|
||||
}
|
||||
|
||||
async function getObjectsCount(name: string): Promise<number> {
|
||||
const response = await state.s3Client.send(new ListObjectsV2Command({
|
||||
Bucket: name,
|
||||
}));
|
||||
const abortController = new AbortController();
|
||||
|
||||
return response.KeyCount === undefined ? 0 : response.KeyCount;
|
||||
const request = state.s3Client.send(new ListObjectsV2Command({
|
||||
Bucket: name,
|
||||
}), { abortSignal: abortController.signal });
|
||||
|
||||
const timeout = setTimeout(() => {
|
||||
abortController.abort();
|
||||
}, 10000); // abort request in 10 seconds.
|
||||
|
||||
let response;
|
||||
try {
|
||||
response = await request;
|
||||
clearTimeout(timeout);
|
||||
} catch (error) {
|
||||
clearTimeout(timeout);
|
||||
|
||||
if (abortController.signal.aborted) {
|
||||
return 0;
|
||||
}
|
||||
|
||||
throw error;
|
||||
}
|
||||
|
||||
return (!response || response.KeyCount === undefined) ? 0 : response.KeyCount;
|
||||
}
|
||||
|
||||
function clearS3Data(): void {
|
||||
|
Loading…
Reference in New Issue
Block a user