twilio / twilio-video-processors.js

Twilio Video Processors is a collection of video processing tools which can be used with Twilio Video JavaScript SDK to apply transformations and filters to a video track.
Other
33 stars 21 forks source link

Incorrect response MIME type. Expected 'application/wasm'. #42

Closed mahdi-above closed 2 years ago

mahdi-above commented 2 years ago

I followed this tutorial:

https://www.twilio.com/blog/change-background-video-calls-twilio-video-processors-library

I included the js file in my index.html using script tag.

I get the following warnings and error:

image

This is the code I used:

        const showLocalVideo = async () => {
            const videoTrack = await Twilio.Video.createLocalVideoTrack({
                width: 640,
                height: 480,
                frameRate: 24
            });
            document.getElementById('local-media').appendChild(videoTrack.attach());

            let img = new Image();
            img.src = 'https://nikonrumors.com/wp-content/uploads/2014/03/Nikon-1-V3-sample-photo.jpg';
            img.onload = async () => {
                const bg = new Twilio.VideoProcessors.VirtualBackgroundProcessor({
                    assetsPath: '/',
                    backgroundImage: img,
                    maskBlurRadius: 5,
                });
                await bg.loadModel();

                videoTrack.addProcessor(bg);
            }
        }

        showLocalVideo();
    And this is how I included script files:
     <script src="https://sdk.twilio.com/js/video/releases/2.15.2/twilio-video.min.js"></script>
    <script src="/js/twilio-video-processors.js"></script>
charliesantos commented 2 years ago

Hey @mahdi-above , thanks for reporting. Can you please quickly try our demo app and see if you're getting the same issue? https://twilio.github.io/twilio-video-processors.js/examples/virtualbackground/

mahdi-above commented 2 years ago

OK, I found the issue.

I noticed the server doesn't recognize the type of wasm files so it doesn't return anything type in response header.

I added the following line in my .htaccess and the problem resolved:

<IfModule mod_mime.c>
  AddType application/wasm .wasm
</IfModule>