上传课件
功能概述
在教学场景中,教师通常会借助于一些课件,以文字、图形和动画的方式将自己想要表达的内容直观、形象地展示给学生。灵动课堂支持在上课过程中展示课件,支持的资源格式包括 PPT、PPTX、DOC、DOCX、PDF、MP3、MP4、PNG,JPG,GIF。
课件可分为以下两类:
- 公共资源:公共资源一般指教育机构上传和管理公共的课件资源,以供老师上课使用,个人无法编辑修改。
- 个人资源:个人资源一般指老师在客户端自行上传和管理个人的课件资源。
课件必须经过转换才能在灵动课堂的白板上使用。灵动课堂不保存客户的课件资源,所有课件均保存在客户自己的第三方云存储中。
课前上传课件
如果你想在课前将课件上传至第三方云存储或者你自己的服务器,然后在灵动课堂内以公共资源显示该课件,可参考以下步骤:
-
在声网控制台配置灵动课堂中的互动白板功能,用于存储在课堂中上传的资源。详见配置白板功能文档。
-
在声网控制台开启互动白板文档转换服务并添加存储配置,用于存储转换后的资源。详见开启互动白板配套服务文档。
-
在你的 App 服务端调用 RESTful API 向声网互动白板服务发起文档转换请求。声网互动白板服务会将转换后的文件上传至你在声网控制台中配置的第三方云存储。
-
在你的 App 服务端轮询 RESTful API 向声网互动白板服务获取转换任务进度。其中,你需要关注返回结果中的
convertedFileList
字段,代表已完成转换的课件列表。每个convertedFileList
对象包含以下字段:width
:Number 类型,图片宽度,单位为像素。height
:Number 类型,图片高度,单位为像素。conversionFileUrl
:String 类型,转换图片的 URL。preview
: String 类型,预览图地址。当发起转换时请求包体中preview
设为true
且type
为dynamic
时,才会返回该字段。
-
在你的客户端调用 launch 时通过 courseWareList 参数传入课件列表,就可以在课堂内看到课件了。
TypeScriptcourseWareList:
[
{
resourceName: xxxxxxx,
resourceUuid: xxxxxxxxx,
ext: 'pptx',
url: 'https://xxxxxxxxxxxxxx',
size: 0,
updateTime: xxxxxxxx
taskUuid: 'xxxxxxxxx',
conversion: {
type: 'dynamic',
preview: true,
scale: 2,
outputFormat: 'png',
},
taskProgress: {
totalPageSize: 3,
convertedPageSize: 3,
convertedPercentage: 100,
convertedFileList: [
{
name: '1',
ppt: {
src: 'pptx://convertcdn.netless.link/dynamicConvert/3bxxxxxxx/1.slide',
width: 1280,
height: 720,
preview:'dddddddddddddddurl'
},
},
...
] as any,
currentStep: '',
},
},
],
课中上传课件
对于课中上传课件,你只需进行以下操作:
如下图所示,老师登录灵动课堂,进入教室,点击工具栏中的云盘,点击上传资源即可上传资源。
如下图所示,你可以删除已上传的资源。
注意事项
为确保声网可以访问你的云存储空间,你的云存储账号中必须进行以下配置:
- 阿里云 OSS
- Amazon S3
- 读写权限设为公共读:
- 跨域规则配置:
- 来源和允许 Headers 根据你的实际情况配置即可。
- 暴露 Headers 必须严格参照下图填写。
- Bucket policy
JSON
{
"Version": "2012-10-17",
"Id": "Policy1622700880591",
"Statement": [
{
"Sid": "Stmt1622700872941",
"Effect": "Allow",
"Principal": "*",
"Action": "s3:GetObject",
"Resource": "arn:aws-cn:s3:::agora-adc-artifacts/*"
}
]
}
- Cross-origin resource sharing
JSON
[
{
"AllowedHeaders": [
"*"
],
"AllowedMethods": [
"PUT",
"GET"
],
"AllowedOrigins": [
"*"
],
"ExposeHeaders": []
}
]