6

I am working on a project in which I store youtube video links in a database and then I retrieve those links and using blade template engine i try to embed them into page. I use a loop to put videos in a page. For some reason I'm not getting any video in the browser. It is covering the mentioned space but not rendering anything. I'm using laravel 3. Here's couple of code snippets, if they help.

This is the index.blade.php

@layout('layouts.master')

@section('content')

@foreach ($videos as $video)
    <h4>{{ $video->title }}</h4>
    <br>
    <div class="media">
        <div class="media-body">
            <iframe width="560" height="315" src="{{ $video->link }}" frameborder="0" allowfullscreen>
            </iframe>
        </div>
    </div>
    <br>
@endforeach

@endsection

The $videos variable is passed from controller.

class Videos_Controller extends Base_Controller
{
public $restful = true;

public function get_index()
{
    $videos = DB::table('videos')->get();
    return View::make('videos.index')
        ->with('title', 'Videos')
        ->with('videos', $videos);
}
}

All i get is a blank page. I don't understand what i'm doing wrong. I'm using twitter bootstrap for css prototyping. Any help will be appreciated.

Here's how master.blade.php's 'head' looks like:

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>{{ $title }} </title>
    <meta name="viewport" content="width=device-width">
    {{ HTML::style('css/bootstrap.min.css') }}
    {{ HTML::style('css/bootstrap-responsive.min.css') }}
</head>

This is what comes up in firefox when I inspect element.

<div class="media">

<div class="media-body">
    <iframe width="560" height="315" frameborder="0" allowfullscreen=""   src="http://www.youtube.com/watch?v=1iBm60uJXvs">
        #document
            <html>
                <head></head>
                <body></body>
            </html>
    </iframe>
</div>

</div>
Xk0nSid
  • 961
  • 2
  • 11
  • 19
  • Did you check the `blank page`'s source code? Is it generating the iFrames? If so, did you check that the links work in an browser? – Sven van Zoelen Jun 06 '13 at 12:39
  • It does generate the iframes and the links does work in the browser. – Xk0nSid Jun 06 '13 at 15:59
  • @Xk0nSid : I am facing the same issue . did you manage to find a solution. Even my page is rendered properly , with the correct links but the video is not getting displayed. – Gagan Jan 15 '14 at 06:32
  • @Gagan Sorry. Couldn't find a solution. – Xk0nSid Jan 16 '14 at 20:20

7 Answers7

5

Fortunately , I did manage to find a solution to my problem. Hopefully it should help you as well . Use the url that is present in the embed statement. so for example if you goto youtube and click on the embed link of this video you would get this

<iframe width="420" height="315" src="//www.youtube.com/embed/BstTBw6BLrE" frameborder="0" allowfullscreen></iframe>

now use the url that is present in the src tag. This works with other video hosting services, like VEVO as well.

Hope it helps..

Gagan
  • 5,416
  • 13
  • 58
  • 86
  • just to add one more thing: the resultant url must begin with http:// and then you can append the url that you get from the src tag – Gagan Jan 30 '14 at 03:16
2

For anyone else looking to Embed Videos in Laravel, have a look at KaneCohen/embed. It's works great with Youtube or Vimeo (haven't tried other sources), and you don't have to mess with any logic. Simply install (installation guide in documentation) and:

@foreach ($videos as $video)
    <h4>{{ $video->title }}</h4>
    <div class="media">
        <div class="media-body">
            {!! Embed::make($video->link)->parseUrl()->getIframe() !!}
        </div>
    </div>
@endforeach

Don't forget to set up the alias in you config/app.php

Artur Grigio
  • 5,185
  • 8
  • 45
  • 65
  • 1
    that helped, Thanks. Is there anyway available to get thumbnail of the video thru this? – Neo Nov 13 '16 at 20:41
1

I have the same issue, but the console catch this error:

Refused to display 'URL' in a frame because it set 'X-Frame-Options' to 'SAMEORIGIN'.

I look for it here and i found this post

Refused to display in a frame because it set 'X-Frame-Options' to 'SAMEORIGIN'

and that work for me.

You should try this

@layout('layouts.master')

@section('content')

@foreach ($videos as $video)
    <h4>{{ $video->title }}</h4>
    <br>
    <div class="media">
        <div class="media-body">
            <iframe width="560" height="315" src={{ $video->link + "&output=embed" }} frameborder="0" allowfullscreen>
            </iframe>
        </div>
    </div>
    <br>
@endforeach

@endsection
Community
  • 1
  • 1
Diego Rodriguez
  • 11
  • 2
0

Use a simple blade tag in the view

{!! $url !!} THIS WILL RENDER THE VIDEO

instead of

{{ $url }} THIS WILL WRITE AS A STRING (in a input for example)

Pedro Ramos
  • 65
  • 1
  • 2
0

The laravel-embed package can help by giving you the ability to embed a YouTube video (and others) using a blade component:

<x-embed url="https://www.youtube.com/watch?v=oHg5SJYRHA0" />

You simply pass the public URL of the video into the url attribute and the package will handle the rest.

Additionally there are validation rules for all the services supported by the package (it's not just YouTube) and it's responsive out of the box.

BenSampo
  • 559
  • 5
  • 8
-1

how does your 'layouts.master' looks like? any html source code in your browser? have a look: your 'index.blade.php' should be encoded in UTF-8 WITHOUT 'BOM' (in your editor)!!

'@layout('layouts.master')' has to be the very first (same issue to me yesterday in L4).

YoungStar7
  • 1
-1

you can simply use {{}} instead of this use {!! !!}

For example : 

{!! $video->link !!}
Abdullah Al Mahamud
  • 69
  • 4