player.on('xhr-hooks-ready', () => {
              const playerResponseHook = async (request, error, response) => {
                //console.log("response ", response.statusCode);

                switch (response.statusCode) {
                  case 403:
                    //const ret = await fetch("/api/token/");
                    player.trigger('error');
                  break;
                  default:

                  break;
                }
              };

              player.ready(() => {
                player.tech().vhs.xhr.onResponse(playerResponseHook);
              });

              
            });

            player.reloadSourceOnError({

              // getSource allows you to override the source object used when an error occurs
              getSource: async (reload) => {
                console.log('Reloading because of an error');

                const streamName = player.options_.sources[0].src,
                ret = await fetch(`/api/token/${streamName}`, {
                  headers: {
                    'Accept': 'application/json'
                  }
                });

                const token = await ret.json();


                console.log("token ret ", token, token.token);
                player.options_.token = token.token;

            
                // call reload() with a fresh source object
                // you can do this step asynchronously if you want (but the error dialog will
                // show up while you're waiting)
                reload({
                  src: streamName,
                  type: 'video/hls'
                });
              },
            
              // errorInterval specifies the minimum amount of seconds that must pass before
              // another reload will be attempted
              errorInterval: 5
            });
        }
        ```