django2用iframe标签完成网页内嵌播放b站视频功能


Posted in Python onJune 20, 2018

前言:

给自己的网站中加入视频资源,有两种方法,一种是用iframe标签引用外站资源,另一种则使用video标签,获取站内资源进行视频播放。其中前者顾名思义,是将视频资源上传到视频网站中,然后通过引用的方式在站内播放视频,这种方法适用于视频资源内容公开免费,且不想花钱购买七牛云空间的开发者,毕竟是免费的嘛!而后者,则是需要有云空间存放视频资源才可以,不过后者的好处是,可以用于视频付费内容的开发。

今天恰好遇到了给自己要开发的项目,加一段视频新闻公告的需求!既然是新闻公告内容,当然是不需要加密的了。所以,也就没有必要花钱搞个云空间了。果断选择第一种,使用iframe标签的方式来实现网页内嵌播放视频方式来开发!

1.选择视频网站进行视频引用:

1.爱奇艺的视频加广告加得简直丧心病狂,像老太太的裹脚布又臭又长,垃圾,不用!

2.腾讯视频的视频也加广告,虽然广告没有那么长,但是很阴险的是,如果视频超过十几分钟,就会无法在引用视频的网站播放,被强制要求转去腾讯视频才可以看,简直狼子野心,垃圾中的垃圾,不用!

3.bilibili,也就是传说中的b站,不但视频没有广告(引导型广告还是有的,但是不影响观看,不是那种不看完广告不让看视频的霸王硬广),没有玩儿阴的强制跳转去他家网站,还高清无码有弹幕,选b站!

2.实际操作:

1.在template目录下的index.html中加入跟视频引用相关的代码:

<!--视频 S-->
<div class="videoCon">
  <div class="name" style="color: orangered">新闻公告</div>
  <div class="videoF">
<!--这里填入从b站随机挑选一个视频,然后获取的引用代码-->
    <iframe src="//player.bilibili.com/player.html?aid=24841101&cid=41877807&page=1" 
scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true"> 
</iframe>
<!---->
  </div>
</div>
<!--视频 E-->

2.获取b站的视频引用相关代码(随机挑选一个b站视频,进入视频播放页)

django2用iframe标签完成网页内嵌播放b站视频功能

3.django网页中的效果图

django2用iframe标签完成网页内嵌播放b站视频功能

3.跟django后端结合,动态的嵌入不同视频

1.在models.py中(一般嵌入代码长度不会超过300,在150——300之间)

class Bili(models.Model):
  '''新闻相关视频'''
  new=models.ForeignKey(News,verbose_name='新闻公告',on_delete=models.CASCADE)
  is_topline=models.BooleanField(default=False,verbose_name='是否是头条')
  bili=models.CharField(verbose_name='视频嵌入代码',max_length=300)
  add_time = models.DateTimeField(default=datetime.now, verbose_name='添加时间')

  class Meta:
    verbose_name = '新闻相关视频'
    verbose_name_plural = verbose_name

  def __str__(self):
    return self.new.title

打开Terminal终端,执行数据更新命令:

python manage.py makemigrations
python manage.py migrate

2.在adminx.py中注册

import xadmin
from .models import News,Bili
class NewsAdmin(object):
  list_display = ['title', 'img','click_num','add_time']
  search_fields = ['title', 'img','click_num',]
  list_filter = ['title', 'img','click_num','add_time']
  style_fields={'context':'ueditor'}

#注册代码
class BiliAdmin(object):
  list_display = ['new', 'is_topline']
  search_fields = ['new', 'is_topline']
  list_filter =['new', 'is_topline']

xadmin.site.register(News, NewsAdmin)
#注册代码
xadmin.site.register(Bili, BiliAdmin)

3.可以在xadmin后台进行多个视频嵌入代码的填入

随机在b站找的三个视频的嵌入代码:

