Skip to main content

Error Handling

You might need to handle specific server errors in your application. Here is an example of how you can do that.

tsx
import {
EdgeStoreApiClientError,
UploadAbortedError,
} from '@edgestore/react/errors';
// ...
<button
onClick={async () => {
try {
if (file) {
const res = await edgestore.publicFiles.upload({
file,
});
}
} catch (error) {
// All errors are typed and you will get intellisense for them
if (error instanceof EdgeStoreApiClientError) {
// if it fails due to the `maxSize` set in the router config
if (error.data.code === 'FILE_TOO_LARGE') {
alert(
`File too large. Max size is ${formatFileSize(
error.data.details.maxFileSize,
)}`,
);
}
// if it fails due to the `accept` set in the router config
if (error.data.code === 'MIME_TYPE_NOT_ALLOWED') {
alert(
`File type not allowed. Allowed types are ${error.data.details.allowedMimeTypes.join(
', ',
)}`,
);
}
// if it fails during the `beforeUpload` check
if (error.data.code === 'UPLOAD_NOT_ALLOWED') {
alert("You don't have permission to upload files here.");
}
} else if (error instanceof UploadAbortedError) {
// if the upload was canceled from an AbortController's signal
console.log('Upload aborted');
} else {
// unknown error
console.error(error);
}
}
}}
disabled={!file || !!uploadedUrl}
>
Upload
</button>

Error Codes

  • BAD_REQUEST
  • FILE_TOO_LARGE
  • MIME_TYPE_NOT_ALLOWED
  • UNAUTHORIZED
  • UPLOAD_NOT_ALLOWED
  • DELETE_NOT_ALLOWED
  • CREATE_CONTEXT_ERROR
  • SERVER_ERROR