# Changes for internal APIs affecting site data sync in the browser

> Important changes affecting tools using internal Webflow APIs

To support [real-time collaboration](https://webflow.com/collaboration), we're implementing version control on a set of internal APIs used to read and write site data to the designer from the browser. To ensure continued functionality of browser extensions and tools that currently use this set of APIs, please see the timeline and migration steps below.

**Please note: If you're building apps with Webflow's official set of Public APIs, this won't affect your work.**

## Affected internal endpoints

Starting August 13, 2025, the following internal site data sync endpoints will now support and enforce version control.

* <span data-badge-type="http-method" data-http-method="GET" class="fern-docs-badge large green subtle">GET</span> `/sites/{siteName}/dom`
* <span data-badge-type="http-method" data-http-method="POST" class="fern-docs-badge large blue subtle">POST</span> `/pages/{pageId}/dom`
* <span data-badge-type="http-method" data-http-method="POST" class="fern-docs-badge large blue subtle">POST</span> `/sites/{siteName}/variables`
* <span data-badge-type="http-method" data-http-method="PATCH" class="fern-docs-badge large orange subtle">PATCH</span> `/sites/{siteName}/variables/{variableId}`
* <span data-badge-type="http-method" data-http-method="POST" class="fern-docs-badge large blue subtle">POST</span> `/sites/{siteName}/styles`

<br />

**Starting September 15, 2025**, these endpoints will require a version number in all write requests. Requests without a version number will return an error.

**These endpoints will be fully deprecated and removed in late 2026**. We recommend updating your tools now to comply with version checks, while also planning your migration away from these endpoints before the deprecation date. We will provide further notice about the final deprecation date at a later time.

## Timeline

<Steps>
  <Step title="August 13, 2025">
    This set of internal APIs will start returning and accepting version fields for reads and writes
  </Step>

  <Step title="August 19, 2025">
    DevRel hosted office hours for additional developer support. Sign up for office hours [here](https://riverside.fm/webinar/registration/eyJzbHVnIjoid2ViZmxvdy1vbi13ZWJmbG93IiwiZXZlbnRJZCI6IjY4OWFiMjJkODM2ZTJkZWRkYWJhYzAzMSIsInByb2plY3RJZCI6IjY4OWFiMjJkODM2ZTJkNjllMGJhYzAyZSJ9).
  </Step>

  <Step title="September 15, 2025">
    This set of internal APIs will start enforcing version checks on all writes
  </Step>

  <Step title="Late 2026">
    These endpoints will be fully deprecated and removed. We will provide further notice about the final deprecation date at a later time.
  </Step>
</Steps>

<Note title="Office hours & support">
  We understand that this is a change for some developers, and we're here to help. **[Sign up for our office hours](https://riverside.fm/webinar/registration/eyJzbHVnIjoid2ViZmxvdy1vbi13ZWJmbG93IiwiZXZlbnRJZCI6IjY4OWFiMjJkODM2ZTJkZWRkYWJhYzAzMSIsInByb2plY3RJZCI6IjY4OWFiMjJkODM2ZTJkNjllMGJhYzAyZSJ9) on August 19, 2025 to answer questions and help with the migration.**

  Additionally, you can reach out to our developer support team at <a href="mailto:developers@webflow.com">[developers@webflow.com](mailto:developers@webflow.com)</a> for help.
</Note>

## Version management

### Reading site data

The <span data-badge-type="http-method" data-http-method="GET" class="fern-docs-badge large green subtle">GET</span> `/sites/{siteName}/dom` endpoint now returns a resource version number for in the following fields

<Tabs>
  <Tab title="Fields">
    | Resource              | Version Field                    | Type     | Description                                                               |
    | --------------------- | -------------------------------- | -------- | ------------------------------------------------------------------------- |
    | `domNodes`            | `domNodesVersion`                | `number` | The version number of the DOM nodes array                                 |
    | `styles`              | `stylesVersion`                  | `number` | The version number of the styles object                                   |
    | `variables`           | `variables?[].version`           | `number` | The version number for each object within the `variables` array           |
    | `variableCollections` | `variableCollections?[].version` | `number` | The version number for each object within the `variableCollections` array |

    <Note title="Versioning for interactions is not yet available">
      Currently, version fields aren't returned for interactions. However, this could change in the future.
    </Note>
  </Tab>

  <Tab title="Example response">
    Below is a truncated example response from the <span data-badge-type="http-method" data-http-method="GET" class="fern-docs-badge large green subtle">GET</span> `/sites/{siteName}/dom` endpoint.

    ```json title={"response.json"}
    {
        "siteId": "6813a82d2006ad93ffe5da10",
        "userId": "63209baeac0b804b455624ce",
        "userEmail": "user@example.com",
        "siteName": "Hello Webflow Cloud!",
        "timezone": "America/New_York",
        "maxPages": 500,
        "styles": {
            "blocks": [
                {
                    "_id": "default-body",
                    "data": {
                        "type": "tag",
                        "name": "body",
                        "sel": "body",
                        "comb": "",
                        "styleLess": "background-color: hsla(0, 0.00%, 0.00%, 1.00); font-family: Inter; color: hsla(0, 0.00%, 100.00%, 1.00); font-size: 16px; line-height: 20px;",
                        "children": [],
                        "variants": {},
                        "affects": {
                            "6813a82d2006ad93ffe5da63": 1,
                            "6813a82d2006ad93ffe5da8d": 1,
                            "6813a82d2006ad93ffe5daa8": 1,
                            "6813a82d2006ad93ffe5daa9": 1,
                            "6813a82d2006ad93ffe5daaa": 1,
                            "6813a82d2006ad93ffe5dab6": 1,
                            "6813a82d2006ad93ffe5dab7": 1
                        }
                    }
                }
                
            ],
            "data": {
                "swatches": [
                    {
                        "id": "4b5c02bd",
                        "name": "Primary",
                        "color": "hsla(258.9261744966443, 100.00%, 70.78%, 1.00)"
                    },
                    {
                        "id": "c4be53de",
                        "name": "Yellow Green 700",
                        "color": "hsla(93.6986301369863, 28.85%, 49.61%, 1.00)"
                    },
                    {
                        "id": "d45e5cda",
                        "name": "White",
                        "color": "hsla(73.7007874015748, 0.00%, 92.67%, 1.00)"
                    },
                    {
                        "id": "1490ec53",
                        "name": "Gray 300",
                        "color": "hsla(0, 0.00%, 70.00%, 1.00)"
                    },
                    {
                        "id": "c8810603",
                        "name": "Gray 500",
                        "color": "hsla(0, 0.00%, 45.88%, 1.00)"
                    },
                    {
                        "id": "c0417f39",
                        "name": "Border Radius",
                        "color": "hsla(0, 0.00%, 13.33%, 1.00)"
                    }
                ],
                "breakpoints": {
                    "main": {
                        "maxWidth": 10000
                    },
                    "medium": {
                        "maxWidth": 991
                    },
                    "small": {
                        "maxWidth": 767
                    },
                    "tiny": {
                        "maxWidth": 479
                    }
                },
                "macros": [],
                "migrations": {
                    "stylesNext": true
                },
                "appliedStylesMap": {}
            }
        },
        "domNodes": [
            {
                "_id": "6488afbdd39e79104a3d2867",
                "type": "Body",
                "tag": "body",
                "classes": [],
                "children": [
                    "810571f6-b040-2142-b6b7-b134c6cd9dda"
                ],
                "data": {}
            }
        ],
        "domNodesVersion": 1726,
        "stylesVersion": 1830,
        "variables": [
            {
                "id": "variable-4b5c02bd",
                "type": "color",
                "value": {
                    "type": "color",
                    "value": "#6C3EF5"
                },
                "name": "Primary",
                "deleted": true,
                "createdOn": "2023-10-11T21:31:10.304Z",
                "updatedOn": "2025-08-14T17:12:20.672Z",
                "order": "a ",
                "modes": [],
                "version": 73
            }
        ],
        "variableCollections": [
            {
                "id": "collection-3cf95d6f-abf1-0dcc-0668-d8f4bb66741e",
                "name": "My New Collection",
                "deleted": true,
                "createdOn": "2025-05-01T16:58:22.556Z",
                "updatedOn": "2025-06-12T14:12:41.259Z",
                "modes": [],
                "order": "a!",
                "isDefault": false,
                "origin": null,
                "version": 1
            }
        ]
    }
    ```
  </Tab>
</Tabs>

<br />

### Writing site data

The following endpoints require version numbers in the request body for all writes:

* <span data-badge-type="http-method" data-http-method="POST" class="fern-docs-badge large blue subtle">POST</span> `/pages/{pageId}/dom`
* <span data-badge-type="http-method" data-http-method="POST" class="fern-docs-badge large blue subtle">POST</span> `/sites/{siteName}/variables`
* <span data-badge-type="http-method" data-http-method="PATCH" class="fern-docs-badge large orange subtle">PATCH</span> `/sites/{siteName}/variables/{variableId}`
* <span data-badge-type="http-method" data-http-method="POST" class="fern-docs-badge large blue subtle">POST</span> `/sites/{siteName}/styles`

<br />

## Errors and responses

<span data-badge-type="http-method" data-http-method="POST" class="fern-docs-badge large blue subtle">POST</span> and <span data-badge-type="http-method" data-http-method="PATCH" class="fern-docs-badge large orange subtle">PATCH</span> requests to the above endpoints will return errors if the version numbers are missing or don't match.

* **409 Conflict**: Version mismatch. <br />
  A later version of the data is available. Fetch the latest data and retry the operation.
* **400 Bad Request**: Missing version numbers in write requests. <br />
  The request body must include a version number for each resource in the request.

<br />

## Migration steps

<Note title="Migrate to the Designer API before the deprecation date">
  Most of the functionality served by these endpoints is also available in the [Designer API](/designer/reference/introduction). We recommend migrating to the Designer API for future development for reliability and consistency. If you need additional functionality that's not available in the Designer API, please reach out to our developer support team at <a href="mailto:developers@webflow.com">[developers@webflow.com](mailto:developers@webflow.com)</a> to tell us what you need.
</Note>

<Steps>
  ### 1. Update data retrieval

  In addition to retrieving site information, be sure to store version numbers when retrieving data.

  Additionally you must include the `X-Webflow-App-ID` header in all requests. `X-Webflow-App-ID` should be a unique name that refers to your application or extension.

  ```javascript
  const response = await fetch(`/sites/${siteName}/dom`,
    method: 'GET',
    {
      headers: {
        'X-Webflow-App-ID': 'YOUR_UNIQUE_NAME'
      }
    }
  );
  const data = await response.json();

  // Store version numbers for sync
  const versions = {
    domNodes: data.domNodesVersion,
    styles: data.stylesVersion,
    variables: data.variables?.map(v => ({ id: v.id, version: v.version })),
    variableCollections: data.variableCollections?.map(vc => ({ id: vc.id, version: vc.version }))
  };
  ```

  ### 2. Update data writing

  Include version numbers and `X-Webflow-App-ID` header in all write requests.

  `X-Webflow-App-ID` should be a unique name that refers to your application or extension.

  ```javascript
  // Example: Updating styles
  const updateResponse = await fetch(`/sites/${siteName}/styles`, {
    method: 'POST',
    headers: {
      'X-Webflow-App-ID': 'YOUR_UNIQUE_NAME',
      'Content-Type': 'application/json; charset=UTF-8',
      'X-Requested-With': 'XMLHttpRequest',
      'X-XSRF-Token': 'YOUR TOKEN HERE'  // must match the current from browser cookies
    },
    body: JSON.stringify({
      styles: newStyles,
      stylesVersion: versions.styles // Include current version
    }),
    credentials: 'same-origin'
  });

  if (updateResponse.status === 409) {
    // Version conflict - fetch latest data and retry
    const latestData = await fetch(`/sites/${siteName}/dom`);
    // Update your local versions and retry the operation
  }
  ```

  ### 3. Handle version conflicts

  Implement retry logic for version conflicts:

  ```javascript
  async function updateWithRetry(endpoint, data, maxRetries = 3) {
    for (let attempt = 0; attempt < maxRetries; attempt++) {
      try {
        const response = await fetch(endpoint, {
          method: 'POST',
          headers: {
            'X-Webflow-App-ID': 'YOUR_UNIQUE_NAME',
            'Content-Type': 'application/json; charset=UTF-8',
            'X-Requested-With': 'XMLHttpRequest',
            'X-XSRF-Token': 'YOUR TOKEN HERE' // must match the current from browser cookies
          },
          body: JSON.stringify(data),
          credentials: 'same-origin'
        });

        if (response.status === 409) {
          // Fetch latest versions and retry
          const latest = await fetch(`/sites/${siteName}/dom`);
          const latestData = await latest.json();
          data.stylesVersion = latestData.stylesVersion;
          // Update other version fields as needed
          continue;
        }

        return response;
      } catch (error) {
        if (attempt === maxRetries - 1) throw error;
      }
    }
  }
  ```
</Steps>

## Important reminders

* This API will be fully deprecated and removed in late 2026
* Consider migrating to [official Webflow APIs](/designer/reference/introduction) when available.
* Test thoroughly in development environments before deploying

## Support

For questions about this migration, contact our [developer support team.](mailto:developers@webflow.com) However, we can't provide ongoing support for private API usage.