目前华为AGC云存储服务曾经反对在快利用中集成了,你能够应用云存储服务存储图片、视频、音频等,集成的Demo能够参考Github。
1、装置Node.js环境:
1、下载Node.js安装包:https://nodejs.org/en/download/

2、Window环境装置Node.js

3、装置好当前,零碎会弹出一个cmd框提醒你主动装置所需的插件

2、查看PATH环境变量内是否配置了NodeJS:
1、我的电脑 – 右键抉择属性 – 抉择高级零碎设置 – 抉择环境变量 – 查看零碎变量

在零碎变量界面抉择Path:查看是否有装置的NodeJS门路:

2、查看NodeJS版本; 查看npm版本

3、装置快利用IDE并且配置环境
1、下载并且装置快利用IDE,与快利用加载器

https://developer.huawei.com/...

2、IDE操作: 在IDE创立一个快利用我的项目:

3、点击 Npm > 启动第三方NPM库,此时IDE会主动向我的项目中增加fa-toolkit以及package.json。

4、SDK集成
1、下载agconnect-services.json文件,并且放到src目录下

2、执行npm命令,增加云存储依赖项:npm install --save @agconnect/cloudstorage

3、装置依赖,点击IDE菜单“Npm > 装置依赖”

5、性能开发
a) 界面设计与前置步骤
1、在src/manifest.json文件中,features下增加system.media依赖,用于获取本地文件

{  "name": "system.media"}

2、在src/Hello/hello.ux文件中,增加登录按钮,并且增加匿名登录的相干代码:

3、点击IDE菜单“文件 > 新建页面”,页面门路为“Main”,页面文件名为“index”,增加界面布局。

能够依照下图进行UI设计。

b) 创立援用
1、src/app.ux文件中,增加编译依赖配置和onCreate函数下初始化agc

<script>import agconnect from "@agconnect/api";  import "@agconnect/cloudstorage";   module.exports = {    onCreate() {      console.info('Application onCreate');      let agConnectConfig = require('./agconnect-services.json');      agconnect.instance().configInstance(agConnectConfig);    },    onDestroy() {      console.info('Application onDestroy');    },    dataApp: {      localeData: {}    },    agc: agconnect  }</script>

c) 上传文件
putFile为上述UI中putFile按钮绑定函数,可依据本身设计代码调整。

putFile() {  let that = this;  media.pickFile({    success: function (data) {      console.log("handling success: " + data.uri);      let agconnect = that.$app.$def.agc;      let ref = agconnect.cloudStorage().storageReference();      let path = that.currentPath + that.getName(data.uri);      const child = ref.child(path);      child.put4QuickApp(data.uri, {        cacheControl: 'helloworld',        contentDisposition: 'helloworld',        contentEncoding: 'helloworld',        contentLanguage: 'helloworld',        contentType: 'helloworld',        customMetadata: {          hello: 'kitty'        }      }).then((res) => {        that.result = JSON.stringify(res, null, "\t");        prompt.showToast({          message: `putFile success`,          duration: 3500,          gravity: 'center'        });      })    },

d) 获取文件列表
getList、getListAll为上述UI中对应按钮的绑定函数,可依据本身设计代码调整。

getList() {  let agconnect = this.$app.$def.agc;  let ref = agconnect.cloudStorage().storageReference();  let path = this.selected === '' ? this.currentPath : this.selected;  const child = ref.child(path);  child.list({ maxResults: 10 }).then((res) => {    this.currentPath = path;    this.selected = '';    this.setList(res);  })},getListAll() {  let agconnect = this.$app.$def.agc;  let ref = agconnect.cloudStorage().storageReference();  let path = this.selected === '' ? this.currentPath : this.selected;  const child = ref.child(path);  child.listAll().then((res) => {    this.currentPath = path;    this.selected = '';    this.setList(res);  })},

e) 获取文件下载地址
getDownloadURL为上述UI中对应按钮的绑定函数,可依据本身设计代码调整。

getDownloadURL() {  if (this.selected === '' || this.selected.endsWith('/')) {    prompt.showToast({      message: `only file can getDownloadURL`,      duration: 3500,      gravity: 'center'    });    return;  }  let agconnect = this.$app.$def.agc;  let ref = agconnect.cloudStorage().storageReference();  const child = ref.child(this.selected);  child.getDownloadURL().then((res) => {    this.result = res;    prompt.showToast({      message: `getDownloadURL success`,      duration: 3500,      gravity: 'center'    });  })}

5、景象与验证
在快利用IDE两头点击Run,运行该快利用,能够在右侧查看相应的成果



6、总结
CloudStorage之前的JS SDK,曾经无缝反对华为快利用,多场景的笼罩更加全面。另外在快利用的应用上方便快捷,API接口齐全满足各种应用状况,

具体开发指南:https://developer.huawei.com/...

云存储快利用Demo:

https://github.com/AppGallery...

原文链接:https://developer.huawei.com/...
原作者:Mayism