Embed A Design

This guide will walk you through how to embed a design using the Core3D Embed APIs.

Note: This guide builds up a previous guide (Generate A Design).

Note: You'll need an API token to perform any of these actions. See the Authentication section of the API Reference. We'll use $TOKEN as a placeholder for your API token in the examples below.

Contents

Step 1 — Choose A Design

We'll use the Design generated in our previous guide as an example. The URI for that Design is core3d:design:018d715f-b81f-79e7-a942-c9e4f3f5f1cc.

Step 2 — Request The HTML

We can request HTML from the Core3D API that we can drop onto our website to display the 3D model.

Request

$ curl -X POST https://api.core3d.io/embed/iframe/v1 \
    -H "Authorization: Bearer $TOKEN" \
    -H "Content-Type: application/json" \
    -d '{
    "uri": "core3d:design:018d715f-b81f-79e7-a942-c9e4f3f5f1cc"
}'

Response

{
    "html": "<iframe title=\"chill-zebra-2271\" frameborder=\"0\" allow=\"autoplay;\" execution-while-out-of-viewport execution-while-not-rendered src=\"https://api.core3d.io/embed/iframe/v1/core3d:design:018d715f-b81f-79e7-a942-c9e4f3f5f1cc?token=$TOKEN\"></iframe>"
}

Step 3 — Generate A Token

We'll need to replace the $TOKEN string in the response with a real API token. Exposing a token with read or write access in any public context is dangerous -- if the token is visible in your source code it can be extracted and used to view or manipulate resources in your Core3D account. To avoid this, we'll generate a token that meets the following criteria:

  • is assigned only the embed capability, which provides very limited access to Core3D API resources
  • has an explicit origin allowlist, to prevent it from working on any other origins

Note: You can read more about this in the API Reference.

Request

$ curl -X POST https://api.core3d.io/v1/tokens \
    -H "Authorization: Bearer $TOKEN" \
    -H "Content-Type: application/json" \
    -d '{
    "capabilities": ["embed"],
    "origins": ["https://www.core3d.io"],
    "type": "api",
    "user": "~"
}'

Response

{
    // ... additional properties omitted
    "token": "c3dak_abcdefgh_abcdefghijklmnopqrstuvqx"
}

Step 4 — View The Result

After replacing the $TOKEN parameter with our new embed token we can view the result.

Get in touch

We'd love to learn more about your vision and how we can help.

PressPrivacyTermsSupportCopyright © 2024 Core3D, Inc. All Rights Reserved.