Unlocking the Power of ChatGPT and AI in Testing - A Real-World Look, present...
The Depth Study of YOKU-API Project (2007-2009)
1. YOKU-API Project – One of the best practices focused on Software as a Service (SaaS) & RESTful APIs Solution
Sitong (Stone) Shen Page 1 of 19 2006-2016
“Technology is an Art work, IT talents are the Artists.”
Wait and Hope – the companies I experienced from their startups to IPOs
From a tech-view to summarize the profitable biz-model of NYSE:YOKU
The Depth Study of YOKU-API Project (2007-2009)
A Very Initial Technical Prototype to Reflect Design Pattern of
Profitable Biz-model in today’s NYSE:YOKU
Version: 2.01
Author: Sitong (Stone) Shen
2006-2016
2. YOKU-API Project – One of the best practices focused on Software as a Service (SaaS) & RESTful APIs Solution
Sitong (Stone) Shen Page 2 of 19 2006-2016
BD 合作项目(站外上传)设计文档
项目名称:站外上传(一期 BD 合作项目)
项目负责人:沈思通
文档收件人:
□ Web 开发小组
文档修改记录:
日期 作者 对以前版本的主要改动 页数
2007-5-31 沈思通 (初稿) 8
2007-06-11 沈思通 (详细设计稿) 15
2007-06-13 沈思通 (经业务和技术讨论确认后,改进的详细设计稿) 16
2007-06-13 沈思通 (补充视频统计相关说明,再改进的详细设计稿) 17
2007-06-13 沈思通 (细化视频统计中子任务 2,再改进的详细设计稿) 18
3. YOKU-API Project – One of the best practices focused on Software as a Service (SaaS) & RESTful APIs Solution
Sitong (Stone) Shen Page 3 of 19 2006-2016
目录
BD 合作项目(站外上传)设计文档 ............................................................................................1
目录...........................................................................................................................................3
系统概述...................................................................................................................................4
一、 系统整体介绍...................................................................................................4
二、 系统框图...........................................................................................................4
三、 各模块功能介绍...............................................................................................5
模块内部设计...........................................................................................................................6
四、 设计说明及思路...............................................................................................6
五、 定制后台设计说明.........................................................................................12
六、 视频统计相关说明.........................................................................................17
4. YOKU-API Project – One of the best practices focused on Software as a Service (SaaS) & RESTful APIs Solution
Sitong (Stone) Shen Page 4 of 19 2006-2016
系统概述
一、 系统整体介绍
通过让 Youku 合作方在其合作页面中嵌入 Youku 合作页面代码的方式,扩展 Youku 视
频上传功能到站外合作方本地。用户可以方便的通过基于合作方本地的 Web 操作界面,随
时开始上传视频到 Youku,成功后视频播放的定制化代码直接回填到合作方本地的超文本编
辑页面。在视频上传的过程中,用户可以方便的给视频添加信息并将视频加入指定的分类。
系统主要分为四块:站外上传部分,供站外浏览的 Youku 视频列表,SSO 自注册账号
下的我的视频,合作方使用的定制信息操作后台(定制信息包括:合作 Logo,对应合作 Link
指向,合作嵌入的 AD 区,合作视频水印)。
二、 系统框图
(核心功能:站外视频上传)
上传服务器是站外定
制 后 的 Upload
Web module,完成
上传、公私有信息回传
客户端 IE(访问合作
方页面)
站 外 上 传 逻 辑 ,
Youku 本 地 实 现 嵌
弹出启动,传递有关视频上传的请求,
传递视频相关的信息 Post 参数。
返回给浏览器上传文件的结果。成功与
否的 JS 事件触发代码
视频数据库
将 本 地 文 件
上 传 到 服 务
器
返 回 上 传 的
状态信息
调用 Web modules 方
法将视频信息插入
数据库
同时也可返回客户
端请求的公私有信
息的列表回传
将 数 据 库 信
息 返 回 给 客
户端
如果成功,返
回回填的 JS
嵌入代码
数据写入
数据读取
将上传完成后生成的缩略图 id,上传文
件 id 通过 Web module 更新数据库。
5. YOKU-API Project – One of the best practices focused on Software as a Service (SaaS) & RESTful APIs Solution
Sitong (Stone) Shen Page 5 of 19 2006-2016
三、 各模块功能介绍
Upload.youku.com
复用视频上传基本功能,定制工作为:
站外视频上传时,转码功能调用中,对合作水印是否显示/隐藏、所选水印图、水
印显示时常(单位:秒 s)、水印横纵座标位置(单位:像素 px)进行定制。
LadWebModules – 上传界面定制
分解的上传视频信息填写流程,适用于站外上传的调用方式。
视频上传页面流程分解和界面定制化。
LadWebModules – 站外调用的视频推荐列表定制
现有功能 API 可供复用,定制的 tpl 界面
Smarty 模板中定制站外列表的信息返回样式。
导向合作方站外播放器的链接地址定制(即:提供给合作方的站外列表,将直接通
过链接到提供给它的定制站外播放器来播放)。
LadWebModules – 站外调用的视频搜索列表定制
现有功能 API 可供复用,定制的 tpl 界面
Smarty 模板中定制站外列表的信息返回样式。
导向合作方站外播放器的链接地址定制(即:提供给合作方的站外列表,将直接通
过链接到提供给它的定制站外播放器来播放)。
LadWebModules – 站外调用的自动注册机制
SSO 部分将使用现有 QPartner 中的合作自注册逻辑。实施定制化。
LadWebModules – 合作方使用的定制信息操作后台
所操控的定制信息包括:
合作 Logo;对应合作 Link 指向;合作嵌入的 AD 区;合作视频水印。
基本的 MIS 管理操控功能:
Youku 对合作方帐号的管理,合作方用户登录,实现合作方用户的定制操作。
6. YOKU-API Project – One of the best practices focused on Software as a Service (SaaS) & RESTful APIs Solution
Sitong (Stone) Shen Page 6 of 19 2006-2016
模块内部设计
四、 项目切分及子任务设计思路
子任务 1 - 水印切换和定制
性质:
对现有上传流程的定制开发,定制逻辑位于现有 Youku Upload Server Side。
描述:
在 upload server 上,对通过站外上传来的、来自合作方注册用户的视频,通过
在执行转码任务时的操作定制,可以完成对“水印切换”的定制需求。
功能描述:(接口定制)
明歌这边的转码接口,可以达到的视频水印定制处理的最小粒度为:细化到可以
针对站外上传上来的每一个视频。
1。这个视频的水印到底是加还是不加,通过添加控制参数(名称:logo=0,不
加水印;logo=1,加水印)来达成;
2。如果要加水印(当参数 logo=1 时),到底加哪一个的水印图片,则通过添加
控制参数(名称:logotype=水印图片名称)来达成;
3。对于合作方的水印图片,这是通过用户自助管理来定制的,会放在一个指定
的合作方用户的目录结构下存放,明歌的程序可以捕获到即可;
4。对于水印图片的显示时常,这是通过用户自助管理来定制的,通过添加控制
参数(名称:time=8,单位:秒 s,为整数值)来达成;
5。对于水印图片的显示位置,这是通过用户自助管理来定制的,通过添加控制
参数(名称:x=5,y=10 单位:像素 px,均为整数值)来达成。
7. YOKU-API Project – One of the best practices focused on Software as a Service (SaaS) & RESTful APIs Solution
Sitong (Stone) Shen Page 7 of 19 2006-2016
6。按照 2007-06-11 和明歌的讨论结果,和视频转码操作相关的五个定制参数
(logo、logotype、time、x、y)将以被序列化的数组对象方式传递给
/encoder_queue_manager/newtask.php,以代替直接的 post 参数传递方式。
执行度:
可行,且基本可以并行开展工作。只需要配合明歌约定好定制 Logo 图片的获取,
工作协同就基本可以达成;剩下的是配合时间控制和在 UploadServer 上传流程
中加入 GET 参数的可控工作。
工作预估:
经明歌确认,转码接口改造工作的实际开发时间为 2-3 天,附加关键功能的测试
2-3 天,改造一共需要工作一周。
明歌建议在项目一期开发结束前一个星期前(参考现有工作计划 v1.4,初步设
定在 2007-06-15)提醒他来安排执行这一定制工作,这样就可以确保在 6.21
项目一期结束(最迟 6.29)时,配合完成“水印切换”功能点。
参考样例:(供参考,并非最终实现)
现有 upload.youku.com 上的水印转码任务操作,通过 GET 接口调用(来自明
歌:请注意最后的 logo 和 logotype 参数)
/encoder_queue_manager/newtask.php?fileid=…&info=…&hostname=
upload.youku.com&filesize=…&md5=…&service=0100&logo=1&logot
ype=abc.png&time=8&x=5&y=10
备注:加粗部分参数,在 Upload Server 的 dopup2.php 中,将以 Array 序列
化对象传输给明歌的 encoder_queue_manager/newtask.php 执行,体现为:
Array[logo]=1 Array[logotype]=abc.png Array[time]=8 Array[x]=5
8. YOKU-API Project – One of the best practices focused on Software as a Service (SaaS) & RESTful APIs Solution
Sitong (Stone) Shen Page 8 of 19 2006-2016
Array[y]=10
子任务 2 - Flash Player 站外播放器区域的定制逻辑(外包 Skin 法)
性质:
适于 Youku 现状的播放器定制模式,采用 Youku FlashSkins 技术。简化 Flash 编程工作,完
全不影响现有 Youku 新旧播放器。特点为:
1. 在 Youku FlashPlayer 之上外包一层 FlashSkin,直接将现有播放器嵌入到 FlashSkin 中进
行完成对视频播放的调用;
2. 定制粒度细化到针对每一个合作方的 partnerid,提供特定的 FlashSkin 界面,灵活多样且
相对于 Flash 编程而言易于实现;
3. 为 Youku 站外播放器定制的相关技术工作提供了新思路,在这一思想下,Youku 可以将
播放器本身功能和 BD 的定制需求完全分离。
设计思路描述:
Youku FlashSkin’s Demo:
http://uploader.youku.com/slide_demo.html
仅供演示参考 (localhost - 10.98.10.3 uploader.youku.com)
Youku-FlashSkin embed-codes Sample:
Youku FlashSkin - loadtest.swf Youku FlashPlayer - qplayer.swf
在 FlashSkin 区域(红色)可直接填充 BD 合作项目中,业务所需的定制内容:
合作 Logo,附在 Logo 之上的对应合作 Link 指向,合作所嵌入的 AD 区。
Tips1:合作视频水印不在这里定制,而是在 Upload Server 端的视频转码阶段所完成的。
Tips2:原有 Youku 播放器的可定制开关选项同样可用,和合作方的 Skin 区域互不影响。
下图展示了一个如何通过以现有 Youku 视频嵌入代码作为输入参数,从而在 Youku
FlashSkin 中调用 Youku FlashPlayer 来播放微视频的例子:
9. YOKU-API Project – One of the best practices focused on Software as a Service (SaaS) & RESTful APIs Solution
Sitong (Stone) Shen Page 9 of 19 2006-2016
用户行为描述:(定制化操作)
针对合作方注册用户:如果要嵌入已有视频,则:
通过 Youku 提供的视频搜索功能,通过点击所返回的视频搜索列表链接,直接获得对应视
频的 Flash 播放代码(利用现有 Youku 实现),结合 Skin 的外包功能,完成站外视频的嵌入;
针对合作方注册用户:如果要嵌入已有视频,则:
通过站外上传,在上传操作成功后,获得对应视频的 Flash 播放代码(利用现有 Youku 实现),
结合 Skin 的外包功能,完成站外视频的嵌入;
针对合作方的站点管理员:在 Youku 定制后台,可以完成如下工作:
1.上传自己的定制水印图片到指定位置(站外上传时供转码操作逻辑抓取)
2.上传自己的合作 LOGO 和定制链接指向地址(站外 Flash Skin 的合作定制界面内容)
3.指定站外合作播放器所使用的合作定制信息(站外 Flash Skin 的文字链、广告链等)
4.可选择 Youku 提供给合作方多样的界面定制风格(Skin 模板可选择,例如下图)
接口通讯描述:(定制化设计)
定制信息回调接口定义:Youku FlashSkins 接口参数(改进版本V0.3 - 2007-06-11)
10. YOKU-API Project – One of the best practices focused on Software as a Service (SaaS) & RESTful APIs Solution
Sitong (Stone) Shen Page 10 of 19 2006-2016
回调地址:(FlashSkin使用)
http://v05.stone.youku.com/v/flashskinparams4partner?partnerid=1
参数1://定制回调页面在获取合作方定制参数时的状态码(0:获取成功;1:获取失败)
$status=0;
参数2://Skin的LOGO图片引用地址,完整URL格式,图片大小固定为:width:165; height=35
$logo= "http://v.pcpop.com/pub/together/v.pcpop.com/img/nav-log.gif";
参数3://Skin的LOGO图片位链接,完整URL格式
$logolink= "http://v.pcpop.com/together";
参数4://Skin的广告位文字(横向滚动方式展现),文字长度不限,中英文均可,广告位数量
无限制,多个广告位文字之间以“|_|”作为分割符
$adtext= "广告位1|_|广告位2|_|广告位3|_|广告位4|_|广告位5";
参数5://Skin的广告位链接,完整URL格式,广告位无限制,多个广告位对应链接以“|_|”作
为分割符
$adlink=
"http://www.youku.com/v/|_|http://www.youku.com|_|http://stoneshen.com|_|http://www
.jiwai.de|_|http://beihangsoft.cn";
参数6://Skin的标题定制文字(格式固定,字号为12pt,字数限制30个英文字符/15个中文汉字)
$titletext= "www.pcpop.com";
参数7://Skin的标题定制链接,完整URL格式
$titlelink= "http://www.pcpop.com";
参数8://Skin中所内嵌FlashPlayer的ToolBar的配色方案号码(1:灰(默认),2:兰,3:绿)
$toolbar=1;
参数9://Skin中所内嵌Flash Player的“Youku图标显示位”开关(0:显示,1:隐藏)
$titlebar=1;
参数10://需要被合作方站内注册用户自行嵌入的视频encode($vid)
$VideoIDS="XMzQ4MTkzNg==";
参数11://Skin中所内嵌FlashPlayer在播放视频时,主窗口对应的点击链接地址前缀(URL格
式:主窗口对应的点击链接地址前缀,none:主窗口没有对应的点击链接地址)
$clickwindowarealink="http://hz.youku.com/eplayer4partner.php";
参数12://Skin中所内嵌FlashPlayer在播放视频时,相关视频列表对应的点击链接地址
$clickrelatedarealink="http://hz.youku.com/eplayer4partner.php";
参数13://Skin中所内嵌FlashPlayer在播放视频时,相关视频列表对应的点击链接的弹出方式
(_blank:弹出式;_self:直接在当前页载入相关视频)
$clickrelatedareatarget="_self";
参数14://Skin中所内嵌FlashPlayer在播放视频时,相关视频列表对应的更多按钮的点击链接
地址前缀(URL格式:主窗口对应的点击链接地址前缀,none:直接为Youku默认更多链接地址)
11. YOKU-API Project – One of the best practices focused on Software as a Service (SaaS) & RESTful APIs Solution
Sitong (Stone) Shen Page 11 of 19 2006-2016
$clickrelatedareamorelink="http://hz.youku.com/eplayer4partner.php";
参数15://Skin中所内嵌FlashPlayer在播放视频时,相关视频列表对应的分享按钮的点击链接
地址前缀(URL格式:主窗口对应的点击链接地址前缀,none:直接为Youku默认分享链接地址)
$clickrelatedareasharelink="http://hz.youku.com/eplayer4partner.php";
Youku FlashSkins界面实现预览:(设计已完成,开发进行中)
子任务 3 – 站外上传的前台操控逻辑(将以最上层 DIV 方式在合作方页面展现出来)
站外操作功能:(合作方注册用户使用,Tab方式呈现)
视频上传功能(必选);
在线录制功能(可选);
我的优盘视频列表功能(必选);
站外视频推荐列表功能;
站外搜索视频列表功能。
站外操作界面的可定制信息:(界面固定位置上:挂接合作方LOGO 或者 挂接合作方文字链)
此外,通过如下后台定制参数,可以定制前台界面的Flash上传背景图和站外页面CSS样式:
参数1://站外上传界面StyleSheet的显示风格(1:灰(默认),2:兰,3:绿)
interfacestyle=1;
参数2://站外界面FlashUpload的背景配色图(默认值:可为空 或者 /v/img/upload-bg.jpg)
interfacebackgroundurl="/v/img/upload-bg.jpg";
12. YOKU-API Project – One of the best practices focused on Software as a Service (SaaS) & RESTful APIs Solution
Sitong (Stone) Shen Page 12 of 19 2006-2016
站外操作界面实现预览:(设计已完成,和 FlashSkin 的对接部分及代码回填处于开发中)
13. YOKU-API Project – One of the best practices focused on Software as a Service (SaaS) & RESTful APIs Solution
Sitong (Stone) Shen Page 13 of 19 2006-2016
备注:
- 预览图中,前台界面的合作定制(如页面 LOGO 添加)尚未体现出来,勿担心,已考虑;
- 预览图中,功能 Tab 的并非最终实现,最终确定的功能 Tab 选项为:
本地上传、在线录制(可选)、推荐视频、我的优盘、视频搜索
五.定制后台设计说明
后台功能一共划分为 2 个定制子任务,1 个 MIS 管理功能开发任务。
定制子任务1:后台配套需求 - FlashPlayer播放视频时的播放模式定制
阅读者:沈思通、郑鹏、何涛
当前的player.php调用实现:[仅能使用标准FlashPlayer播放视频]
http://player.youku.com/player.php/sid/XNDQ5NTA5Ng==/v.swf
14. YOKU-API Project – One of the best practices focused on Software as a Service (SaaS) & RESTful APIs Solution
Sitong (Stone) Shen Page 14 of 19 2006-2016
更新后的player.php调用实现:[既可以通过FlashSkin,又可通过FlashPlayer播放视频]
http://player.youku.com/player.php/sid/XNDQ5NTA5Ng==/partnerid/1/winType/exterior/v
.swf
新增定制需求:
1。通过play.php,通过参数partnerid和winType配置,来决定调用FlashSkins还是FlashPlayer
播放视频;
2。当partnerid != null && (winType == "exterior" || winType == null)时,play.php启用
FlashSkin播放;
3。上述两个参数在传递到郑鹏的FlashSkin后,FlashSkin将首先回调定制FlashSkin的吐参PHP
页面:
http://www.youku.com/v/flashskinparams4partner?partnerid=1(定制粒度为:每个合作商)
4。上述吐参PHP页面将返回给郑鹏的FlashSkin所有的定制参数,可以完成站外播发器的合作定
制需求。
新增参数说明:(针对player.php在调用时)
参数1:partnerid
是BD合作方的ID标识,暂定数字明码传输给何涛的player.php,有该参数说明何涛的player.php
会直接调用郑鹏的FlashSkin;
参数2:winType(index:首页;interior:站内;exterior:站外;interiorFull:站外全屏)
是FlashPlayer的播放模式参数,这次当partnerid != null时,何涛的player.php需要读取
winType参数值传递给FlashSkin,郑鹏会据此在FlashSkin中实施BD合作的界面定制化;
期望完成时间:
2007-06-11(何涛需要等待郑鹏的FlashSkin完成后再满足配套需求1,这样好看效果,何涛评估
这部分工作会很快)
定制子任务2:后台配套需求 - Flash Player播放视频时的播放状态容错机制
阅读者:沈思通、郑鹏、何涛
问题描述:
站外上传后,用户会直接嵌入播放代码,而可能被嵌视频因各种认为原因尚未能正常播放,Youku
播放器要兼容此情况。
功能定位:
在何涛的PHP实现的视频播放页中,对Flash Player的调度,拟加入如下视频状态参数:
fileid=xxx 指定视频将被正常播放
fileid=-1 指定视频正在转码中
fileid=-2 指定视频正在审核中
fileid=-3 指定视频已被屏蔽
fileid=-4 指定视频已上传成功,但是转码失败
fileid=-5 指定视频在上传时设置为隐私为部分公开时,对无权浏览该视频的用户进行提示
fileid=null 指定视频已被删除/不存在
15. YOKU-API Project – One of the best practices focused on Software as a Service (SaaS) & RESTful APIs Solution
Sitong (Stone) Shen Page 15 of 19 2006-2016
郑鹏的Flash Player在接收到上述参数后,根据上述fileid的值定义给出不同的播放状态效果。
期望完成时间:
2007-06-11(截至2007-06-08进展,最快在2007-06-11结束时才能出FlashSkin的一个demo)
MIS 管理功能开发任务(提供给每个合作方管理员使用的定制后台)
阅读者:沈思通
问题描述:
每个合作方,在 Youku 都拥有一个管理帐号来登录此 MIS 系统,用于执行基于 partnerid 的
合作内容定制化。
定制功能项:
- 两个来自前台界面的定制项:
…
参数1://站外上传界面StyleSheet的显示风格(1:灰(默认),2:兰,3:绿)
interfacestyle=1;
参数2://站外界面FlashUpload的背景配色图(默认值:可为空 或者 /v/img/upload-bg.jpg)
interfacebackgroundurl="/v/img/upload-bg.jpg";
…
- 十三个来自Youku FlashSkin的定制项:(不包含status和VideoIDSs)
…
参数2://Skin的LOGO图片引用地址,完整URL格式,图片大小固定为:width:165; height=35
$logo= "http://v.pcpop.com/pub/together/v.pcpop.com/img/nav-log.gif";
参数3://Skin的LOGO图片位链接,完整URL格式
$logolink= "http://v.pcpop.com/together";
参数4://Skin的广告位文字(横向滚动方式展现),文字长度不限,中英文均可
$adtext= "广告位文字(横向滚动方式展现),文字长度不限,中英文均可";
参数5://Skin的广告位链接,完整URL格式
$adlink= "http://www.youku.com/v/";
参数6://Skin的标题定制文字(格式固定,字号为12pt,字数限制30个英文字符/15个中文汉字)
$titletext= "www.pcpop.com";
参数7://Skin的标题定制链接,完整URL格式
$titlelink= "http://www.pcpop.com";
参数8://Skin中所内嵌FlashPlayer的ToolBar的配色方案号码(1:灰(默认),2:兰,3:绿)
$toolbar=1;
参数9://Skin中所内嵌Flash Player的“Youku图标显示位”开关(0:显示,1:隐藏)
$titlebar=1;
…