A Snippet of a Custom BaseTileLayer rendering, serverside, a png layer

CustomPngLayer.js

let CustomTileLayer = BaseTileLayer.createSubclass({
      properties: {
        urlTemplate: null,
      },
      getTileUrl: function (level, row, col) {
        return this.urlTemplate
          .replace("{z}", level)
          .replace("{x}", col)
          .replace("{y}", row);
      },

      fetchTile: function (level, row, col, options) {
        let url = this.getTileUrl(level, row, col);

        // request for the tile based on the url returned from getTileUrl() method.
        // the signal option ensures that obsolete requests are aborted.
        return esriRequest(url, {
          //referrer: "origin",
          responseType: "image",
          signal: options && options.signal,
        })
          .then((response) => {
            const image = response.data;

            const width = this.tileInfo.size[0];
            const height = this.tileInfo.size[0];

            const canvas = document.createElement("canvas");
            const context = canvas.getContext("2d");
            canvas.width = width;
            canvas.height = height;
            context.drawImage(image, 0, 0, width, height);
            console.log(`new: ${level}-${row}-${col}`);
            return canvas;
          })
          .catch((err) => console.error(err.message));
      },
    }); // end class

let myLayer = new CustomTileLayer({
      urlTemplate: [url],
      id: "19"
    });