Hi,
We have enabled APM RUM for our React app using @elastic/apm-rum package. And, we are trying to upload the source maps for the code base to APM, so that we can better debug our client application errors.
Following is the code from our pipeline, that pushes the source maps to APM.
const fs = require('fs');
const axios = require('axios');
const FormData = require('form-data');
const serviceVersion = '<our-service-version>'
const ELASTICSEARCH_DOMAIN = 'our-elastic-search-domain-name'
const ELASTICSEARCH_API_KEY = 'our-key'
const sourcemaps = fs.readdirSync('./public').filter((file) => file.endsWith('.map'));
const sourcemapRequests = sourcemaps.map((sourcemap) => {
const bundledFilePath = `/${sourcemap.replace('.map', '')}`;
const url = `${ELASTICSEARCH_DOMAIN}/api/apm/sourcemaps`;
const data = new FormData();
data.append('service_name', 'our-react-app');
data.append('service_version', serviceVersion);
data.append('bundle_filepath', bundledFilePath);
data.append('sourcemap', fs.createReadStream(`./public/${sourcemap}`), {
contentType: 'application/octet-stream',
});
const config = {
headers: {
'kbn-xsrf': 'true',
Authorization: `ApiKey ${ELASTICSEARCH_API_KEY}`,
...data.getHeaders(),
},
};
return axios
.post(url, data, config)
.then(() => {
console.log('Uploaded', sourcemap);
})
.catch((error) => {
console.log('Error uploading', sourcemap, '\nError:', error.response.data);
});
});
Promise.all(sourcemapRequests)
.then(() => console.log('Completed'))
.catch((error) => console.error('An error occurred', error));
Only a very few source maps are uploaded and a majority of the source maps upload calls are failing with the following error:
Error uploading <filename>.js.map
Error: { ok: false, message: 'backend closed connection' }