react-helmet not fetched by social sites if API_URL points to server.js to retrieve data

First of all. Amazing boilerplate, I’m really enjoying building my magazine with this.

So… Currently UserCard action points to a jsonplaceholder to retrieve data. Example A: const API_URL = 'https://jsonplaceholder.typicode.com/users';

In a real world case it could be fetched from server.js: Example B:const API_URL = '/api/article';

Example A & Example B both return the same data, the only difference is that Example B has to talk to the server instead of making a HTTP request.

I added react-helmet to UserCard:

export default ({ info }: Props) => (
  <div className={styles.UserCard}>
    <Helmet>
      <meta property="og:title" content={info.name} />
    </Helmet>
    <h4>User Card</h4>
    <ul>
      <li>Name: {info.name}</li>
      <li>Phone: {info.phone}</li>
      <li>Email: {info.email}</li>
      <li>Website: {info.website}</li>
    </ul>
  </div>
);

I am testing if the og:title is fetched by facebook’s open graph crawler using: https://developers.facebook.com/tools/debug/sharing/

If data is fetched via Example A, the open graph crawler fetches the {info.name} correctly.

If data is fetched via Example B, it does not fetch the {info.name}, it just returns the project’s default meta data from “config/default.js”

I’m unsure why this happens and would really love some advice with what the issue is here,

I realise that this is quite a specific issue, but this is the last step in deploying my magazine via this boilerplate - I would really appreciate any help.

Thank you in advance.

[holodan]

@wellyshen It’s working 😄 Thank you so much, I can’t believe how simple it was - I have been stuck on this for 2 months!

I can leave you alone now sorry 😆 Keep up the amazing work!

[holodan]

@wellyshen Thank you very much, I have just re-updated my fork to resemble react-cool-starter with my additional changes to represent the issue. Please let me know if you need anything else.