Skip to content

Issue: CORS Prevents Embedding LangSmith Traces in iframe / no embed API #1731

Open
@100stacks

Description

@100stacks

Issue you'd like to raise.

Hello there!

I want to be able to embed a LangSmith trace on my webpage rather than recreate it. This would allow users to interact with the trace rather than a static screenshot.

I did not find a way to do this via a LangSmith API embed-type option, so I tired using a simple <iframe>. Unfortunately, <iframe> is blocked by smith.langchain.com. At the moment, the only workaround I've found is to provide a link that opens the trace in a new browser tab.

Trace I want to Embed

ref trace: https://smith.langchain.com/public/ec157737-8a46-4fcc-aba3-30347ed647c9/r/07b6efb4-bc81-4178-8b59-cfc156c69b55

trace

Blocked LangSmith Trace

blocked
log

Troubleshooting CORS Headers

  • X-Frame-Options: SAMEORIGIN : This header prevents the page from being embedded in an <iframe> from any origin other than your site (smith.langchain.com).
  • Content-Security-Policy: frame-ancestors self: This CSP directive restricts what domains can embed the page in an iframe. self means only the same origin (smith.langchain.com) can embed it.

Suggestion:

One of the benefits of LangSmith is to show users the traces. Being able to embed the trace would make online/digital content interactive. I do not want to have to recreate the trace when you've already done the hard work. 🙇😄

A few suggestions:

  • provide API access to embed the trace
  • modify CORS for smith.langchain.com/public route to allow embedding the trace.

Thank you LangChain team! 🙌

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions