昆山h5网站建设,网站排版策划,百度收录网站之后又怎么做,装饰工程验收规范最新版对于想快速实现一个产品而言#xff0c;如果使用传统开发#xff0c;又要兼顾前端开发#xff0c;同时又要花费时间构建后端服务。然而有这么一个平台#xff08;Baas Backend as a service#xff09;后端即服务#xff0c;能够让开发人员可以专注于前端开发#xff0c…对于想快速实现一个产品而言如果使用传统开发又要兼顾前端开发同时又要花费时间构建后端服务。然而有这么一个平台Baas Backend as a service后端即服务能够让开发人员可以专注于前端开发而无需花费大量时间和精力来构建和维护后端基础设施。对于只会前端的人来说这是一个非常好的选择。后端即服务的平台使得开发人员能够快速构建应用程序更快地将其推向市场。当然了你可以将你的后端应用接入 Baas这样你就无需配置数据库编写复杂的身份效验。如果你想了解 Baas我想这篇文章或许对你有所帮助。什么是 Supabase?在摘要部分也介绍到名词 BaaS (Backend as a Service) 意思为后端即服务。这个概念是在我接触 Serverless 的时候了解到的更准确来说是腾讯云开发。当时在编写小程序的时候只需要专注与应用业务逻辑而不用编写数据存储身份验证文件存储等后端服务这些统统由 BaaS 平台所提供。 通常会配合 Serverless 函数使用通常也叫 FaaSFunction as a Service。通常来说FaaS 会依赖于 BaaS 平台。而 Supabase 便是 BaaS 的平台之一。Supabase 是一个开源的 Firebase 替代品。使用 Postgres 数据库、身份验证、即时 API、边缘函数、实时订阅和存储启动项目。你也许听过 Firebase由 Google 提供的私有云服务但开发者无法修改和扩展其底层代码。而 Supabase 是开源的提供了类似 Firebase 的功能且定价灵活并且官方自称为 Firebase的替代品。BaaS 与 CMS 有何不同BaaS 通常只专注于应用的后端服务而 CMS 则是专注与内容管理。不过 BaaS 比较依赖云服务而 CMS 通常只依赖于 web 后端技术。如果你想搭建一个内容站点视频音频文章并且作为网站管理员那么 CMS 就是一个很好的选择并且有相当多的主题模板。反之不想搭建后端服务减少运营程序那么毫不犹豫的选择 BaaS。注册 Supabase进入 supabase 登录界面 选择 Continue With Github输入 Github 账号密码进入主页面新建一个项目为该项目起名设置数据库密码以及分配地区。:::caution创建 supabase 项目对密码要求非常严格像 a123456 这种根本无法通过像 ●●●●●●●●●● 密码就可以。地区方面优先就近原则而最近的也就是日本与韩国很无奈 supabase 在大陆和港澳台并未设立服务器。:::等待片刻你将拥有一个免费的后端服务supabase 会提供一个二级域名供开发者访问也就是这里 Project Configuration 的 URL对应的这个二级域名 azlbliyjwcxxxxx 也就是你这个项目的唯一标识 Reference ID下文称 项目id。你可以到 https://app.supabase.com/project/你的项目id/settings/api 中查看相关配置。体验一下这里参考到了官方文档 Serverless APIs。首先创建一个 todos 表并新增字段列task 为 varchar 类型Save 保存。Insert row 添加一行记录id 为 1task 为 code。现在有了数据后正常来说我们应该做什么请求一下数据看看不不不应该是设置数据的权限。打开到下图界面我们要为 todos 数据新增一个 policy 策略。supabase 针对不同的场景提供了相应的策略方案模板你也可以根据你的需求进行设置这里作为演示不考虑太复杂选择第一个允许任何人都可以请求到 todos 数据。接着下一步即可此时就新增了一个所有用户都可查询的 todo 的策略同样的你还可以添加只有授权用户才能够创建更新删除 todo更新与删除只能操作属于自己的 todo 资源。这时候设置好了数据的权限后就可以尝试去请求了打开下图页面将 URL 与 apikey 复制下来。选择你一个 http 请求工具这里我选用 hoppscotch将信息填写上去请求将会得到一开始所创建的 todo 数据。除了 restful api 风格还支持 graphql 风格可查阅文档 Using the API使用类库正常情况肯定不会像上面那样去使用而是通过代码的方式进行登录CRUD。这里使用 Javascript Client Library替我们封装好了 supabase 的功能。首先安装依赖npm install supabase/supabase-js创建 客户端实例import { createClient } from supabase/supabase-js此时准备好上述的URL与apikey用于创建supabase实例不过supabase还提供 type类型支持可以将生成的 database.types.ts 导入到实例中如import { createClient } from supabase/supabase-js
import { Database } from lib/database.typesconst supabase createClientDatabase(process.env.SUPABASE_URL,process.env.SUPABASE_ANON_KEY
)此时有了supabse对象后就能够请求数据了想上述通过http的方式在这里对应的代码为const { data, error } await supabase.from(todos).select()官方的演示例子 非常清晰这里就不在演示新增更新等示例。Supabase 主要功能Database 数据库supabase 基于 PostgreSQL 数据库因此当你创建完项目后就自动为你分配好了一个可访问的 PostgreSQL 数据库你完全可以将其当做一个远程的 PostgreSQL 数据主机。可以在如下页面中查看到有关数据库连接的信息当然你看不到密码。测试连接结果如下并无问题Authentication 身份验证Auth | Supabase Docssupabase 令我感兴趣的是 Row Level Securitysupabase 使用 Postgres 的 Row-Level-Security行级安全策略可以限制不同用户对同一张表的不同数据行的访问权限。这种安全机制可以确保只有授权用户才能访问其所需要的数据行保护敏感数据免受未授权的访问和操作。在传统的访问控制模型中用户通常只有对整个表的访问权限无法限制他们对表中特定数据行的访问。而行级安全技术则通过将访问权限授予到特定的数据行从而让不同的用户只能访问他们被授权的行。这种行级安全有一个很经典应用场景-多租户系统允许不同的客户在同一张表中存储数据但每个客户只能访问其自己的数据行。这对于传统后端开发而言如果不借用一些安全框架实现起来十分棘手要么业务代码与安全代码逻辑混杂不堪。权限细分方面无需担心supabase 已经为你做好了准备就等你来进行开发。第三方登录对于想要提供第三方登录supabse 集成多数平台除了国内只需要提供 Clinet ID, Client Secret, Redirect URL 便可完成第三方登录。这里演示下如何使用 Github首先到打开New OAuth Application (github.com) 创建一个 Oauth Apps其中 Authorization callback URL 由 supabase 提供如下图。当你创建完后会提供 Client ID与 Client secret将这两个值填写到 supabase 中并启用。此时打开如下页面将 Site URL 替换成开发环境或是线上环境在 Github 登录后将会跳转到这个地址上此时 supabase 支持 github 登录就已经配置完毕当你在前端触发登录按钮后借助supabase 的 js 库如const {data, error} await supabase.auth.signInWithOAuth({provider: github,
});便可完成 Github 第三方登录。Bucket 存储桶接触过对象存储的开发者对 Bucket 应该不陌生相当于给你一个云盘这里演示如何使用。打开如下界面这里选择公开存储桶比如说用于图床。点击右上角的 upload files选择你要上传的图片。你可以为此生成一个访问 URL你可以访问 1.png 来查看这张图片。如果是公开的话 一般都是类似https://azlbliyjwcemojkwazto.supabase.co/storage/v1/object/public/new-bucket/1.png而私有的为 https://azlbliyjwcemojkwazto.supabase.co/storage/v1/object/sign/new-bucket/1.png?tokeneyJhbGciOiJIUzI1NiIsInR5cCIxxxxxxxxxxxxxxxxx 路径稍微变化了下还有就是多了个 token如果不携带 token 则访问不了图片。你可以到Supabase Storage API 查看 storage 相关 api。:::caution本文中的所有图片数据都来源于 supabase bucket现学现用了属于是。:::Edge Functions 边缘函数边缘函数可以分布在全球的接近您的用户各个地方类似与 CDN但 CDN 主要服务于静态资源而 Edge Functions 可以将你的后端应用接口像 CDN 那样部署到全球各地。有兴趣可自行了解。使用 Supabase 编写一个简易图床如果只单纯看看 supabase 文档不去动手实践接入一下总觉得还是差点意思。于是我准备使用 Nuxt 作为前端框架接入 supabase官方模块 Nuxt Supabase 去编写一个应用。原本我是打算写个 Todo List 的恼怎么又是 Todo List但是看到 官方示例一堆 Todo List后我瞬间就没了兴致 。思来想去不妨就简单做个图床吧。项目地址https://image.kuizuo.cn 有兴趣可自行阅读源码。写的相对匆忙仅作为演示随时有可能删除请勿将此站作为永久图床一些你可能比较好奇的问题资源可以到 https://app.supabase.com/project/项目id/settings/billing/usage 中查看相关资源使用情况这里我就将截图放出来了。说实话对于个人独立开发者的项目都绰绰有余了。费用在 资费标准 中可以看到免费版最多 2 个项目不过在上述的资源其实已经非常香了毕竟只需要一个 GIthub 账号就能免费使用还要啥自行车。网速国内因为没有 supabase 的服务器节点然后且有防火墙的存在所以请求速度偏慢。不过体验下来至少不用梯子速度慢点但也还在可接受范围。域名用过 vercel 的你应该会想是不是也能自定义域名呢? 当然不过这是 supabase pro 版才支持一个月$25(美刀)算了算了再一眼 azlbliyjwcxxxxx.supabase.co就会爆炸感觉也蛮好记的。结语说句实话真心感觉 supabase 不错尤其是对个人/独立开发者而言没必要自行去购买服务器去搭建后端服务很多时候我们只想专注于应用程序的开发和功能实现而不是花费大量时间和精力在服务器和后端服务的部署和管理上。
