Lipsync not working: The play() request was interrupted because the media was removed from the document

FrancescoCaracciolo commented 1 month ago

My code:

!DOCTYPE html>
<html lang="en" >
<head>
  <meta charset="UTF-8">
  <title>Live2D displayer</title>
<link rel="stylesheet" href="./style.css">

</head>
<body>
<!-- Load Cubism and PixiJS -->
<script src="https://cubism.live2d.com/sdk-web/cubismcore/live2dcubismcore.min.js"></script>
<script src="https://cdn.jsdelivr.net/gh/dylanNew/live2d/webgl/Live2D/lib/live2d.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/pixi.js@7.x/dist/pixi.min.js"></script>

<!-- if support for both Cubism 2.1 and 4 -->
<script src="https://cdn.jsdelivr.net/gh/RaSan147/pixi-live2d-display@v0.4.0-ls-4/dist/index.min.js"></script>

<canvas id=canvas></canvas>
<script  src="./script2.js"></script>
</body>
</html>


const cubism2Model =
  "https://cdn.jsdelivr.net/gh/guansss/pixi-live2d-display/test/assets/shizuku/shizuku.model.json";
var model_proxy;

(async function main() {
  const app = new PIXI.Application({
    view: document.getElementById("canvas"),
    autoStart: true,
    resizeTo: window
  });

  const model2 = await PIXI.live2d.Live2DModel.from(cubism2Model);

  model_proxy = model2;
  app.stage.addChild(model2);

  model2.scale.set(0.3);

  model2.x = 300;
    model2.on('hit', (hitAreas) => {
        if (hitAreas.includes('head')) {
            model2.speak("https://audio-samples.github.io/samples/mp3/blizzard_primed/sample-4.mp3");
        }
    });
})();

function playAudio(audio_link, volume=1, expression=0) {
    model_proxy.speak(audio_link,{ volume: 1, expression: null, resetExpression: true, crossOrigin: 'anonymous' });
}

I get these errors when trying to play anything: Chrome: immagine Firefox:

FrancescoCaracciolo commented 1 month ago

If you need, you can try it here: https://codepen.io/Francesco-Caracciolo/pen/BagzNXe

RaSan147 commented 1 month ago

I do remember having the issue. Not sure why it happened and how I fixed it. Will check on it. Thanks

FrancescoCaracciolo commented 1 month ago

I think it is something wrong with browser versions, with older chromium versions that code works, while with newer Chrome/FF version it gives that error

RaSan147 commented 1 month ago

Thats creepy

On Thu, Jul 25, 2024, 2:58 PM Francesco Caracciolo @.***> wrote:

I think it is something wrong with browser versions, with older chromium versions that code works, while with newer Chrome/FF version it gives that error

— Reply to this email directly, view it on GitHub https://github.com/RaSan147/pixi-live2d-display/issues/8#issuecomment-2249823464, or unsubscribe https://github.com/notifications/unsubscribe-auth/AIDNL24RXMCSFVIKKVLDVLDZOC4ZZAVCNFSM6AAAAABLH2KXCOVHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMZDENBZHAZDGNBWGQ . You are receiving this because you commented.Message ID: @.***>

RaSan147 / pixi-live2d-display

Lipsync not working: The play() request was interrupted because the media was removed from the document #8