Skip to main content

Data is not shown on the labeling screen

Nikolai Liubimov
Updated

When labeling tasks and creating annotations, you may see issues where the data, URL, or page does not load. You may also see an error message indicating there was an issue loading the data. This can indicate a problem with the data's format or accessibility. To troubleshoot this, try the following:

Check your internet connection

An unstable or inaccessible internet connection can cause a “Failed to fetch” message when you view a task. Data content is fetched on the client side at the time you load the app to ensure secure data flow, however this requires a stable internet connection. Please check your internet connection and reload the page again.

Runtime error: Failed to fetch
Example of "Failed to fetch" error

Check data access

If your project is configured to use external cloud storage, incorrect permissions can prevent the provided URLs from loading due to restricted access. This can cause Not found (Status = 404) or Permission denied (Status = 403) errors.

To locate this source of error, try navigating to your browser’s Network panel and check to see if there are 403 or 404 errors.

Network panel displaying 404 error
Example of 404 error

You can test the URL directly by copying it and opening in a separate browser tab.

If you see these errors next to your data URLs, check your external storage's permissions or contact the external storage manager.

Check CORS policy

If you have confirmed your permissions are correct and you can access the data outside of Label Studio, the request may have been blocked by a CORS policy, preventing the data from displaying.

To confirm this issue, open your browser’s Console and check for an error message similar to the following: 

Access to XMLHttpRequest has been blocked by CORS policy : No ‘Access-Control-Allow-Origin’ header is present on the requested response

To fix CORS-related issues, please refer to the documentation for your storage provider.

Check imported data format

In some scenarios, when you import annotations or predictions along with the input tasks data, incorrectly formatted JSON payloads can lead to issues on the labeling page. When this occurs, you can view the generated errors in the browser’s Console.

Please reference and follow the format for imported data.

To locate a problematic task, use the Task ID written in the bottom left corner, e.g. Task #12345678. Use this ID to navigate the URL: https://app.humansignal.com/api/tasks/12345678 and check the payload associated with annotations and predictions

If you see an issue with the data format - remove the task(s) (or use the API's Delete task endpoint) and upload a corrected version.

The most common issues when you import prediction and annotations:

  1. You did not specify region ids—they should be unique strings across the current annotation
  2. You used an incorrect from_name
  3. Labels were not wrapped in a list with brackets [ ]:
"value": {
  ...
  "labels": ["Car"]
}

Check labeling configuration

Label Studio offers a very flexible labeling configuration interface that allows you to combine various input / output data formats and apply custom styles and layouts. For example, users can specify a custom layout by injecting CSS code using the <Style> tag. At the same time, improperly built style definitions can interfere and break some parts of the labeling screen.

Different browsers can render CSS in different ways. In some cases, a CSS issue is limited to one browser or version. You can try accessing Label Studio and loading a task in a different browser to see if the issue persists.

If you see the data is improperly loaded on the labeling screen, check your labeling configuration in the project's Settings → Labeling Interface → Code. If you have custom CSS code within <Style> or <View> components, or under style attributes, try removing some styles and check your labeling screen again.

A few recommendations to build a proper labeling config CSS code:

  • Do not use .lsf-... selectors, they are for internal use and subject to change without notice
  • Define a className for tags and style them within the <Style> tag
  • Use display: flex or grid for convenient layouts
  • Use View tags with styles to group items

Check the data size

Label Studio has limitations when working with large data chunks (for example, long audio or video files, documents with many pages, etc.). Check if any of the following limitations apply in your case:

  • Audio length longer than 30 minutes
  • Video length longer than 1 hour
  • High-res (4K) Video
  • Multi-page image documents (>50 pages)
  • Text files >3Mb

Check the Cloud Storage connector parameters

A common error is specifying the incorrect bucket region location, or using an expired Session Token.

Go to the project's Settings → Cloud Storage and check the cloud storage configuration. You can also try deleting the current connection and then configuring a new connection.

Check your tag's valueType

If you’re importing HTML, text, dialogue, or time series data using the <HyperText>, <Text>, <Paragraphs>, or <TimeSeries> tags in your labeling configuration, you can either load data directly, or load data from a URL.

When loading data from a URL, (e.g. http://my.data/example.txt) you must include valueType="url" in your object tag. You can read more about how to import data in our documentation.

Related articles