How to preview blob data image in the image src?

I have problem on file uploading. The image that I selected is not showing on the image src even the path is correct. I used Formik for the file uploading and react js for my front end side.

The path that I get is:

blob:http://localhost:3000/3d582eac-909f-45f0-bf53-beb6f5da78ea

This path is working well but the image is not showing up.

{values.initialCategory.cat_image && <img src={URL.createObjectURL(values.initialCategory.cat_image)} style={{ height: 65, width: 65, borderRadius: '50%' }} />}

<input
    type="file"
    hidden
    name={`initialCategory[${index}].cat_image`}
    onChange={(event) => {
        setFieldValue(`initialCategory[${index}].cat_image`, URL.createObjectURL(event.target.files[0]));
    }}
/>