Video not loading

[exeldoc]

Hey. I read other topic like this, but i didn’t find any solution till now.

Basically I want to load a video from the server with the HTML5 tag <video> as a kind of a “cover” for each subpage. It is quite strange, the page gets the URL of the video correctly, also the other info from the subpages txt file are shown – but the browser(any browser) gives me a 404 on videos or images.

Here is what i already tried:

• checking URL 3000 times for a mistake
• replacing the video tag with a img tag – also the img wasn’t loaded, although the URL was right.
• loading it to a server – not just on localhost
• video tag with a direct url in the kirby structure (without any php) didn’t work
• using the cover() trick within a model – it gave the URL aswell, but the video was still 404
• removing signs like “_” from the URL
• video tag in a plan html file – that worked –> video was loaded.

So i assume, that it might have to do something with kirby since it is working on plain html and the correct URLs and field information are shown in the DevTools. I used the latest starter kid to build the page.
Since my head is breaking for 4 hours of research and trying, maybe someone sees an obvious mistake on my end…
Thanks already for looking in to it.

My structure looks like this:

In the home.php tamplate it looks link this:

 <?php snippet('header') ?>
 <?php snippet('opener') ?>

 <?php foreach ($artwork as $artwork): ?>
   <section id="<?= $artwork->artist_Id() ?>" class="segment">
    <div class="full_grid ">
     <div class="artist_trailer_container">
      <video id="<?= $artwork->artist_Id() ?>_trailer" class="vid" preload="auto" autoplay="true" loop="loop" muted="muted" volume="0">
        <source src="<?= $artwork->trailer() ?>.webm" type="video/webm">
        <source src="<?= $artwork->trailer() ?>.mp4" type="video/mp4">
        <source src="<?= $artwork->trailer() ?>.ogv" type="video/ogg ogv">
          Video not supported 
       </video>
      </div>
     </div>
    </section>
<?php endforeach ?>

This would be the controller site.php:

<?php

return function ($site, $pages, $page) {
  $artwork = ($site->children()->listed()->offset(1));

 return [
'artwork' => $artwork
];
};

And the txt file:

name: Name
----   
artist_Id: Name
----
trailer: content/3_video/IMG_1826
----

[pixelijn]

@exeldoc

src="<?= $artwork->trailer() ?>.webm"

Should be:

<source src="<?= url() . '/' . $artwork->trailer() ?>.webm" type="video/webm">

[exeldoc]

@pixelijn

<?= url() . '/' . $artwork->trailer() ?>

unfortunately that’s not it:

[pixelijn]

You have 2 folders with the same name video! That’s not possible. Be careful when creating pages manually, because folder names must be unique. And the prepended number doesn’t count.

[exeldoc]

Shure the folders! I tried to simplify too much for the topic here.

I renamed them, so they are unique now… (it was showing just one of those sections – now it shows all of them)

Anyway, this is not the solution for the video load problem.
The full video link copied into the browser, is also not showing the video. :-/

[exeldoc]

ok, it gets even freakier.
I found an older version of this project – at that time i tried to make it an onepager.
anyways, here it works.

Now the thing – I copied the URL in another browser tab. In my currant branch = 404 on the older one it works.

Something else I noticed:
the variable $artwork from site controller is somehow not working if i use it in a snippet. it is just working if I use it in the home.php. I thought that was not the way it is supposed to be.
Not sure if that gives any clue.

[texnixe]

What is your current Kirby version?

[exeldoc]

i rebuild the hole thing in a painkid, that i downloaded today. So i guess it is the newest.

[texnixe]

@exeldoc

painkid

Your subconscious mind at work?

Could you just send me the files? Something seems strange…

[exeldoc]

sure.

[eXpl0it3r]

You seem to be trying to directly link the files that are located in the page directories, but with Kirby 3 all files are served via the media directory. There are some workarounds as I’ve heard, but you need to serve the URLs that start with /media/.

If it’s a file in your page directory, it’s best to query it as file and get the url from that, instead of stitching it together yourself.

If you do want to directly access the files without going through the /media/ folder, you have to make sure, your .htaccess file or nginx config is allowing that and I’m not sure if there’s other stuff to consider:

# block all files in the content folder from being accessed directly
RewriteRule ^content/(.*) index.php [L]

[texnixe]

@eXpl0it3r

You seem to be trying to directly link the files that are located in the page directories, but with Kirby 3 all files are served via the media directory.

You are absolutely right. The reason why it works on my machine is because I use Valet and it runs under nginx, so no htaccess rules.

I thought it was not supposed to work, but was totally irritated because it worked here locally.

In some projects with older htaccess rules it works, though.

[eXpl0it3r]

In case you really want to serve it from the content folder, I just had to do this myself, because I don’t want to copy 500MB - 2GB files around for every page/directory change (and the copying seems to break on my hoster), so here’s what I did (thanks to @jimbobrjames and this thread):

• Add a new plugin directory (e.g. contentfiles)
• Create a new index.php in said directory
• Add the code from the following snippet
• Adjust the .htaccess rule as shown below
• Be aware of the potential downsides, risks and breaking things, by circumventing Kirby 3’s design decision
• Enhance as you like

<?php

Kirby::plugin('yourname/contentfiles', [
    'options' => [
        'extenions' => [
            'mp4'
        ]
    ],
    'components' => [
        'file::url' => function (Kirby $kirby, $file)
        {
            $page = $file->parent();

            if (in_array($file->extension(), option('yourname.contentfiles.extenions')))
            {
                return $kirby->url() . '/content/' . $page->diruri() . '/' . $file->filename();
            }
            else
            {
                return $file->mediaurl();
            }
        }
    ]
]);

# block all files except videos in the content folder from being accessed directly
RewriteRule !^content/(.*).mp4 - [C]
RewriteRule ^content/(.*) index.php [L]

[texnixe]

@eXpl0it3r The component is only needed if the url() method is called, not when files are called manually like in the example above. I’m not sure why this is done, probably because of serving different versions of the video while only storing the path to the base name.

So the solution here would be to adapt the .htaccess-

[eXpl0it3r]

That is true, then again, I’d argue that going via the files of the page instead of manually stitching together URLs is a better “design”.

[exeldoc]

Thanks for participating.
Sounds link a good plan. I actually don’t have an idea how I can get the video files through the media folder. As far as I know, there in no video tag like the image()tag.

And if there is a way like that: how could I reach the different mime types of the video?
Finally, the videos are not supposed to be loaded on the subpage itself, it is supposed to be more like a cover from the subpage on the home.php.

[texnixe]

The first thing I’d try is changing the .htaccess. I think that is the main reason why it doesn’t work.

There was this change a few month ago:

# block text files in the content folder from being accessed directly
RewriteRule ^content/(.*)\.(txt|md|mdown)$ index.php [L]
# block all files in the content folder from being accessed directly
RewriteRule ^content/(.*) index.php [L]

So before that change, accessing media files in the content folder was no issue.

[exeldoc]

This works:

# block all files in the content folder from being accessed directly
RewriteRule !^content/(.*).(mp4|webm|ovg) - [C]
RewriteRule ^content/(.*) index.php [L]

Thanks very much.