有一个问题:从Amazon S3上的客户端通过Axios上传视频文件。 Developer tools results
<Dropzone
multiple={false}
accept="video/mp4"
onDrop={(acceptedFiles) => {
return this.setState({ shortVideo: acceptedFiles[0] })
}}
>
{({ getRootProps, getInputProps }) => (
<section className={styles.dropzoneContainer}>
<div {...getRootProps()} className={styles.temporaryBtn}>
<input {...getInputProps()} />
<p>{intl.formatMessage({ id: 'home.attachVideo' })}</p>
</div>
{shortVideo && (
<aside>
<h4>{intl.formatMessage({ id: 'home.file' })}</h4>
<ul className={styles.fileList}>
<li>{shortVideo.name}</li>
</ul>
</aside>
)}
</section>
)}
</Dropzone>
const urlVideo = 'https://dato-images.s3.eu-west-1.amazonaws.com/9865/1568108466-samplevideo.mp4?x-amz-acl=public-read&X-Amz-Algorithm=AWS4-HMAC-SHA256&X-Amz-Credential=AKIAINXQX2ZNXNEBCVJA%2F20190910%2Feu-west-1%2Fs3%2Faws4_request&X-Amz-Date=20190910T094106Z&X-Amz-Expires=900&X-Amz-SignedHeaders=host&X-Amz-Signature=8d3007f1ef59adc67e02812957799cc11b7c9f89fd629d2f5a901afc25c9e5ca idVideo /9865/1568108466-samplevideo.mp4'
axios.put(
`${urlVideo}`,
{
file: shortVideo,
},
{
headers: {
'Content-Disposition': `attachment; filename=${fileNameVideo}`,
'Access-Control-Allow-Origin': '*',
'Access-Control-Allow-Methods': 'PUT',
'Content-Type': shortVideo.type,
},
params: {
'x-amz-acl': 'public-read-write',
},
},
)
.then(function(result) {
console.log('!!!!!', result)
})
.catch(function(err) {
console.log('!!!!!', err)
})
有一个URL(videoUrl),您需要在其中下载视频文件。使用Dropzone获取文件,然后保存到状态,然后通过Axios写入Amazon S3。
结果是文件无法播放。 Web检查器显示的文件小于您下载的文件(原始文件为〜1mb。),无法查看。