Yoast is outputting invalid JSON-LD URIs for the @id tag in Schema entity output

[webstackdev]

• [ x] I've read and understood the contribution guidelines.
• [x ] I've searched for any related issues and avoided creating a duplicate issue.

Please give us a description of what happened

I am working on a site that uses trailing slashes after all URLs, for example https://example.com/blog/my-article-slug/. The project uses WordPress as a headless CMS, and a static site generate fetching data via the WP REST API. The trailing slashes are added by the hosting platform (Vercel, via the "trailingSlash": true option in the project config). They are also added in WP's Settings -> Permalink Settings options for blog articles (/blog/%postname%/). We also have an optional category base set in Permalinks (blog/categories) that follows a different pattern (no trailing slash, in either case they're both normalized by Vercel).

We are currently getting the following output for the @id field of the outputted JSON-LD from Yoast (yoast_head):

"@id": "https://example.com/#organization/"
"@id": "https://example.com/#/schema/logo/image/"
"@id": "https://example.com/?p=15292#breadcrumb/"

URI fragments and query parameters should not be followed by a slash per the specs, to the best of my understanding. I included the details about our setup to be able to share the Permalink settings and make sense. I can update with any relevant Yoast settings; I did not see any that appear directly related to this besides setting the type of content for a page in the Yoast WP UI panel.

Expected results

"@id": "https://example.com/#organization"
"@id": "https://example.com/?p=15292#breadcrumb"

I'm not sure what this should be: https://example.com/#/schema/logo/image/

Technical info

JSON-LD graph objects (including @id) are JSON-LD node objects. Their value must be of type IRI or compact IRI. A trailing slash after the path pattern is not allowed (RFC 3987 section).

Used versions

• Device you are using: Chrome
• Operating system: SiteGround custom Linux container
• PHP version: 7.4.33
• WordPress version: 6.6-beta-2
• WordPress Theme: N/A
• Yoast SEO version:

• ACF 22.8
• ACFE 21.8

• Relevant plugins in case of a bug: ACF (with Pro and Extended), Classic Editor, Duplicate Page, Enable Media Replace, Gravity Forms, Images to Webp, Redirection, Safe SVG, SiteGround Security Optimizer, WP all import / export

[josevarghese]

Hi @webstackdev

Thanks for using the Yoast SEO plugin and also for creating the issue.

I tried to replicate this by creating multiple sites using InstaWP and WP Local, checked the REST API, and noticed that the @id property for the breadcrumb and organization are outputted without the trailing slash. So, it seems like some other plugins or some server rules are adding a trailing slash at the end of the schema on your website.

FYI, I tested with the latest versions of WordPress 6.5.4 and Yoast SEO 22.9 (released today).

I also checked the REST API URL of our website, which is mentioned in our developer documentation over here and also confirmed that the @id property for the breadcrumb and organization within the yoast_head: are outputted without the trailing slash at the end. See the screenshot here: https://ibb.co/4SpfrwP for your reference.

So, can you please perform a conflict check on your staging site to find out which plugin or whether any server rules are adding this trailing slash or not?

We look forward to hearing from you and are happy to help you.

[webstackdev]

@josevarghese thank you, I'll investigate further on our end

[mrispoli24]

@josevarghese @webstackdev I believe that in this instance the trailing slash is wanted in all cases except when there are anchor tags present and URL params. It makes sense to add a trailing slash by default for sites that redirect from non-trailing slash to trailing slash.

In this case though trailing slash should not appear after URL params and anchor links.

For Example:

"@id": "https://example.com/#organization/"
"@id": "https://example.com/my-page-needs-a-slash/"
"@id": "https://example.com/my-page-needs-a-slash/?p=my-url-param/"
"@id": "https://example.com/my-page-needs-a-slash/#and-and-anchor/"

Should be:

"@id": "https://example.com/#organization"
"@id": "https://example.com/my-page-needs-a-slash/"
"@id": "https://example.com/my-page-needs-a-slash/?p=my-url-param"
"@id": "https://example.com/my-page-needs-a-slash/#and-and-anchor"

We're seeing trailing slash appended to all URL's regardless of if they contain search params or anchors.

[josevarghese]

Hi @mrispoli24

Thanks for the comment.

Regarding "@id": "https://example.com/#organization/" having a trailing slash at the end, I am not able to replicate it as mentioned over here. If you can share more steps on how to replicate it one by one, it would be helpful for me.

[webstackdev]

@josevarghese I think we resolved it, thank you for your help.

[josevarghese]

Good to hear that the issue is fixed. If you can share details on how you have fixed it, it would be helpful for users checking this issue.

Have a great day!