<iframe src="//player.bilibili.com/player.html?aid=24687507&cid=41510047&page=1" scrolling="no" 
border="0" frameborder="no" framespacing="0" allowfullscreen="true"> </iframe>
<iframe src="//player.bilibili.com/player.html?aid=22025564&cid=36402353&page=1" scrolling="no" 
border="0" frameborder="no" framespacing="0" allowfullscreen="true"> </iframe>
<iframe src="//player.bilibili.com/player.html?aid=17766502&cid=29007139&page=1" scrolling="no" 
border="0" frameborder="no" framespacing="0" allowfullscreen="true"> </iframe>

django2用iframe标签完成网页内嵌播放b站视频功能

django2用iframe标签完成网页内嵌播放b站视频功能

4.在views.py中:

from .models import News,Bili

class NewView(View):
  """新闻公告详情"""
  def get(self,request,new_id):
    new=News.objects.filter(id=new_id).first()
    new.click_num+=1

    # 根据新闻公告的不同,显示与之关联的视频
    bili=Bili.objects.filter(new=new).last()

    new.save()
    return render(request,'news-base.html',{'new':new,'bili':bili})


class IndexView(View):
  """首页"""
  def get(self,request):
    all_news=News.objects.all().order_by('-add_time')

    p = Paginator(all_news, 20)
    page = request.GET.get('page', 1)
    try:
      news = p.page(int(page))
    except PageNotAnInteger:
      news = p.page(1)
      
    #首页播放被标记为头条的最后一部视频
    bili=Bili.objects.filter(is_topline=True).last()

    return render(request,'index.html',{'news':news,'bili':bili})

5.改写Template目录下的index.html(首页)和new-base.html(新闻模板页)

index.html

<!--视频 S-->
<div class="videoCon">
  <div class="name" style="color: orangered">新闻公告</div>
  <div class="videoF">
    {{ bili.bili|safe }}
  </div>
</div>
<!--视频 E-->

new-base.html

<!--视频 S-->
<div class="videoCon">
  <div class="name" style="color: orangered">{{ new.title }}</div>
  <div class="videoF">
    {{ bili.bili|safe }}
  </div>
</div>
<!--视频 E-->

6.效果图

新闻详情页

django2用iframe标签完成网页内嵌播放b站视频功能

首页

django2用iframe标签完成网页内嵌播放b站视频功能

4.总结

