必威体育下载基督教Heilmann

“嵌入”标签的文章

Making vid.ly conversion and embedding easy

周四,12月1日,2011

I am lucky enough to have a vid.ly pro account to convert videos.幸运的是,最近这项免费服务开始限制用户在一个月内观看视频的次数(因为来自亚洲的大量流量滥用了这项服务)。In case you still haven't heard about vid.ly – it is a service that converts a video into a few dozen formats forHTML5嵌入并给你一个单一的URL将设备重定向到视频的正确格式。

现在,为了方便我的同事转换和嵌入视频HTML5,我构建了一个简单的界面,用于在我们的博客上转换和嵌入视频。为此,我使用API,但我不想把钥匙给同事使用。

转换视频的界面很简单:


             
              >
             
            
             >
            Vid.ly conversion and embed>>

             
              >
             
  
             echo $消息;? >
              
               >
              只需添加下面要转换的视频的URL,就会得到嵌入代码。会有一封邮件通知你转换成功。转换可能需要一个小时。>
              
              方法=
              “职位”
              >
             
    
              
               >
              
              
              =
              “电子邮件”
              >
             电子邮件:>
              
              类型=
              “文本” 
              id=
              “电子邮件” 
              的名字=
              “电子邮件”
              >
              >
             
    
             
              >
             
             
             =
             “url”
             >
            URL:>
             
             类型=
             “文本” 
             id=
             “url” 
             的名字=
             “url”
             >
             >
            
    
             
              >
             
             
             类型=
             “提交” 
             的名字=
             “发送” 
             价值=
             “让”
             >
             >
            
  >
>

Vid.ly conversion and embed

只需添加下面要转换的视频的URL,就会得到嵌入代码。会有一封邮件通知你转换成功。转换可能需要一个小时。

的一个很酷的功能API它允许你定义一个电子邮件,它不是连接到键的那个它是那个在转换开始时得到通知的那个,错误和成功的电子邮件。这让我的工作轻松多了。我所需要做的就是组装正确的XML然后寄给API。结果是XML,同样的,我需要检查返回的内容并在表单中给出反馈:


            
美元的关键 = “{在这里添加您的钥匙}”;
美元的消息 = '';
如果(收取($ _POST(“发送”])){如果($ _POST(“电子邮件”] = = ! '' & & $ _POST(“url”] = = ! '') {
    美元的查询 =  
              
              
               AddMedia
              
              
               481
              
              美元的关键””
              $ _POST(“电子邮件”]””
              
             $ _POST(“url”]””
              
              AWS
             ;
    $ url = “http://m.vid.ly/api/”;
    ch美元 = curl_init();
    curl_setopt(ch美元,CURLOPT_URL,$ url);
    curl_setopt(ch美元,CURLOPT_POST,1);
    curl_setopt(ch美元,CURLOPT_RETURNTRANSFER, 1); 
    curl_setopt(ch美元,CURLOPT_POSTFIELDS,“xml = 'urlencode(美元的查询));
    美元的结果 = curl_exec(ch美元);
    curl_close(ch美元);$ xml = 的作用(美元的结果);如果($ xml- >成功) {
      美元vid = $ xml- >成功- >MediaShortLink- >ShortLink;
      美元的视频 = 
               ””;
      美元的消息 = 

转换开始

视频转换正在进行中。” “你应该会收到一封邮件告诉你这一点,以及何时收到邮件。” 视频网址已经准备好了。复制和粘贴到'的代码 的博客:

; } 其他的 { 美元的消息 =

错误

皈依过程中出了问题。 请再试一次。

; } } 其他的 { 美元的消息 =

错误

请提供一个视频网址和电子邮件

; } } ? >

转换开始

”。”

视频转换正在进行中。”。“你应该收到一封邮件告诉你这一点,并告诉你具体时间。”视频网址已经准备好了。复制和粘贴到'的代码。的博客:

”。” ”;} else {$message = '

错误

”。”

这种转变出了问题。请再试一次。

”;}} else {$message = '

错误

”。”

请提供一个视频网址和电子邮件

”;} } ?

很简单,不是吗。现在我的同事可以添加他们的电子邮件,填写表格aURL要转换的视频在web上的什么地方,会得到一个复制和粘贴HTML的视频,例如:


              
               控制
               预加载=
               “没有” 
               风格=
               宽度:100%;高度:300 px;” 
              
海报=“http://cf.cdn.vid.ly/1l5i5m/poster.jpg”>

                
                src=
                “http://cf.cdn.vid.ly/1l5i5m/mp4.mp4” 
                类型=
                “视频/ mp4”
                >
               

                 
                 src=
                 “http://cf.cdn.vid.ly/1l5i5m/webm.webm” 
                 类型=
                 “视频/ webm”
                 >
                

                  
                  src=
                  “http://cf.cdn.vid.ly/1l5i5m/ogv.ogv” 
                  类型=
                  “视频/ ogg”
                  >
                 

                   
                   目标=
                   “平等” 
                   href=
                   “http://vid.ly/1l5i5m”
                   >
                  

                    
                    src=
                    “http://cf.cdn.vid.ly/1l5i5m/poster.jpg” 
                    宽度=
                    “500”
                    >
                    >
                   
>

结果:

HTML5video to the browsers who support it and a link to vid.ly for those who don't :) The代码在GitHub上是一个要点:

修改了SlideShare的嵌入,增加了预览,而且更短,更容易阅读

周四,4月17日,2008

编辑: 脚本中有一个bug(请参阅注释),但是Googlecode不允许我编辑自己的文件。一旦我解决了这个问题,我就会解决它。在评论中报告的错误现在已经修复,不幸的是,我还不得不重写转换器,因为谷歌代码不允许我替换旧版本的下载(或者有什么诀窍吗?)调用新文件previewer2.js

正如本博客的读者所知,我是……的超级粉丝SlideShare作为我演讲幻灯片的分发平台。然而,这件事有些事使我烦恼。

其中之一是SlideShare提供的相当冗长的嵌入代码:



这很长,主要的问题是当你在一个文档中使用几个幻灯片嵌入时,当需要实例化这些Flash嵌入并试图预缓存S3中的前三张幻灯片时,您将放慢页面的呈现速度。

我已经分析了一些代码,添加了一些其他的信息,我发现在RSS并设计了一个小JavaScript,以不同的方式嵌入幻灯片。你只需要以下代码:



这给了slideshare同样的效果搜索引擎优化链接爱情却少得多。不是完整的幻灯片,您将得到一个预览图像,您可以单击它,它将被flash电影替换。以下是一些例子:

现在,为了把一个转换成另一个你可以用手来做,或使用slideshare嵌入转换器或安装Greasemonkey脚本

到目前为止,这是一个hack,但是我和乔纳森Boutelle昨天晚上在旧金山JavaScript会议上,他很高兴能继续这个想法。我的愿望列表:

  • 更大的预览图像
  • 休息API调用它以可读的方式提供此信息