bili-云开发讲解

作者: 新月异
来源: 51数据库
2020-08-06

小程序端

云函数

const cloud = require("wx-server-sdk");
cloud.init({
  env: "xly-ba27v",
});

const db = cloud.database();
const todo = db.collection("test");
// 云函数入口函数
exports.main = async (event, context) => {
  // console.lo
  const wxContext = cloud.getWXContext();
  return await todo
    .add({
      data: {
        todo: event.todo,
        _openid: wxContext.OPENID,
        other: "云函数端数据",
      },
    })
    .then((res) => {
      console.log(res);
    });
};

小程序端调用云函数

data: {
    todo:""
  },
  primary:function(){
    wx.cloud.callFunction({
      name:"test",
      data:{
        todo:"吃饭"
      }
    }).then(res => {
      // this.setData({todo:res.data})
      console.log(res)
    })
  },

    //获取临时文件路径
  chooseMessageFile(){
    const files = this.data.files
    wx.chooseMessageFile({
      count: 2,
      success: res => {
        console.log('选择文件之后的res',res)
        let tempFilePaths = res.tempFiles
        this.setData({ tempFilePaths: tempFilePaths })
        console.log('选择文件之后的files', tempFilePaths)
      }
    })
  },
  // 将临时文件上传到云存储指定云文件里
  uploadFiles(e) {
    const filePath = this.data.tempFilePaths[0].path
    const cloudPath = `cloudbase/${Date.now()}-${Math.floor(Math.random(0, 1) * 1000)}` + filePath.match(/\.[^.]+?$/)
    wx.cloud.uploadFile({
      cloudPath,filePath
    }).then(res => {
      console.log(res)
    }).catch(error => {
      console.log("文件上传失败",error)
    })
  },

小程序端视图层

<button type="primary" bindtap="primary">primary</button>
<image
  src="cloud://xly-ba27v.786c-xly-ba27v-1301545001/1584691592129-64.png"
></image>

<form bindsubmit="uploadFiles">
  <button type="primary" bindtap="chooseMessageFile">选择文件</button>
  <button type="primary" formType="submit">上传文件</button>
</form>

web 端

环境准备

登陆腾讯云新建环境，使用免费版

云函数

安装 cli 工具npm i -g @cloudbase/cli

cloudbase 命令可以简写成 tcb

查看版本tcb -v

尝试登陆tcb login

初始化一个项目mkdir my-cloudbase-app,tcb init

部署函数tcb functions:deploy app

查看函数列表tcb functions:list

下载云函数cloudbase functions:download <functionName> [destPath]
默认情况下，函数代码会下载到 functionRoot 下，以函数名称作为存储文件夹，你可以指定函数存放的文件夹地址，函数的所有代码文件会直接下载到指定的文件夹中

查看函数详情cloudbase functions:detail app,查看所有详情cloudbase functions:detail

删除函数cloudbase functions:delete app,删除所有cloudbase functions:delete

赋值函数cloudbase functions:copy app app2

更新函数代码cloudbase functions:code:update app

functions:code:update 命令和 functions:deploy 命令的主要区别是：functions:code:update 命令只会更新函数的代码以及执行入口，不会修改函数的其他配置，而 functions:deploy 命令则会修改函数的代码、配置

云存储

上传文件cloudbase storage:upload localPath cloudPath,当 CLI 检测到 localPath 为文件夹时，会自动上传文件内的所有文件。

下载文件cloudbase storage:download cloudPath localPath,下载文件夹cloudbase storage:download cloudPath localPath --dir

查看日志cloudbase functions:log app

删除文件cloudbase storage:delete cloudPath,删除文件夹cloudbase storage:delete cloudPath --dir

文件列表cloudbase storage:list cloudPath

获取文件访问链接cloudbase storage:url cloudPath

获取文件详细信息cloudbase storage:detail cloudPath

查看权限cloudbase storage:get-acl,设置权限cloudbase storage:set-acl

调用云函数

需要起一个服务在根目录下npx server或http-server

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <script src="https://imgcache.qq.com/qcloud/tcbjs/1.3.5/tcb.js"></script>
  </head>
  <body>
    <script>
      const app = tcb.init({
        env: "web-d68cb1",
      });
      app
        .auth()
        .signInAnonymously()
        .then(() => {
          alert("登录云开发成功！");
        });
      app
        .callFunction({
          name: "test",
        })
        .then((res) => {
          console.log("hahah", res);
        });
    </script>
  </body>
</html>

微信公众号登录

const auth = app.auth();
            async function login() {
                // 1. 建议登录前先判断当前是否已经登录
                const loginState = await auth.getLoginState();
                if (!loginState) {
                    // 2. 调用微信登录API
                    await auth
                        .weixinAuthProvider({
                            appid: "xxx", // 微信公众号的Appid
                            scope: "xxx",
                        })
                        .signIn();
                }
            }

数据库操作

 const db = app.database();

            const collection = db.collection("file");

            collection
                .add({
                    name: "Ben",
                })
                .then((res) => {
                    console.log(res);
                });

文件操作

app.getTempFileURL({
                fileList: [
                    "cloud://web-d68cb1.7765-web-d68cb1-1301545895/static/img/timg8.gif",
                ],
            }).then((res) => {
                res.fileList.forEach((el) => {
                    if (el.code === "SUCCESS") {
                        console.log(el.tempFileURL);
                        return el.tempFileURL;
                    } else {
                        //获取下载链接失败
                    }
                });
            });

部署 hugo

在 github 下载成品https://github.com/gohugoio/hugo/releases,mac 下使用可brew install hugo

生成一个博客站点hugo new site myblog

https://themes.gohugo.io/hugo-theme-m10c/
下载主题git clone https://github.com/vaga/hugo-theme-m10c.git m10c

在 config.toml 文件中添加以下行：

baseURL = "https://example.org/"
languageCode = "en-us"
title = "My New Hugo Site"
theme = "m10c"

本地启动hugo server -D

新建一篇文章hugo new post/blog.md

部署到云端

hugo --baseUrl="https://web-d68cb1.tcloudbaseapp.com/" --buildDrafts

cloudbase hosting:deploy ./public -e web-d68cb1

flutter 端

原文链接：http://www.cnblogs.com/ycoder/p/12741439.html