Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

How to play local videos in pywebview? #1555

Open
junbrave1 opened this issue Dec 27, 2024 · 1 comment
Open

How to play local videos in pywebview? #1555

junbrave1 opened this issue Dec 27, 2024 · 1 comment

Comments

@junbrave1
Copy link

Specification

  • pywebview version: 5.3.2
  • operating system: Windows 10
  • web renderer: cef/edgechromium

Description

Regardless of whether I use the GUI display mode of cef or edgechromium, I have explicitly forced the use of --allow-file-access-from-files within the code. However, when my code attempts to load local files, it still throws the following error:

GET file:///C:/test.mp4 net::ERR_UNKNOWN_URL_SCHEME

or

Not allowed to load local resource: file:///C:/test.mp4

my test html is as follows:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Auto Play Video</title>
    <style>
        body {
            display: flex;
            justify-content: center;
            align-items: center;
            height: 100vh;
            margin: 0;
            background-color: #f0f0f0;
        }
        video {
            width: 80%;
            max-width: 640px;
            border: 2px solid #333;
            border-radius: 10px;
        }
    </style>
</head>
<body>
    <video id="myVideo" controls>
        <source src="file:///c:/test.mp4" type="video/mp4">
        Your browser does not support the video tag.
    </video>

    <script>
        
        window.onload = function() {
            const video = document.getElementById('myVideo');
            setTimeout(() => {
                video.muted = false; 
                console.log("start play");
                video.play().catch(error => {
                    console.error('play failed:', error);
                });
            }, 3000);
        };
    </script>
</body>
</html>

Code for adding permissions:
edgechromium (modify edgechromium.py):

# if webview_settings['ALLOW_FILE_URLS']:
props.AdditionalBrowserArguments += ' --disable-web-security'
props.AdditionalBrowserArguments += ' --enable-media-stream'

props.AdditionalBrowserArguments += ' --allow-file-access'
props.AdditionalBrowserArguments += ' --allow-file-access-from-files'
props.AdditionalBrowserArguments += ' --autoplay-policy=no-user-gesture-required'

cef (modify cef.py):

default_command_line_switches['allow-file-access-from-files'] = ''
default_command_line_switches['enable-media-stream'] = ''        
default_command_line_switches['autoplay-policy'] = 'no-user-gesture-required'

Strangely, the following permission I added works as expected:

--autoplay-policy=no-user-gesture-required

How can I remove this restriction? Our application needs to be able to play local video files within the program.

Practicalities

  • YES/NO I am willing to work on this issue myself.

  • YES/NO I am prepared to support this issue financially.
@r0x0r
Copy link
Owner

r0x0r commented Dec 27, 2024

Better approach would be to use a local http server. file:// protocol is flawed.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
2 participants
@r0x0r @junbrave1