vue +django 新手问一个videojs的问题,为啥我视频播放不能快进

229 阅读1分钟

以下是我的代码,是哪里出错了,还是后端需要做什么 前端

<template>
  <div>
    <video
      class="video_style vjs-custom-skin"
      :src="src_url"
      controls
      autoplay
      muted
      preload="auto"
    />
  </div>
</template>

<script>

// import axios from 'axios'
import { getToken } from '@/utils/auth'
import { getVideosList } from '@/api/user'

export default {
  // components: {
  //   videoPlayer
  // },
  data() {
    return {
      headers: {
        Authorization: 'Bearer ' + getToken()
      },
      src_url: ''
    }
  },
  created() {
    this.getvideosrc()
  },
  methods: {
    getvideosrc() {
      getVideosList().then(response => {
        for (let i = 0; i < response.data.results.length; i++) {
          if (Number(response.data.results[i].id) === Number(this.$route.params.id)) {
            this.src_url = response.data.results[i].file
            break
          }
        }
      })
      // axios.defaults.headers['Range'] = 'bytes=' + 0 - 102399 / 3670627
      // axios.defaults.headers['Authorization'] = 'Bearer ' + getToken()
      // axios.get('http://127.0.0.1/api/videos/' + this.$route.params.id + '/playv/').then(response => {
      //   console.log(response.data)
      // })
    }
  }
}
</script>
<style>
.video_style{
  width: 90%;
  height: 600px;
}
</style>

django在request.META里根本就没有RANGE这个头,去谷歌浏览器里看却又有,根本搞不懂,求个大婶帮帮我

@action(methods=['get', 'post'], detail=True)
def playv(self, request, pk=None, *args, **kwargs):
    instance = self.get_object()
    """将视频文件以流媒体的方式响应"""
    # print(request.META)
    range_header = request.META.get('HTTP_RANGE', '').strip()
    if not range_header:
        return HttpResponse("range_header is error")
    range_re = re.compile(r'bytes\s*=\s*(\d+)\s*-\s*(\d*)', re.I)
    range_match = range_re.match(range_header)
    path = str(instance.file)
    # print(path)
    if not path:
        return HttpResponse("path is error")
    # 这里根据实际情况改变,我的views.py在core文件夹下但是folder_path却只到core的上一层,media也在core文件夹下
    folder_path = os.getcwd().replace('\', '/')
    path = os.path.join(folder_path, 'media/') + path  # path就是template ?后面的参数的值
    # print(path)
    size = os.path.getsize(path)
    content_type, encoding = mimetypes.guess_type(path)
    content_type = content_type or 'application/octet-stream'
    if range_match:
        first_byte, last_byte = range_match.groups()
        first_byte = int(first_byte) if first_byte else 0
        last_byte = first_byte + 1024 * 1024 * 10
        if last_byte >= size:
            last_byte = size - 1
        length = last_byte - first_byte + 1
        resp = StreamingHttpResponse(self.file_iterator(path, offset=first_byte, length=length), status=206,
                                     content_type=content_type)
        resp['Content-Length'] = str(length)
        resp['Content-Range'] = 'bytes %s-%s/%s' % (first_byte, last_byte, size)
    else:
        resp = StreamingHttpResponse(FileWrapper(open(path, 'rb')), content_type=content_type)
        resp['Content-Length'] = str(size)
    resp['Accept-Ranges'] = 'bytes'
    return resp

def file_iterator(self, chunk_size=8192, offset=0, length=None):
    with open(self.get_object().file.path, "rb") as f:
        f.seek(offset, os.SEEK_SET)
        remaining = length
        while True:
            bytes_length = chunk_size if remaining is None else min(remaining, chunk_size)
            data = f.read(bytes_length)
            if not data:
                break
            if remaining:
                remaining -= len(data)
            yield data

为了让前端访问后端资源,

url(r'^media/video/(?P<path>.*>)$', serve, {"document_root": MEDIA_ROOT})

我把这个路由给占了,现在这个函数playv不知道怎么给前端,求求大婶救救我