这个功能其实还是挺简单的,技术上没有什么可总结的,只不过我在随机在b站找几个视频,发现基本上所有的视频内容吧,都挺令人担忧的,b站作为体现年轻人喜好的一个网站,其中内容全都是以低俗,谄媚,秀下限,恶趣味,宅腐文化为主旋律的,作为一个90后,不禁叹息,00后真是垮掉的一代啊啊啊啊……现在的年轻人,女生(有些甚至是男扮女装)穿裙子的标准长度,居然是以一扭屁股就能露出安全裤为标准的长度!对于未成年的小男生来说,根本不存在戒撸的可能性了啊!什么叫心理下流看什么都下流?天天靠露安全裤博眼球,自己出于什么心理真的没个数么?当然,从宏观上看,因为三十年前那一拨国策,搞得现在女少男多,按照市场规律:在绝对刚需的情况下,物以稀为贵! 现在社会整体上,女性的权利空前的大,这是无法改变的。既然无法改变,不妨转变一个角度看问题,适龄女性比适龄男性少,当今女性的裙子又比过去女性的裙子短,显然卫生纸的市场需求量,势必越来越大,而卫生纸的上游行业(木材,芦苇等造纸原材料的行业),及同类行业(软装、纸箱、办公用纸等与卫生纸消耗同样原料的行业)价值必将一路上扬!如果有搞期货或者炒股票的兄弟觉得有道理,入手一些这种行业的证券,肯定稳赚啊!

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Python 相关文章推荐
Python实现批量下载图片的方法
Jul 08 Python
详解Python的Django框架中的中间件
Jul 24 Python
Python实现的归并排序算法示例
Nov 21 Python
Python读写及备份oracle数据库操作示例
May 17 Python
解决Python plt.savefig 保存图片时一片空白的问题
Jan 10 Python
python绘制地震散点图
Jun 18 Python
python opencv 批量改变图片的尺寸大小的方法
Jun 28 Python
python3中datetime库,time库以及pandas中的时间函数区别与详解
Apr 16 Python
使用PyWeChatSpy自动回复微信拍一拍功能的实现代码
Jul 02 Python
无惧面试,带你搞懂python 装饰器
Aug 17 Python
python3中数组逆序输出方法
Dec 01 Python
用基于python的appium爬取b站直播消费记录
Apr 17 Python
python基于http下载视频或音频
Jun 20 #Python
python实现下载pop3邮件保存到本地
Jun 19 #Python
python+POP3实现批量下载邮件附件
Jun 19 #Python
python实现批量解析邮件并下载附件
Jun 19 #Python
Python3使用SMTP发送带附件邮件
Jun 16 #Python
Python3使用turtle绘制超立方体图形示例
Jun 19 #Python
python3使用SMTP发送HTML格式邮件
Jun 19 #Python
You might like
PHP简单获取多个checkbox值的方法
2016/06/13 PHP
详解PHP编码转换函数应用技巧
2016/10/22 PHP
PHP实现的CURL非阻塞调用类
2018/07/26 PHP
javascript 动态添加表格行
2006/06/22 Javascript
兼容ie和firefox js关闭代码
2008/12/11 Javascript
Jquery ajaxsubmit上传图片实现代码
2010/11/04 Javascript
jQuery中after的两种用法实例
2013/07/03 Javascript
jquery dialog open后,服务器端控件失效的快速解决方法
2013/12/19 Javascript
javascript向后台传送相同属性的参数即数组参数
2014/02/17 Javascript
JavaScript仿静态分页实现方法
2015/08/04 Javascript
原生JS实现风箱式demo,并封装了一个运动框架(实例代码)
2016/07/22 Javascript
Js得到radiobuttonlist选中值的两种方法(推荐)
2016/08/25 Javascript
详解jQuery中的DOM操作
2016/12/23 Javascript
ajax的分页查询示例(不刷新页面)
2017/01/11 Javascript
Ajax和Comet技术总结
2017/02/19 Javascript
Vuex简单入门
2017/04/19 Javascript
jQuery UI 实例讲解 - 日期选择器(Datepicker)
2017/09/18 jQuery
Vue组件中slot的用法
2018/01/30 Javascript
webstorm中配置nodejs环境及npm的实例
2018/05/15 NodeJs
如何去除富文本中的html标签及vue、react、微信小程序中的过滤器
2018/11/21 Javascript
d3.js 地铁轨道交通项目实战
2019/11/27 Javascript
JS实现电商商品展示放大镜特效
2020/01/07 Javascript
vue子组件改变父组件传递的prop值通过sync实现数据双向绑定(DEMO)
2020/02/01 Javascript
解决element-ui里的下拉多选框 el-select 时,默认值不可删除问题
2020/08/14 Javascript
[48:51]完美世界DOTA2联赛PWL S2 Magma vs InkIce 第一场 11.28
2020/12/02 DOTA
python使用itchat实现手机控制电脑
2018/02/22 Python
Python同步遍历多个列表的示例
2019/02/19 Python
教你一步步利用python实现贪吃蛇游戏
2019/06/27 Python
Python 图像对比度增强的几种方法(小结)
2019/09/25 Python
Python下应用opencv 实现人脸检测功能
2019/10/24 Python
python 爬取免费简历模板网站的示例
2020/09/27 Python
pycharm 使用anaconda为默认环境的操作
2021/02/05 Python
Tarte Cosmetics官网:美国最受欢迎的化妆品公司之一
2017/08/24 全球购物
聊城大学毕业生自荐书
2014/02/01 职场文书
学雷锋广播稿大全
2015/08/19 职场文书
Python中的datetime包与time包包和模块详情
2022/02/28 Python