{"componentChunkName":"component---src-templates-blog-detail-tsx","path":"/blog/2020-03-22-ai-album","result":{"data":{"currentBlog":{"id":"a53da5f1-6904-5125-b2e8-1f87cc645bd6","frontmatter":{"thumbnail":"https://img.serverlesscloud.cn/202025/1580916042404-1.png","authors":["Anycodes"],"categories":["user-stories"],"date":"2020-03-22T00:00:00.000Z","title":"基于 Serverless 的人工智能相册小程序","description":"App store 上各类人工智能相册程序，其实都可以通过 Serverless 来实现！","authorslink":["https://www.zhihu.com/people/liuyu-43-97"],"translators":null,"translatorslink":null,"tags":["Serverless","AI"],"keywords":"Serverless 全局变量组件,Serverless 单独部署组件,Serverless Component","outdated":true},"wordCount":{"words":256,"sentences":54,"paragraphs":54},"fileAbsolutePath":"/opt/build/repo/content/blog/2020-03-22-ai-album.md","fields":{"slug":"/blog/2020-03-22-ai-album/","keywords":["go","python","serverless","website","photo","album","相册","功能","tags"]},"html":"

日常生活中，我们常常会想要「搜索照片」。每当寻找很久远的照片时，记忆模糊，检索照片时只能想起大致的时间，然后一张张查看。这样不仅效率低下，还经常会漏掉我们想找的照片。

\n

近几年微信小程序发展迅速，如果有这么一款软件，我们只需要用文字简单描述，就能实现图片的快速检索，岂不是很棒！

\n

本项目将以小程序为例，在 Serverless 架构上进行开发。该小程序在保留相册基础功能（新建相册、删除相册、上传图片、查看图片、删除图片）上，增加人工智能搜索 —— 即用户上传图片之后，基于 Image Caption 技术，自动对图片进行描述，实现 Image to Text 的过程。这样，当用户进行搜索时，通过文本间的相似度，就可以返回最贴近的图片。

\n

基础设计

\n

\"基础设计\"

\n

该项目设计主要拥有登录、相册、图片上传和预览功能，以及搜索功能。如图所示：

\n

\"相册功能\"

\n\n

当然这四个主要功能和模块是和前端关系紧密的部分，除此之外还有后端异步操作的两个模块，分别是图像压缩和图像描述功能。

\n

1. 注册功能：

\n

注册功能是用户点击注册账号之后，执行的动作。

\n

该动作需要注意，注册之前需先判断用户是否已经注册过。如果已注册则默认登陆，否则进行注册并登陆。当用户不想注册时，可以点击体验程序，对程序大部分页面进行预览。但是不能实现有关数据库的增删改查。登录功能页面如图所示：

\n

\"登录功能页面\"

\n

2. 相册功能：

\n

当用户注册登录之后，可以在相册管理页面进行相册相关的管理，包括编辑、删除和新建。在进行添加和修改的时候，需要注意相册名称是否已经存在；在进行删除、修改相册等操作时要判断用户是否有操作该相册的权限等。相册功能原型如图所示：

\n

\"相册功能原型\"

\n

3. 图片功能：

\n

图片功能主要包括图片列表以及图片获取、上传和删除。在图片获取与删除的过程中，要对用户是否有该项操作的权限进行判断，上传时也要判断是否有上传到指定相册的权限。图片功能相关原型图如所示。

\n

\"图片功能相关原型图\"

\n

图片功能部分除了用户侧可见的功能，还有定时任务。当用户上传图片之后，系统会在后台异步进行图像压缩、图像描述和关键词提取等。整体流程如图所示。

\n

\"图片功能系统后台流程\"

\n

4. 搜索功能：

\n

搜索功能指的是通过关键词或使用者的描述，得到目标数据的过程。这一功能原型图如图所示。

\n

\"搜索原型\"

\n

这一部分的难点在于通过用户的描述，搜索到目标数据的过程。这个过程的基本流程如图所示。

\n

\"搜索流程\"

\n

项目开发

\n

1. 数据库建立

\n

\n

数据库部分主要对相关的表和表之间的关系进行建立。\n首先需要创建项目所必须的表：

\n\n \n 复制代码\n \n \n
CREATE DATABASE `album`;\nCREATE TABLE `album`.`tags` ( `tid` INT NOT NULL AUTO_INCREMENT , `name` VARCHAR(255) NOT NULL , `remark` TEXT NULL , PRIMARY KEY (`tid`)) ENGINE = InnoDB;\nCREATE TABLE `album`.`category` ( `cid` INT NOT NULL AUTO_INCREMENT , `name` VARCHAR(255) NOT NULL , `sorted` INT NOT NULL DEFAULT '1' , `user` INT NOT NULL , `remark` TEXT NULL , `publish` DATE NOT NULL , `area` VARCHAR(255) NULL , PRIMARY KEY (`cid`)) ENGINE = InnoDB;\nCREATE TABLE `album`.`users` ( `uid` INT NOT NULL AUTO_INCREMENT , `nickname` TEXT NOT NULL , `wechat` VARCHAR(255) NOT NULL , `remark` TEXT NULL , PRIMARY KEY (`uid`)) ENGINE = InnoDB;\nCREATE TABLE `album`.`photo` ( `pid` INT NOT NULL AUTO_INCREMENT , `name` VARCHAR(255) NOT NULL , `small` VARCHAR(255) NOT NULL , `large` VARCHAR(255) NOT NULL , `category` INT NOT NULL , `tags` VARCHAR(255) NULL , `remark` TEXT NULL , `creattime` DATE NOT NULL , `creatarea` VARCHAR(255) NOT NULL , `user` INT NOT NULL ,  PRIMARY KEY (`pid`)) ENGINE = InnoDB;\nCREATE TABLE `album`.`photo_tags` ( `ptid` INT NOT NULL AUTO_INCREMENT , `tag` INT NOT NULL , `photo` INT NOT NULL , `remark` INT NULL , PRIMARY KEY (`ptid`)) ENGINE = InnoDB;
\n

创建之后，逐步添加表之间的关系以及部分限制条件：

\n\n \n 复制代码\n \n \n
ALTER TABLE `photo_tags` ADD CONSTRAINT `photo_tags_tags_alter` FOREIGN KEY (`tag`) REFERENCES `tags`(`tid`) ON DELETE CASCADE ON UPDATE RESTRICT;\nALTER TABLE `photo_tags` ADD CONSTRAINT `photo_tags_photo_alter` FOREIGN KEY (`photo`) REFERENCES `photo`(`pid`) ON DELETE CASCADE ON UPDATE RESTRICT;\nALTER TABLE `photo` ADD CONSTRAINT `photo_category_alter` FOREIGN KEY (`category`) REFERENCES `category`(`cid`) ON DELETE CASCADE ON UPDATE RESTRICT;\nALTER TABLE `photo` ADD CONSTRAINT `photo_user_alter` FOREIGN KEY (`user`) REFERENCES `users`(`uid`) ON DELETE CASCADE ON UPDATE RESTRICT;\nALTER TABLE `category` ADD CONSTRAINT `category_user_alter` FOREIGN KEY (`user`) REFERENCES `users`(`uid`) ON DELETE CASCADE ON UPDATE RESTRICT;\nALTER TABLE `tags` ADD unique(`name`);
\n

2. 让 Code 飞起来

\n
    \n
  • 在使用之前您需要有一个腾讯云的账号，并且开通了 SCF、COS、APIGW 以及 CDB 等相关产品权限；
    • \n
  • 将项目 clone 到本地，配置自己的密钥信息、数据库信息。配置文件在 cloudFunction 目录下的 serverless.yaml 中：
    • \n
\n\n \n 复制代码\n \n \n
# 函数们的整体配置信息\nConf:\n  component: \"serverless-global\"\n  inputs:\n    region: ap-shanghai\n    runtime: Python3.6\n    handler: index.main_handler\n    include_common: ./common\n    mysql_host: gz-c************************.com\n    mysql_user: root\n    mysql_password: S************************!\n    mysql_port: 6************************0\n    mysql_db: album\n    mini_program_app_id: asdsa************************dddd\n    mini_program_app_secret: fd340c4************************8744ee\n    tencent_secret_id: AKID1y************************l1q0kK\n    tencent_secret_key: cCoJ************************FZj5Oa\n    tencent_appid: 1256773370\n    cos_bucket: 'album-1256773370'\n    domain: album.0duzahn.com
\n

由于我目前使用的是 Serverless Components，没有全局变量等。所以在此处增加了全局变量组件，在这里设置好全局变量，在之后的 Components 中可以直接引用，例如：

\n\n \n 复制代码\n \n \n
# 创建存储桶\nCosBucket:\n  component: '@serverless/tencent-website'\n  inputs:\n    code:\n      src: ./cos\n    region:  ${Conf.region}\n    bucketName: ${Conf.cos_bucket}
\n
    \n
  • 安装必备工具： Serverless Framework、小程序云开发 IDE。由于本项目后台开发语言是 Python，您也需要一些 Python 的开发工具以及包管理工具（Python 版本不低于 3.6）
    • \n
  • \n

    在部分文件夹下安装相对应的依赖：

    \n
      \n
    • cloudFunction/album/prdiction 需要安装 Pillow, opencv, tensorflow, jieba
      • \n
    • cloudFunction/album/getPhotoSearch 需要安装 gensim, jieba 以及 collections
      • \n
    • cloudFunction/album/compression 需要安装 Pillow
      • \n
    \n

    （注意，在安装的时候一定要用 CentOS 操作系统。如果没相对应系统，可以在这里打包对应的依赖：http://serverless.0duzhan.com/app/scf_python_package_download/）

    \n
    • \n
  • 将项目部署到云端，只需要通过指令 serverless --debug 即可：
    • \n
\n\n \n 复制代码\n \n \n
DEBUG ─ Resolving the template's static variables.\n  DEBUG ─ Collecting components from the template.\n  DEBUG ─ Downloading any NPM components found in the template.\n  DEBUG ─ Analyzing the template's components dependencies.\n  DEBUG ─ Creating the template's components graph.\n  DEBUG ─ Syncing template state.\n  DEBUG ─ Executing the template's components graph.\n  DEBUG ─ Starting API-Gateway deployment with name APIService in the ap-shanghai region\n\n    ... ...\n\n  DEBUG ─ Updating configure...\n  DEBUG ─ Created function Album_Get_Photo_Search successful\n  DEBUG ─ Setting tags for function Album_Get_Photo_Search\n  DEBUG ─ Creating trigger for function Album_Get_Photo_Search\n  DEBUG ─ Deployed function Album_Get_Photo_Search successful\n  DEBUG ─ Uploaded package successful /Users/dfounderliu/Documents/code/AIAlbum/.serverless/Album_Prediction.zip\n  DEBUG ─ Creating function Album_Prediction\n  DEBUG ─ Updating code...\n  DEBUG ─ Updating configure...\n  DEBUG ─ Created function Album_Prediction successful\n  DEBUG ─ Setting tags for function Album_Prediction\n  DEBUG ─ Creating trigger for function Album_Prediction\n  DEBUG ─ Trigger timer: timer not changed\n  DEBUG ─ Deployed function Album_Prediction successful\n\n  Conf:\n    region:                  ap-shanghai\n\n      ... ...\n\n      -\n        path:   /photo/delete\n        method: ANY\n        apiId:  api-g9u6r9wq\n      -\n        path:   /album/delete\n        method: ANY\n        apiId:  api-b4c4xrq8\n      -\n        path:   /album/add\n        method: ANY\n        apiId:  api-ml6q5koy\n\n  156s › APIService › done
\n

这个过程，只用了 156s 便部署了所有函数。然后打开小程序的 id 带入 miniProgram 目录，并且填写自己的 appid 在文件 project.config.json 的第 17 行，同时也要配置自己项目的基础目录，就是 API 网关给我们返回的地址，写在 app.js 的第 10 行，此时项目就可以运行起来了。

\n
\n

自取 👉 后台的压缩包

\n
\n

小结

\n

Serverless 架构凭借着按量付费、低成本运维和高效率开发等众多优点于一身，帮助我们的项目快速开发和迭代。而 Serverless Framework 则是一个非常高效的工具，兼容 Tencent Cloud, AWS, Google Cloud 等多家厂商的 Serverless 架构。

\n

本项目以腾讯云 Serverless Framework 为例，详细信息可以移步官方说明。

\n
\n
\n
\n
\n

传送门：

\n\n
\n

欢迎访问：Serverless 中文网，您可以在 最佳实践 里体验更多关于 Serverless 应用的开发！

","tableOfContents":""},"previousBlog":{"id":"7815ab56-0a6c-5217-9f4c-5c5759f734dd","frontmatter":{"thumbnail":"https://img.serverlesscloud.cn/2020327/1585281283389-1.jpeg","authors":["Anycodes"],"categories":["guides-and-tutorials"],"date":"2020-03-23T00:00:00.000Z","title":"入门 Serverless：如何实现 Hello World？","description":"在云计算领域，有这样一个技术被众多云厂商认为是「风口项目」，甚至可以颠覆现有云计算中的某些格局，它就是 Serverless 技术。","authorslink":["https://www.zhihu.com/people/liuyu-43-97"],"translators":null,"translatorslink":null,"tags":["Serverless","Component"],"keywords":"Serverless 全局变量组件,Serverless 单独部署组件,Serverless Component","outdated":null},"wordCount":{"words":959,"sentences":106,"paragraphs":97},"fileAbsolutePath":"/opt/build/repo/content/blog/2020-03-23-helloworld.md","fields":{"slug":"/blog/2020-03-23-helloworld/","keywords":["go","python","serverless","函数计算","云函数","Serverless","函数","Hello","serverlesscloud"]}},"nextBlog":{"id":"e1f62876-7147-577c-8c06-c2e44874c382","frontmatter":{"thumbnail":"https://img.serverlesscloud.cn/202041/1585714719322-IMG_0345.JPG","authors":["冉叶兰"],"categories":["user-stories","engineering-culture"],"date":"2020-03-18T00:00:00.000Z","title":"工程师快速成长指北","description":"随着互联网技术的发展，前端领域的从业人员越来越多，随之而来的还有工程师的成长问题。","authorslink":null,"translators":null,"translatorslink":null,"tags":["Serverless","访谈"],"keywords":"工程师的成长,前端领域的从业人员,互联网技术的发展","outdated":null},"wordCount":{"words":399,"sentences":39,"paragraphs":39},"fileAbsolutePath":"/opt/build/repo/content/blog/2020-3-18-engineer-development-guide.md","fields":{"slug":"/blog/2020-3-18-engineer-development-guide/","keywords":["serverless","Serverless","工程师","腾讯","中间件","InfoQ","Netflix","Node","团队"]}},"recommendBlogs":{"edges":[{"node":{"id":"4300b21c-7209-5256-86ff-0d38e3daec9b","frontmatter":{"thumbnail":"https://main.qcloudimg.com/raw/14f1c8eed372e76c1b139703b2f6d0fa.jpg","authors":["KieranMcCarthy"],"categories":["user-stories","engineering-culture"],"date":"2018-01-09T00:00:00.000Z","title":"我是如何在四年时间里，从厨师转行为 Serverless 应用开发者","description":"我是厨师出身，现在成为了一名 Serverless 应用开发者。","authorslink":["https://serverless.com/author/kieranmccarthy/"],"translators":["Aceyclee"],"translatorslink":["https://www.zhihu.com/people/Aceyclee"],"tags":["应用开发","Serverless"],"keywords":"Serverless 应用开发,Serverless 管理,厨师转行为 Serverless 应用开发者","outdated":null},"wordCount":{"words":285,"sentences":38,"paragraphs":36},"fileAbsolutePath":"/opt/build/repo/content/blog/2018-01-09-from-chef-to-serverless-developer-in-4-years.md","fields":{"slug":"/blog/2018-01-09-from-chef-to-serverless-developer-in-4-years/","keywords":["无服务器","无服务器开发","云函数","学习","Serverless","构建","Framework","开发者","服务器","应用","学位","简历"]}}},{"node":{"id":"713a0563-4bf9-5721-bacb-3b4ef609fe4a","frontmatter":{"thumbnail":"https://s3-us-west-2.amazonaws.com/assets.blog.serverless.com/camp-fire/camp-fire-housing-thumb.jpg","authors":["EricWyne"],"categories":["guides-and-tutorials","user-stories"],"date":"2018-12-05T00:00:00.000Z","title":"Serverless Twitter 机器人帮助为坎普山火受灾者安置住房","description":"加利福尼亚州的坎普山火致使数千人流离失所，为此，我构建了一个简单的 Serverless Twitter 机器人来帮助将受灾者安置在临时住房！","authorslink":["https://serverless.com/author/ericwyne/"],"translators":["Aceyclee"],"translatorslink":["zhihu.com/people/Aceyclee"],"tags":null,"keywords":null,"outdated":null},"wordCount":{"words":157,"sentences":26,"paragraphs":26},"fileAbsolutePath":"/opt/build/repo/content/blog/2018-12-05-serverless-twitter-camp-fire.md","fields":{"slug":"/blog/2018-12-05-serverless-twitter-camp-fire/","keywords":["serverless","无服务器","云函数","Serverless","org","住房","Twitter","函数","受灾","机器人","山火"]}}},{"node":{"id":"98602143-b837-5f50-a24f-3b1ec76044d7","frontmatter":{"thumbnail":"https://s3-us-west-2.amazonaws.com/assets.blog.serverless.com/sqquid/sqquid-serverless-thumb.jpg","authors":["RonPeled"],"categories":["user-stories"],"date":"2018-12-17T00:00:00.000Z","title":"SQQUID：100% 无服务器初创公司","description":"SQQUID 将 AWS Lambda 和无服务器框架用于其核心产品和营销网站。我们来看看一个完全无服务器的初创公司是怎样的。","authorslink":null,"translators":null,"translatorslink":null,"tags":null,"keywords":null,"outdated":null},"wordCount":{"words":266,"sentences":42,"paragraphs":42},"fileAbsolutePath":"/opt/build/repo/content/blog/2018-12-17-sqquid-one-hundred-percent-serverless.md","fields":{"slug":"/blog/2018-12-17-sqquid-one-hundred-percent-serverless/","keywords":["go","serverless","无服务器","无服务器架构","服务器","架构","Lambda","集成","FaaS","串行","系统"]}}},{"node":{"id":"29dc2e58-d2ba-56f9-aee1-d21b0bc62e0e","frontmatter":{"thumbnail":"https://s3-us-west-2.amazonaws.com/assets.blog.serverless.com/ao-com-story/ao-serverless-thumbnail.png","authors":["NickGottlieb"],"categories":["user-stories"],"date":"2019-04-24T00:00:00.000Z","title":"AO.com：逐渐转向无服务器优先","description":"AO.com 的 SCV 团队率先尝试无服务器服务。折服于无服务器框架的快速周转时间和低维护成本，整个团队逐渐转向无服务器优先。","authorslink":null,"translators":null,"translatorslink":null,"tags":null,"keywords":null,"outdated":null},"wordCount":{"words":236,"sentences":42,"paragraphs":35},"fileAbsolutePath":"/opt/build/repo/content/blog/2019-04-24-ao-serverless-first.md","fields":{"slug":"/blog/2019-04-24-ao-serverless-first/","keywords":["serverless","无服务器","服务器","团队","Lambda","功能","构建"]}}},{"node":{"id":"752d08d1-387a-5bde-acf3-98141baab294","frontmatter":{"thumbnail":"https://img.serverlesscloud.cn/2020414/1586871710979-%E5%85%AC%E5%85%B1%E7%94%A8.png","authors":["Anycodes"],"categories":["user-stories"],"date":"2019-06-20T00:00:00.000Z","title":"如何用 Serverless 为 Python 云函数打包依赖","description":"在使用无服务器云函数SCF时通常会遇到导入第三方库的问题，很多小伙伴比较头疼是：应该如何打包进去？这里，推荐几个不错的方法。","authorslink":["https://zhuanlan.zhihu.com/ServerlessGo"],"translators":null,"translatorslink":null,"tags":["云函数","Serverless"],"keywords":"Serverless,Serverless应用,无服务器云函数","outdated":null},"wordCount":{"words":81,"sentences":43,"paragraphs":43},"fileAbsolutePath":"/opt/build/repo/content/blog/2019-06-20-for-python-cloud-functions.md","fields":{"slug":"/blog/2019-06-20-for-python-cloud-functions/","keywords":["java","serverless","无服务器","无服务器云函数","云函数","serverlesscloud","安装","serverless","pillowtest"]}}},{"node":{"id":"2dc78814-9d77-555b-a1bb-ad202c8ec2d1","frontmatter":{"thumbnail":"https://s3-us-west-2.amazonaws.com/assets.blog.serverless.com/cloudforecast/thumbnail.png","authors":["FrancoisLagier"],"categories":["user-stories"],"date":"2019-08-07T00:00:00.000Z","title":"Serverless：初创企业的理想选择？（CloudForecast 案例分析）","description":"CloudForecast 是 2018 年成立的一家独立初创企业，本文将介绍他们决定选择 Serverless 的原因。","authorslink":["https://serverless.com/author/francoislagier/"],"translators":["Aceyclee"],"translatorslink":["zhihu.com/people/Aceyclee"],"tags":null,"keywords":null,"outdated":null},"wordCount":{"words":211,"sentences":29,"paragraphs":29},"fileAbsolutePath":"/opt/build/repo/content/blog/2019-08-07-serverless-for-startups.md","fields":{"slug":"/blog/2019-08-07-serverless-for-startups/","keywords":["serverless","云函数","serverless","函数","Serverless","utm","Framework","blog","CloudForecast","cloudforecast"]}}},{"node":{"id":"97450b07-658b-5207-8216-1c7b9b51b115","frontmatter":{"thumbnail":"https://img.serverlesscloud.cn/2020114/1578988490344-v2-8b2cd2c5275aa2c5a3c5083a148a7a9f_1200x500.jpg","authors":["Anycodes"],"categories":["user-stories"],"date":"2019-09-01T00:00:00.000Z","title":"如何通过 Serverless 与自然语言处理，让搜索引擎「看」到你的博客","description":"Serverless 与自然语言处理结合的一个小应用","authorslink":["https://www.zhihu.com/people/liuyu-43-97"],"translators":null,"translatorslink":null,"tags":["个人博客","serverless"],"keywords":"Serverless 自然语言处理","outdated":null},"wordCount":{"words":106,"sentences":34,"paragraphs":34},"fileAbsolutePath":"/opt/build/repo/content/blog/2019-09-01-search-engine-blog.md","fields":{"slug":"/blog/2019-09-01-search-engine-blog/","keywords":["serverless","云函数","keywords","serverlesscloud","summary"]}}},{"node":{"id":"ae4fd2f8-515c-5aec-b584-38427ef33f7e","frontmatter":{"thumbnail":"https://img.serverlesscloud.cn/2020114/1578989800047-part-00492-780.jpg","authors":["Anycodes"],"categories":["guides-and-tutorials","user-stories"],"date":"2019-09-16T00:00:00.000Z","title":"突破传统 OJ 瓶颈，「判题姬」接入云函数","description":"通过 Serverless 实现在线编程","authorslink":["https://www.zhihu.com/people/liuyu-43-97"],"translators":null,"translatorslink":null,"tags":["在线编程","云函数"],"keywords":"Serverless 在线编程,Serverless OJ","outdated":null},"wordCount":{"words":169,"sentences":30,"paragraphs":30},"fileAbsolutePath":"/opt/build/repo/content/blog/2019-09-16-online-Judge.md","fields":{"slug":"/blog/2019-09-16-online-Judge/","keywords":["python","serverless","云函数","代码","函数","serverless"]}}}],"totalCount":64}},"pageContext":{"isCreatedByStatefulCreatePages":false,"blogId":"a53da5f1-6904-5125-b2e8-1f87cc645bd6","previousBlogId":"7815ab56-0a6c-5217-9f4c-5c5759f734dd","nextBlogId":"e1f62876-7147-577c-8c06-c2e44874c382","categories":["user-stories"]}}}