Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Can React Helmet inject a javascript object into <HEAD> tag?

I've a question, I need to inject into the HEAD tag a javascript object, for tag management purposes. This is my Helmet component, but it accepts only specific parameters to set to metadata serverside through rewind() function.

Is there a way still to use React Helmet to do what I need, so, create javascritpt objects into a SCRIPT tag or should I follow a different approach?

MyComponent.js

<Helmet
    title={article.get('title')}
    meta={[
        {"property": "og:title", "content": article.get('title')},
        {"property": "og:url", "content": article.get('url')},

        {"property": "twitter:title", "content": article.get('title')}
    ]}
/>

server.js

let htmlHead = `
  ${head.title}
  ${head.meta.toString()}
`;

Thank you for the support

like image 794
axel Avatar asked Jun 20 '16 12:06

axel


People also ask

Is react Helmet enough for SEO?

React Helmet is a library that helps you deal with search engines and social media crawlers by adding meta tags to your pages/components on React so your site gives more valuable information to the crawlers. “This reusable React component will manage all of your changes to the document head.

Can you add script tags to react?

The react-helmet is also a well-known npm package mostly used for adding an element at the head of a react document. We can add a script tag inside the head of the document using this package.

What is react Helmet used for?

React Helmet can be termed as the document head manager for React-based applications. Using it, it becomes very easy for developers to update meta tags present on the server-side and the client-side. This library can be termed perfect for applications where SEO plays a crucial role.


1 Answers

Th existing answers are outdated. You don't need to contort the code with script attributes or innerHTML. You can use the <script> tag as usual in HTML:

<Helmet>
  <script src="https://some.host/api.js" type="text/javascript" />
</Helmet>
like image 103
Dan Dascalescu Avatar answered Oct 20 '22 00:10

Dan Dascalescu