适用于:Windows PC,Ubuntu PC,Mac OS Chrome
不适用于:iPhone Chrome浏览器、iPhone Safari浏览器、苹果电脑Safari浏览器
视频无法播放,没有错误。图像在所有平台上都能正常工作。
我正在用nodejs和multer将原始视频上传到S3,试图使用ffmpeg将视频编码到,但没有帮助。
public upload(file) {
const fileStream = fs.createReadStream(file.path)
let fileKey = `${file.filename}`
const uploadParams = {
Bucket: bucketName,
Body: fileStream,
Key: fileKey,
}
return s3.upload(uploadParams).promise()
}
节点:
public async download(fileKey) {
const downloadParams = {
Key: fileKey,
Bucket: bucketName,
}
try {
const object = await s3.getObject(downloadParams).promise() // This throws error if image not found and catch get it
return {readStream: s3.getObject(downloadParams).createReadStream(), object}
} catch (err) {
throw new NotFoundError()
}
}
router.get('/file', async (req, res) => {
const { key } = req.query
const { readStream, object } = await Container.get(S3Service).download(key)
if (readStream.httpCode) {
res.json({ error: 'error' })
return
}
if(key.split('.')[1] === 'mp4') {
const range = req.headers.range
const bytes = range.replace(/bytes=/, '').split('-')
const start = parseInt(bytes[0], 10)
const total = object.ContentLength
const end = bytes[1] ? parseInt(bytes[1], 10) : total - 1
const chunksize = end - start + 1
res.status(206)
res.set('Content-Type', object.ContentType)
res.set('Content-Length', chunksize)
res.set('Content-Disposition', 'inline')
res.set('Accept-Ranges', 'bytes')
res.set('Accept-Encoding', 'Identity')
res.set('Content-Range', 'bytes ' + start + '-' + end + '/' + total)
res.set('X-Playback-Session-Id', req.header('X-Playback-Session-Id'))
res.set('Connection', 'keep-alive')
res.set('Last-Modified', object.LastModified)
res.set('ETag', object.ETag)
} else {
res.type('png')
}
readStream.pipe(res)
})
Angular :
<video playsinline muted autoplay controls="true" preload="metadata">
<source [src]="message.files[0].fileUrl" type="video/mp4" />
<source [src]="message.files[0].fileUrl" type="video/avi" />
<source [src]="message.files[0].fileUrl" type="video/ogg" />
<source [src]="message.files[0].fileUrl" type="video/webm" />
</video>
2条答案
按热度按时间ar5n3qh51#
开发人员,
似乎浏览器的能力问题。尝试运行在chrome开发工具的网站作为iPhone和尝试做同样的ie
有时候不是所有的浏览器都支持所有的功能,主要是移动的浏览器,我们没有开发选项,看看开发工具出了什么问题
此致,
穆罕默德
szqfcxe22#
据我所知,要在苹果设备上处理视频,您的服务器必须支持范围请求才能播放视频。
范围请求:https://developer.mozilla.org/en-US/docs/Web/HTTP/Range_requests
你可以google更多关于safari的细节和栈溢出的范围请求