Can't get BYOC collection using sentinelhub-js

Hello,
Trying to call a BYOC collection with sentinelhub-js I’m getting an unknown error - Error: Must be authenticated to fetch layer params
Checking the layers in the configuration utility and previewing the image, I’m able to see it with no problems.
An unusual problem that I see, it’s that when clicking on the Fit map bounds option I’m getting the following error that may be related.

Hi,

Have you recently updated your credentials? There were some changes detailed here that were made back in December which might be causing this.

We have no problem with the authentication, we are getting other layers with no problem to our webapp using the sentinelhub-js library.
Trying to get a specific BYOC layer created as instructed, we get the layer and when we try getMap function we get this specific exception in our fronted logs.
The response for this → const imageBlob = await layer.getMap(getMapParams, ApiType.WMS);
Is the following:

Error: Must be authenticated to fetch layer params
    at eval (sentinelHub.esm.js:995:19)
    at Generator.next (<anonymous>)
    at eval (sentinelHub.esm.js:261:71)
    at new Promise (<anonymous>)
    at __awaiter (sentinelHub.esm.js:257:12)
    at fetchLayerParamsFromConfigurationService (sentinelHub.esm.js:992:12)
    at BYOCLayer.eval (sentinelHub.esm.js:2798:40)
    at Generator.next (<anonymous>)
    at eval (sentinelHub.esm.js:261:71)
    at new Promise (<anonymous>)
    at __awaiter (sentinelHub.esm.js:257:12)
    at BYOCLayer.fetchLayerParamsFromSHServiceV3 (sentinelHub.esm.js:2791:16)
    at BYOCLayer.eval (sentinelHub.esm.js:4062:52)
    at Generator.next (<anonymous>)
    at eval (sentinelHub.esm.js:261:71)
    at new Promise (<anonymous>)
    at __awaiter (sentinelHub.esm.js:257:12)
    at eval (sentinelHub.esm.js:4054:53)
    at eval (sentinelHub.esm.js:1028:22)
    at Generator.next (<anonymous>)
    at eval (sentinelHub.esm.js:261:71)
    at new Promise (<anonymous>)
    at __awaiter (sentinelHub.esm.js:257:12)
    at ensureTimeout (sentinelHub.esm.js:1025:53)
    at BYOCLayer.eval (sentinelHub.esm.js:4054:19)
    at Generator.next (<anonymous>)
    at eval (sentinelHub.esm.js:261:71)
    at new Promise (<anonymous>)
    at __awaiter (sentinelHub.esm.js:257:12)
    at BYOCLayer.updateLayerFromServiceIfNeeded (sentinelHub.esm.js:4053:16)
    at BYOCLayer.eval (sentinelHub.esm.js:4106:28)
    at Generator.next (<anonymous>)
    at fulfilled (sentinelHub.esm.js:258:58)```

OK thanks for confirming that. Could you please share part of the BYOC Collection ID so that we can help to debug what maybe happening.

In addition, it’s worth double checking that the data in the collection meets all the specifications required for Sentinel Hub ingestion. (It wasn’t clear if accessing this collection has worked in the past or if it is a new BYOC Collection)

Thank You!

Here is a partial ID code, if I understand correctly you can complete form data in your servers - 2a003893-3574-4a9a-8d04
Yes, all the specifications are applied correctly and I can see the image through the configuration utility. The problem as referenced before is to get the image with sentinelhub-js library.

Hello,
sorry for late answer.

Requesting BYOC data from Sentinel hub via WMS requires some more parameters than requesting, for example, Sentinel-2 L2A data.

For using WMS, the instance ID (instanceId) and layer ID (layerId) parameters must be provided when creating a Layer class (e.g. S2L2ALayer for Sentinel-2 L2A, or BYOCLayer for BYOC).

For BYOC, additional parameters are needed when creating a Layer class - collection ID (collectionId) and location ID (locationId).

Collection ID of the layer can be found in the Dashboard (FAQ answer).

Possible values for location ID in sentinelhub.js. If you choose the wrong one, the request will fail and will contain an error with the correct / preferred location.

import { BYOCLayer, CRS_EPSG4326, BBox, MimeTypes, ApiType, LocationIdSHv3 } from '@sentinel-hub/sentinelhub-js';

const getMapParams = {
  bbox: new BBox(CRS_EPSG4326, 11.9, 42.05, 12.95, 43.09),
  fromTime: new Date(Date.UTC(2019, 6 - 1, 1, 0, 0, 0)),
  toTime: new Date(Date.UTC(2019, 6 - 1, 30, 23, 59, 59)),
  width: 512,
  height: 512,
  format: MimeTypes.JPEG,
};

const layerBYOC = new BYOCLayer({ 
  instanceId: BYOC_INSTANCE_ID, 
  layerId: BYOC_LAYER_ID,
  collectionId: BYOC_COLLECTION_ID,
  locationId: LocationIdSHv3.awsEuCentral1
  // there is also a "evalscript" parameter that overrides the evalscript that is set in the dashboard
  // evalscript: "//VERSION=3 ..."
});

const img = await layerBYOC.getMap(getMapParams, ApiType.WMS);

If collection ID or location ID are not provided, the layer.getMap() automatically makes a request to get these ids from Sentinel hub before requesting satellite imagery, but it requests them from the endpoints that require authentication.
Documentation for authentication with sentinelhub.js is available here.

import { setAuthToken, requestAuthToken, isAuthTokenSet } from '@sentinel-hub/sentinelhub-js';

if (!isAuthTokenSet()) {
  const authToken = await requestAuthToken(CLIENT_ID, CLIENT_SECRET);
  setAuthToken(authToken);
  console.log('Auth token retrieved and set successfully');
}

Hope this helps.

Cheers.