uniapp上傳視頻詳解

一、設置視頻編碼

1、在Uniapp中設置視頻編碼可以通過指定video標籤內的codec和profile屬性來實現。codec表示要使用的視頻編碼器，可以設置為“h264”、“vp8”或“vp9”，profile則表示視頻編碼器的級別，可以設置為“main”、“high”或“baseline”等。例如：

<video codec="h264" profile="baseline"></video>

2、對於iOS平台，uni-app默認會調用iOS系統中的AVFoundation庫來播放視頻。如果要設置視頻編碼，可以在配置文件中的App.vue文件中設置config屬性。例如：

export default {
  config: {
    "app-plus": {
      video: {
        av: {
          decoder: {
            H264: {
              level: 32,
              frameRate: 15
            }
          }
        }
      }
    }
  }
}

二、uniapp上傳的視頻很模糊

1、這個問題可能是由傳輸速度不夠快導致的。可以打開網絡監控器，查看上傳速度，如果上傳速度比較慢，就會導致上傳的視頻很模糊，可以考慮從網絡角度優化上傳速度。

2、如果上傳的視頻源文件就很模糊，可以考慮提高視頻的分辨率和碼率。可以使用第三方工具進行轉碼或壓縮，例如FFmpeg或HandBrake等。

三、uniapp上傳視頻文件

1、可以使用uni-app內置的uni.chooseVideo方法選擇視頻文件，然後使用uni.uploadFile方法上傳文件。例如：

uni.chooseVideo({
  success: function (res) {
    uni.uploadFile({
      url: 'http://example.com/upload',
      filePath: res.tempFilePath,
      name: 'file',
      success: function (res) {
        console.log('upload success');
      }
    });
  }
});

2、可以使用uni-app內置的uni.chooseMedia方法選擇視頻文件，然後使用uni.uploadFile方法上傳文件。例如：

uni.chooseMedia({
  mediaType: ['video'],
  success: function (res) {
    uni.uploadFile({
      url: 'http://example.com/upload',
      filePath: res.tempFiles[0].tempFilePath,
      name: 'file',
      success: function (res) {
        console.log('upload success');
      }
    });
  }
});

四、uniapp上傳視頻如何知道文件大小

可以使用uni-app內置的uni.getFileInfo方法，獲取文件大小。例如：

uni.getFileInfo({
  filePath: 'path/to/file',
  success: function (res) {
    console.log(res.size + ' bytes');
  }
});

五、uniapp上傳視頻獲取上傳時長

在上傳視頻之前，可以使用uni-app內置的uni.chooseVideo方法選擇視頻文件並獲取視頻時長。例如：

uni.chooseVideo({
  success: function (res) {
    console.log(res.duration + ' seconds');
  }
});

六、uniapp上傳視頻並壓縮

可以使用第三方工具進行視頻壓縮，例如FFmpeg或HandBrake等。也可以使用uni-app內置的canvas元素對視頻進行壓縮處理。例如：

  var video = document.getElementById('video');
  var canvas = document.getElementById('canvas');
  var ctx = canvas.getContext('2d');

  video.addEventListener('canplaythrough', function () {
    var width = video.videoWidth;
    var height = video.videoHeight;
    canvas.width = width;
    canvas.height = height;
    ctx.drawImage(video, 0, 0, width, height);
    canvas.toBlob(function (blob) {
      uni.uploadFile({
        url: 'http://example.com/upload',
        filePath: blob,
        name: 'file',
        success: function (res) {
          console.log('upload success');
        }
      });
    }, 'image/jpeg', 0.5);
  });

七、uniapp上傳視頻到服務器

可以使用uni-app內置的uni.uploadFile方法上傳文件到服務器。例如：

uni.uploadFile({
  url: 'http://example.com/upload',
  filePath: 'path/to/file',
  name: 'file',
  success: function (res) {
    console.log('upload success');
  }
});

八、uniapp面試題

1、請簡述uniapp上傳視頻的流程。

答：首先使用uni.chooseVideo方法選擇視頻文件，然後使用uni.uploadFile方法將視頻文件上傳至服務器。

2、請問uniapp怎麼設置視頻編碼？

答：可以通過指定video標籤內的codec和profile屬性來設置視頻編碼，也可以在配置文件中的App.vue文件中設置config屬性。

九、uniapp和微信小程序區別

uniapp是基於Vue.js框架的多端應用開發框架，可以同時開發iOS、Android和Web三個平台的應用；而微信小程序則是運行在微信客戶端中的應用，只能夠開發小程序且運行在微信內。