Can multiple JSON-LD Schema.org tags represent the same 'object'?

I have a site where the client is requesting JSON-LD (not microdata) schema.org tags. One of the ones they want is a base 'WebPage' tag on every page, with some information about the things we have on every page. Another is a 'FAQPage' that will be added only on the specific FAQ page. Both will be being added directly onto the page as inline script tags.

FAQPage inherits from WebPage, so it contains all the properties of WebPage.

If I just let the Footer code generate a 'WebPage' tag, and the FAQ component generate the 'FAQPage' tag, both will end up on the page as separate JSON-LD script tags - which I believe would be interpreted as two separate 'web pages' - not what we're looking for.

Is it possible to mark up the schema tag so that the two JSON-LD tags represent an 'extending' of eachother, instead? Since FAQPage inherits WebPage, I'm hoping there's a way to set an identifier that shows both are the same Page being documented.

(Yes, I could use logic on the backend to 'pass' information about the FAQPage to the footer, and have the footer component output FAQPage or WebPage dynamically, but that's not what I'm looking for here.)

Solution

The @id keyword can get used for this. It gives a node object an identifier in the form of an IRI (or a blank node identifier).

Node objects with the same @id value are the same thing, no matter if the types these things have are in an inheritance relationship or not.

These IRIs don’t have to resolve to a document on the Web. If they do, you should make sure to keep the differentiation between the thing and the document about that thing.

However, in your specific case, the thing and the document about that thing represent actually the same. So you could use your page’s canonical IRI as @id:

<!-- on the page /faq -->

<script type="application/ld+json">
{
    "@context": "https://schema.org",
    "@type": "FAQPage",
    "@id": "/faq"
}
</script>

<script type="application/ld+json">
{
    "@context": "https://schema.org",
    "@type": "WebPage",
    "@id": "/faq"
}
</script>

In cases where objects represent the same thing, but have different @id values, you can make the relationship explicit by using the property owl:sameAs. But consumers that only support Schema.org won’t recognize this. (Schema.org also has a sameAs property, but it has a different meaning.)