2021-3-12 08:22:29 [显示全部楼层]
3068浏览
查看: 3068|回复: 0

[Technovation] 【Technovation官方中文教程】编程13 - 在云和API中储存数据

[复制链接]
本帖最后由 szjuliet 于 2021-3-12 08:22 编辑

教程地址:https://bit.ly/TGirlsCN-Coding13
返回教程目录:https://mc.dfrobot.com.cn/thread-308465-1-1.html

编程13:在云和API中储存数据
  
在云和() API中存储数据是在代码复杂性课题中获得更多分数的一种方法。学会它还可以帮助应用程序函数、用户体验和设计及技术学习。
  
本课中,您将学会……
  
●        了解云存储和API
  
●        创建登录页面
  

  
关键术语和概念
  
●        云存储(Cloud Storage - 存储在网络上的信息,任何连接到互联网的设备都可以对它进行访问
  
●        Web数据库 - 在云端存储和组织信息的一种方式
  
●        API (应用程序编程接口) – 您可以从另一个网站或数据库获得信息的方式。

  
灵感 - Web数据库和API
  
在上一节编码课中,您学习了如何在设备上存储信息,以及如何使用本地存储。您还构建了一个待办事项列表应用程序,允许用户在打开和关闭应用程序之间储存待办事项列表。在本课中,您将学习云存储以及如何在网页上存储信息,这样任何设备连接到互联网可以访问它。另一个经常用来描述云存储的术语就是Web数据库
  
云储存
  
假设您有两部手机运行一个应用程序,手机A和手机B。如果手机A将数据存储在本地存储或本地数据库中,那么手机B无法访问它。如果手机A将数据存储在云存储或web数据库中,则手机B可以访问这些数据本地存储。
  
本地储存
【Technovation官方中文教程】编程13 - 在云和API中储存数据图21
  
                                                                     
  
云储存
  
【Technovation官方中文教程】编程13 - 在云和API中储存数据图20
  
     
  
云储存的用途
  
对于使用频繁变化信息的应用程序来说,云存储十分必要。我们可以举例说明一下。假设您正在创建一个应用程序,显示您所在城市月度最受欢迎的10家餐馆。将受欢迎餐馆列表放到应用程序中,然后将程序上传到应用程序商店。下个月,您需要更新餐厅列表,并在应用商店中更新您的应用。已经使用该应用程序的用户也需要更新或重新下载程序,才能查看新的热门餐馆,十分麻烦。
  
  
现在,假设您将排名前10的餐厅存储在云存储中。更新餐厅时,已下载您应用程序的所有手机,都会自动检查此云存储的更新。用户将立即看到所更改的内容,而无需重新下载任何东西。
  
  
您在Facebook或Instagram上分享过照片吗?此类应用程序就使用了云存储。当您的朋友上传并共享图片时,您的手机会在Web数据库中检查是否有新照片,这样您就能在Feed中看到更新了。
  
  
我们什么时候会用到云存储呢?以下是一些常见用法:
  
●        要求用户的登录名和密码
  
●        共享游戏中的数据,例如高分列表
  
●        允许用户通过feed彼此共享图像
  
●        显示可更新所有用户的feed
  
●        记住有关用户的事物,例如他们的交易记录、财务记录或医疗记录
  
  
重要的是要知道,在使用云存储时,手机需要具有互联网连接才能获取信息。如果手机网速慢,则可能会让您的应用程序变慢或无法更新。
  
App Inventor中有几种不同的云存储选项。其中大多数属于Web数据库。在这节课的活动中,App Inventor将使用CloudDBThunkable使用Realtime DB。在其他资源中,我们还提供了如何在App Inventor中设置TinyWebDBFusion Tables的说明。
  
API
  
API代表应用程序编程接口。API是一种可以从另一个网站或另一个网站的数据库中获取信息的方法。
  
假设您正在开发一个应用程序,让人们可以根据天气情况决定穿什么衣服。您可能需要花费大量时间将天气数据上传到数据库中,然而已经有网站可以显示天气了。更好的解决方案就是从这类天气网站获取数据,然后通过您的应用将其显示给用户。API可以帮助您做到这一点。
    
  
以下是程序员们创建应用程序时常用的API:
  
  
   
API
   
数据
   
   
App Inventor教程
   
   
Thunkable教程
   
   
谷歌地图
   
   
位置及地图资料
   
               
   
雅虎金融
   
   
股票价格
   
           
   
   
国家气象局
   
   
天气
   
               
  
  
您可以观看此视频或在此处查看资源,了解有关Thunkable中API的更多信息。
  

  
活动 - 使用云存储创建一个登录屏幕
  
在这个应用程序中,用户可以创建一个账户并登录。在App Inventor中使用CloudDB,在Thunkable中使用Cloud Variables(云变量)进行操作。运作方式如下:
  
新用户注册后,程序会将用户名和密码保存在云中
  
   
App Inventor
Thunkable
【Technovation官方中文教程】编程13 - 在云和API中储存数据图1   
【Technovation官方中文教程】编程13 - 在云和API中储存数据图3   
  
  
用户登录时,它将调用云数据库,获取其用户名和密码
  
   
App Inventor
   
Thunkable
【Technovation官方中文教程】编程13 - 在云和API中储存数据图2   
【Technovation官方中文教程】编程13 - 在云和API中储存数据图7   
  
  
如果用户成功登录,则应用会将他们引导至其个人资料页面
  
   
App Inventor
   
Thunkable
【Technovation官方中文教程】编程13 - 在云和API中储存数据图4   
【Technovation官方中文教程】编程13 - 在云和API中储存数据图5   
  
  
然而,这个应用程序存在一个重大安全漏洞!  在登录之前,它从不检查用户密码是否与云存储中的密码匹配。也就是说,任何用户都可以登录任何帐户。您需要修复这个错误,并在用户名或密码不正确时向用户发出警告。
【Technovation官方中文教程】编程13 - 在云和API中储存数据图15
  
  
您需要确保从云存储返回的值与用户在文本框中输入的密码是匹配的!准备好开始了吗?请在下方下载源代码。
  
       
  
重要提醒:
  
默认情况下,云变量保存到Thunkable默认Firebase数据库中,但是您可以按照此处的说明将它们保存到自己的私有Firebase数据库中。
  
提示1
  
   
正确的密码存储为CloudDB / Realtime DB中的值。您需要检查并确保该值与输入到文本框中的密码是否匹配。
   
App Inventor
【Technovation官方中文教程】编程13 - 在云和API中储存数据图6
【Technovation官方中文教程】编程13 - 在云和API中储存数据图8
【Technovation官方中文教程】编程13 - 在云和API中储存数据图9
   

   

   

Thunkable
【Technovation官方中文教程】编程13 - 在云和API中储存数据图11
   
   
   
   
【Technovation官方中文教程】编程13 - 在云和API中储存数据图10
   
  
  
提示2:您可以使用一个条件,确保密码与数据库中的值匹配。
  
   
App Inventor
   
Thunkable
【Technovation官方中文教程】编程13 - 在云和API中储存数据图12


【Technovation官方中文教程】编程13 - 在云和API中储存数据图14   
  
  
提示3像这样把他们组合起来!
  
   
App Inventor
   
Thunkable
【Technovation官方中文教程】编程13 - 在云和API中储存数据图13

【Technovation官方中文教程】编程13 - 在云和API中储存数据图17
  
  
额外奖励:
  
如果有人试图用已经使用过的用户名进行注册,会发生什么情况?编写此代码的方式将只允许该用户使用新密码覆盖用户名。当新用户注册后,您将如何检查用户名尚未被使用?
  

  
举一反三
  
与您的小组成员和指导者讨论如何在应用程序中使用Web数据库。

  
其他资源
  
App Inventor中的TinyWebDB
  
  
TinyWebDB与TinyDB相似,它使用标签值对来存储和检索数据。如果您使用的数据大部分是成对的,比如用户名和密码,那么TinyWebDB会是一个很好的选择。TinyWebDB还有一个额外的好处,就是您可以进入web服务,查看所有存在的标签,并删除不再需要的数据。您的web服务将如下所示:
  
     
  
【Technovation官方中文教程】编程13 - 在云和API中储存数据图18
  
设置TinyWebDB
  
要想使用TinyWebDB,您必须设置自己的web服务,在其中存储和检索数据。以下是MIT的操作说明:Custom TinyWebDB
  
  
  
如果您在设置过程中还是卡壳了,这里有一段视频或许可以帮您答疑解惑:these  instructions
  
  
TinyWebDB是一个不可见的组件,或者不在屏幕上显示,看起来像这样
【Technovation官方中文教程】编程13 - 在云和API中储存数据图16
  
  
  
编程TinyWebDB与编程TinyDB略有不同。进行调用时,您必须等待应用程序向web服务请求数据。这是因为TinyWebDB通过互联网请求信息,它的速度取决于您的网络速度。代码块如下所示:
【Technovation官方中文教程】编程13 - 在云和API中储存数据图19
  
  
当用户按下按钮1时,应用程序将向web服务请求名为“用户1”的标签的值。一旦应用程序有了来自TinyWebDB的值,它就会将标签1和标签2设置为标签和值。
  
  
疑难问题排除技巧:
  
  
●        如果您在下载适用于Python的Google App Engine时遇到问题,请尝试点击此处下载
  
●        与TinyDB一样,如果您在TinyWebDB中两次使用相同的标签名称,则数据将被覆盖。
  
Fusion  Tables
  
是App Inventor中可用的另一种Web数据库。Fusion tables使用表格来存储和检索数据,而不是标签-值对。这样您就可以存储更复杂的数据集。下面是一个表格示例,用于跟踪足球队的新球衣。每个人都会得到一件带有其名称和编号的球衣。您需要一种跟踪每个人的姓名、编号和衬衫尺寸的方法。
  
  
   
姓名
   
编号
   
   
衬衫尺寸
   
   
Marissa
   
   
2
   
   
L
   
   
Ruchi
   
   
6
   
   
M
   
   
Hadar
   
   
3
   
   
S
   
   
Sarah
   
   
7
   
   
M
   
   
Iyonce
   
   
4
   
   
S
   
  
  
为了更好地了解可能使用fusion tables的一些情况,以下是过去的技术创新团队使用fusion tables的一些场景。比较并看看有没有与您的应用程序类似的情况。
  
  
●        创建接受捐赠的地点中心目录。表项包括经度和纬度、电话号码以及它们接受的项。
  
●        存储用户的位置、用户名、密码、个人简介、头像等信息
  
●        绘制地图及在地图上标绘点
  
●        存储论坛中帖子和评论
  
  
看看这两个Technovation应用程序中使用 fusion tables的示例:
  
  
   
CramJam
   
BCNeeds
   
   
“CramJam”使用它来整合谷歌文档和图片的加载,以预览在线笔记。
“BCNeeds”用它来记录慈善募捐点的捐赠服务和物品。两者都使用表格来存储持久数据,并将其与列表选择器集成
   
  
  
以下是MIT的教程,教您如何使用fusion tables: Fusion table AI Pizza Party。这个教程对我们来说有些难度,所以我们用这个视频来学习。
  
  
App Inventor中的谷歌电子表格
  
  
Technovation校友Allison John创建了一个关于如何读写数据到谷歌电子表格的两部分系列教程
    
Thunkable中的FirebaseDB
  
跟着以下文档学习如何在Thunkable中使用FirebaseDB: https://docs.thunkable.com/realtime-db
  



您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

为本项目制作心愿单
购买心愿单
心愿单 编辑
[[wsData.name]]

硬件清单

  • [[d.name]]
btnicon
我也要做!
点击进入购买页面
上海智位机器人股份有限公司 沪ICP备09038501号-4

© 2013-2024 Comsenz Inc. Powered by Discuz! X3.4 Licensed

mail