← Cloudflare Workers / workers / observability

Source maps и трассировки стека

Трассировки стека ↗ помогают отлаживать код, если в приложении возникает необработанное исключение. Трассировки стека показывают, какие именно функции были вызваны, в каком порядке, из какой строки и файла и с какими аргументами.

Большая часть JavaScript-кода сначала собирается в бандл, часто транспилируется, а затем минифицируется перед деплоем в продакшен. Этот процесс создает бандлы меньшего размера для оптимизации производительности и при необходимости преобразует код из TypeScript в Javascript.

Source maps сопоставляют скомпилированный и минифицированный код с исходным кодом, который вы написали. Source maps объединяются с трассировкой стека, возвращаемой средой выполнения JavaScript, чтобы показать вам понятную трассировку стека.

Чтобы включить source maps, добавьте следующее в файл вашего Worker Конфигурация Wrangler:

{
	"upload_source_maps": true
}

upload_source_maps = true

Когда upload_source_maps имеет значение true, Wrangler автоматически создаст и загрузит файлы source map при выполнении wrangler deploy или wrangler versions deploy.

Когда Worker выбрасывает необработанное исключение, мы получаем карту исходного кода (source map) и с её помощью сопоставляем трассировку стека исключения со строками исходного кода вашего Worker.

Затем можно просмотреть трассировку стека при потоковой передаче логи в реальном времени или в Tail Workers.

Когда Cloudflare пытается сопоставить трассировку стека с source map Worker, это происходит построчно, с максимально возможным сопоставлением. Если какую-то строку трассировки стека сопоставить не удается, Cloudflare оставляет эту строку без изменений и переходит к следующей строке трассировки стека.

Рассмотрим простой проект. src/index.ts служит точкой входа приложения и src/calculator.ts определяет класс ComplexCalculator, который поддерживает базовые арифметические операции.

Посмотрим, как source maps упрощают отладку ошибки в классе ComplexCalculator.

С карты исходного кода не загружены: обратите внимание, что весь JavaScript минифицирован в один файл, поэтому в трассировке стека отсутствует информация об имени файла, указаны неверные номера строк и неверно указана ссылка на js вместо ts.

С карты исходного кода загружены: все методы ссылаются на верные файлы и номера строк.

• Tail Workers - Узнайте, как подключить Tail Workers для преобразования логов и отправки их на HTTP-эндпоинты.
• Логи в реальном времени - Узнайте, как собирать логи Workers в реальном времени.
• Обработка ошибок RPC - Узнайте, как обрабатываются исключения через RPC (Remote Procedure Call).