Amazon S3 Image is not working on og:image tags though bucket is public

Please give me some pointers for solving the issue which is listed below.

I have an issue on og tags for fetching the image. I am using the React with Razzle for server side rendering. All the site images is stored on aws bucket which has public access on for fetching the image.

These are the tags which I am using under the specific page through Helmet.

<Helmet>
          <title>{this.props.data.title+" | by "+this.props.data.username} </title>
          {/* facebook open graph tags */}
          <meta data-rh="true" property="og:locale" content="en_US" />
          <meta data-rh="true" property="og:url" content="http://somedomain.com/view/Some title of the post" />
          <meta data-rh="true" property="og:title" content="Some title of the post" />
          <meta data-rh="true" property="og:type" content="article" />
          <meta data-rh="true" property="og:description" content="Description of the post" />
          <meta property="og:image" content="https://s3.ap-south-1.amazonaws.com/bucketname/somerandomnameofimage.png" />
          <meta property="og:site_name" content="SiteName" />  
        </Helmet>

After some findings I have changed the image from some random link which is accessible and use that url of image under the og:image tags and then I checked and its working.

What I am thinking is it will not fetch the aws s3 image. But if that is the case then how other people do.

I checked many sites og tags and found that they will use some subdomain.domain.com/someimagename.extension, If this is the only case then how I achieve this. And my question is then why we use image hosting provider if we have to do it like the ancient programming way.

Please suggest me how to solve this.
Any help or suggestion is really appreciated.