服务商接入流程

更新时间：2018/08/30 访问次数：230140

一、整体结构

1.Ali ROM Patch层，支持设备的远程固件升级、APP部署、设备监控、设备远程控制等。
2.Ali APP层，已实现硬件能力以及天猫后台业务、数据回流，通过Ali JS API开放能力给前端H5。
3.ISV H5层，负责前端展示、交互，由服务商实现。

二、前置工作

1.入驻开放平台

要使用开放平台任何设施首先要成为开放平台开发者。如果之前已经与top对接过，跳过这一步。

打开开放平台首页，使用淘宝账号登

点击右上角的入驻开放平台，提交开发者信息，完成开发者入驻

2.创建应用，并申请应用标签
目前采用邀请制，由运营小二发放创建应用的入口，由该入口创建应用时会自动绑定应用标签。

3.选择插件类型
控制台->选择应用->开发流程，选择“智慧派样”，点击确定。

4.创建一个版本，记下“版本标签”

控制台 -> 选择应用 -> 版本管理->创建新版本

5.查看appkey
appkey可在控制台概览页面获取：

三、开发准备

以下操作在开发者个人电脑上完成。

1.下载开发者工具（仅首次需要）
第一步：安装 node（版本>=8.0，如已安装，则跳过此步骤）

下载软件后双击安装即可

第二步：安装 rop-cli

在Windows CMD命令窗口（或者Mac的终端工具）中输入：

npm install rop-cli -g

2.初始化工程在你的工程文件夹下，输入以下命令（your-app-name 改为你的app名称）：

mkdir your-app-name

cd your-app-name

rop init

按照脚手架的提示输入相应的信息:

appkey可在控制台-概览页面获取
tag可在控制台-版本管理页面获取

选择熟悉的技术栈（目前支持框架有：React模板，Vue模板，基础模板等），等待命令运行结束即可。
更多细节，可参考生成的工程里的readme.md

3.调试/预览
在你的工程目录下，运行以下命令：

rop start

运行命令后，浏览器自动打开以下窗口（也可以手动打开：http://127.0.0.1:9000/index.html）。本地代码修改后，页面会自动刷新。

四、H5开发

4.1 目录结构

使用IDE打开项目文件夹（推荐使用 Visual Studio Code）。

可以看到，项目目录结构大致如下：

├── README.md                  
├── node_modules              
├── package.json
├── rop.config.js                // rop配置说明
└── src
    ├── pages                    // 页面目录
    │   └── index                // 首页示例页面
    │       ├── index.html       // 页面html文件
    │       ├── index.js         // js文件
    │       └── index.less       // css文件
    ├── postcss.config.js        // postcss配置文件
    └── util                     // 工具类目录

其中，`/src/pages/index`文件夹固定为app首页，不要修改该文件夹的文件名。

为了良好的用户体验考虑，推荐使用前端静态路由方案进行多页开发。框架也支持新加页面，具体方法参考生成的工程里的readme.md

4.2 阿里JS-API接口调用

tida-rop文档：//open.taobao.com/doc.htm?docId=108912&docType=1

参考api文档中的接口调用方式

Tida.rop.call(apiname, data, succ, fail, timeout))

见每个接口提供的实例代码：

Tida.rop.call('vendor.payByFace', {
  '12313123210', // itemId
  'red'  // channel
}).then(function (data) {
  console.log(data);
  // console output
  // true
}, function (err) {
  console.log(err);
});

4.3 图片/视频资源使用

所有app中使用的图片和资源必须上传alicdn，否则无法加载。可通过“控制台->媒体资源管理”上传CDN，目前开发者可以免费使用

五、版本管理与发布流程

1.编译打包

开发完成后，在工程文件夹下，运行以下命令：

rop build

编译成功后，在工程文件夹的 _output 目录下会生成一个zip包：build.zip

注意：每次新创建版本后，会生成新的版本标签，需要将新版本的“版本标签”更新至工程的配置文件。文件路径：工程文件夹/rop.config.js

module.exports = {
 dev: {
 port: 9000, // 端口
 host: '127.0.0.1', // host
 framework: '_',
 },
 appKey: 'XXXX',
 tag: 'jkcjs1ij',
}

2.上传zip包并提交审核

控制台 -> 选择应用 -> 版本管理

上传好之后，状态会变成“已上传”，点击“发布”按钮，进入“数据审核”页面：

在该页面中，系统会自动扫描代码里引用的资源。请提交所有用到的资源，以及服务端的接口。未报备的都会被端屏蔽。请仔细填写。完成后，点击“提交审核”。

3.审核并发布

后台小二审核通过后自动发布

六、Mock测试

平台提供了Mock管理，方便开发者进行本地接口数据的模拟调试：

进入“控制台->版本管理->开发版本->Mock管理”页面，可进行Mock数据的新增，编辑，和修改。具体请参考“ 配置中心-API数据模拟”章节。

FAQ

关于此文档暂时还没有FAQ

有用(0) 我要提问