10分钟-使用阿里云函数计算构建你的OCR智能识别云端小程序

本文涉及的产品
函数计算FC,每月15万CU 3个月
Serverless 应用引擎免费试用套餐包,4320000 CU,有效期3个月
简介: 本文介绍使用支付宝小程序与函数计算的完成OCR光学字符识别的例子,十分钟快速开发一个轻量级可扩展云端小程序

本文介绍使用支付宝小程序与函数计算的完成OCR光学字符识别的例子,十分钟快速开发一个轻量级可扩展云端小程序

背景介绍

随着小程序的普遍流行,轻量级的应用开发越来越受到开发者们的关注,与此同时随着后端技术的Serverless化的优点逐渐明显,二者结合能快速构建高可用弹性的小程序;通过本教程,可让函数计算小白能快速入门开发实战,体验到函数计算给开发带来的便捷性和优越性,那就快点来动手构建起你的函数吧~

  • 函数计算

    • 阿里云函数计算是事件驱动的全托管计算服务,无需管理服务器等基础设施,只需编写代码并上传,函数计算会为您准备好计算资源,以弹性、可靠的方式运行您的代码
    • 借助函数计算和其他云端服务的集成,开发者只需要编写少量代码就可以串联多个服务完成复杂的功能,大大提高开发效率
  • 使用函数计算作为小程序后端实现,具有以下优点

    • 开发部署过程更简单:开发者们只需要关注业务逻辑本身,也只需要实现业务逻辑本身,
    • 应用稳定性可用性更高:函数计算为用户准备弹性、可靠的计算资源,具有根据流量自动scale特性
    • 节省系统资源:函数计算的 Serverless 与云服务器最大的不同之处在于,云服务器需要一直运行,而函数计算是按需计算。按需计算就意味着,在请求到来的时候,才运行函数,没有请求的时候,不耗费资源
  • 应用结构:

fc_ocr_flow

  1. 在小程序客户端上传图片,http trigger触发upload_ocr_image函数,函数接收文件上传到OSS
  2. OSS存入新图片,将触发process_image函数,读取新加入的图片,并调用Vision API进行字符识别和提取
  3. 将识别结果存储回OSS
  4. 小程序客户端请求识别结果,http trigger触发get_ocr_result函数,得到结果

开发步骤

1. 开发准备

2. 编写函数

  • 编写http请求函数:

    • 函数计算可以直接使用HTTP trigger触发,你可以快速编写任何接口,这里我们需要一个图片上传的接口:
    def upload_ocr_image(environ, start_response):
        '''
        upload ocr image function triggered by http request
        '''
        try:
            content = cgi.FieldStorage(fp=environ['wsgi.input'], environ=environ, keep_blank_values=True)
            for key in content.keys():
                image_binary = content.getvalue(key)
                auth = oss2.Auth(secret_id, secret_key)
                bucket = oss2.Bucket(auth, oss_endpoint, ocr_image_bucket)
                bucket.put_object(key, image_binary)
            status = '200 OK'
            response_headers = [('Content-type', 'text/plain')]
            start_response(status, response_headers)
            return ['upload image success']
        except (ValueError):
            return ['upload_ocr_image failed']
    
    
    AI 代码解读
    • 和一个请求图片OCR结果的函数:
def get_ocr_result(environ, start_response):
    '''
    get ocr result function triggered by http request
    '''
    try:
        request_body_size = int(environ.get('CONTENT_LENGTH', 0))
        request_body = environ['wsgi.input'].read(request_body_size)
        res_json = json.loads(request_body)
        auth = oss2.Auth(secret_id, secret_key)
        bucket = oss2.Bucket(auth, oss_endpoint, ocr_text_bucket)
        ocr_res = bucket.get_object(str(res_json['key'])).read()
        status = '200 OK'
        response_headers = [('Content-type', 'text/plain')]
        start_response(status, response_headers)
        return [str(ocr_res).encode('utf8')]
    except (ValueError):
        return ['get_ocr_result failed']
AI 代码解读
  • 编写OCR处理函数:

    • 使用OSS trigger,当有图片上传的时候触发OCR函数:
    def process_image(event, context):
         '''
         process image function triggered by OSS when a image file is uploaded
         '''
         evt = json.loads(event)
         evt = evt['events'][0]
         bucket_name = evt['oss']['bucket']['name']
         endpoint = 'oss-' +  evt['region'] + '.aliyuncs.com'
         obj_key = evt['oss']['object']['key']
         logger.info('New image uploaded: '  + str(obj_key))
         creds = context.credentials
         auth = oss2.StsAuth(creds.access_key_id, creds.access_key_secret, creds.security_token)
         bucket = oss2.Bucket(auth, endpoint, bucket_name)
         image_data = bucket.get_object(obj_key).read()
         detect_word_list = detect_text(image_data)
         text_bucket = oss2.Bucket(auth, endpoint, ocr_text_bucket)
         text_bucket.put_object(obj_key + '_ocr.txt', ' '.join(detect_word_list).encode(encoding='UTF8'))
         return 'Processed image file success, text can be seen in the text bucket'
     
     def detect_text(image_data):
         '''
         请求阿里云OCR Api
         '''
         encoded_image = base64.b64encode(image_data)
         detect_word_list = text_detect_api(encoded_image)
         logger.info("Detect word list : " + ' '.join(detect_word_list))
         return detect_word_list
    
     def text_detect_api(encodestr):
         method = 'POST'
         bodys = {}
         bodys['img'] = encodestr
         bodys['prob'] = 'false'
         bodys['charInfo'] = 'false'
         bodys['rotate'] = 'false'
         bodys['table'] = 'false'
         post_data = json.dumps(bodys).encode(encoding='UTF8')
         request = urllib2.Request(ocr_api_url, post_data)
         request.add_header('Authorization', 'APPCODE ' + ocr_api_appcode)
         request.add_header('Content-Type', 'application/json; charset=UTF-8')
         ctx = ssl.create_default_context()
         ctx.check_hostname = False
         ctx.verify_mode = ssl.CERT_NONE
         response = urllib2.urlopen(request, context=ctx)
         content = response.read()
         logger.info("text detection res: " + str(content))
         word_list = []
         words_info = json.loads(content)['prism_wordsInfo']
         for info in words_info:
             word_list.append(info['word'].encode('utf8'))
         return word_list
    AI 代码解读

3. 编写支付宝小程序

OCR识别的代码:其中<upload-image-endpoint><get-result-endpoint>分别为upload_ocr_imageget_ocr_result两个函数的触发地址,可以在函数控制台查看;
此处只展示小程序主要代码:

// 选择并上传图片
  attach() {
    my.chooseImage({
      chooseImage: 1,
      success: res => {
        const path = res.apFilePaths[0];
        console.log(path)
        var key = path
        my.uploadFile({
          url: '<upload-image-endpoint>',
          fileType: 'image',
          fileName: key,
          filePath: path,
          success: (ret) => {
            var start=new Date().getTime();
            var n = 2000
            while(true) {
              if(new Date().getTime()- start > n) break;
            }
            var resKey = key + '_ocr.txt'
            my.request({
                url: '<get-result-endpoint>',
                method: 'POST',
                data: {
                  key: resKey
                },
                dataType: 'json',
                success: function(Res) {
                  my.alert({ content: 'Get OCR Result = \n' + Res.data});
                },
                fail: function(Res) {
                  my.alert({content: 'get ocr result fail:' + Res.errorMessage});
                }
            });
          },
        });
      },
    });
  },
AI 代码解读

4. 部署函数

ROSTemplateFormatVersion: '2015-09-01'
Transform: 'Aliyun::Serverless-2018-04-03'
Resources:
test:
    Type: 'Aliyun::Serverless::Service'
    Properties:
    Policies:
        - AliyunOSSFullAccess # Managed Policy
        - AliyunLogFullAccess # Managed Policy
    LogConfig:
        Project: func-func-log
        Logstore: func-test

    ocr_extract:
    Type: 'Aliyun::Serverless::Function'
    Properties:
        Handler: cloud_func_ocr.process_image
        Runtime: python2.7
        Timeout: 60
        MemorySize: 512
        CodeUri: './'

    upload_image:
    Type: 'Aliyun::Serverless::Function'
    Properties:
        Handler: cloud_func_ocr.upload_ocr_image
        Runtime: python2.7
        Timeout: 60
        MemorySize: 512
        CodeUri: './'
    Events:
        http-trigger:
        Type: HTTP
        Properties:
            AuthType: ANONYMOUS
            Methods: ['GET', 'POST', 'PUT']
    
    get_ocr_result:
    Type: 'Aliyun::Serverless::Function'
    Properties:
        Handler: cloud_func_ocr.get_ocr_result
        Runtime: python2.7
        Timeout: 60
        MemorySize: 512
        CodeUri: './'
    Events:
        http-trigger:
        Type: HTTP
        Properties:
            AuthType: ANONYMOUS
            Methods: ['GET', 'POST', 'PUT']
AI 代码解读
  • 更改配置:替换cloud_func_ocr.py代码中的<>中的内容为你自己的相关配置
  • 进入代码所在目录,命令行运行$ fun deploy ,一键部署你的函数!

5. 测试

运行小程序模拟器,可以上传一张图片,得到OCR识别结果

img2

总结

本文介绍了支付宝小程序和函数计算结合的一个简单的案例,通过简单的开发步骤,能够快速构建弹性高可用的云端小程序来;当然本案例介绍的例子很简单,更多的可能性还等待着你们来探索!

更多函数计算开发相关问题,可以直接加入钉钉群咨询:
Screen_Shot_2019_06_07_at_1_47_38_PM

相关实践学习
【文生图】一键部署Stable Diffusion基于函数计算
本实验教你如何在函数计算FC上从零开始部署Stable Diffusion来进行AI绘画创作,开启AIGC盲盒。函数计算提供一定的免费额度供用户使用。本实验答疑钉钉群:29290019867
建立 Serverless 思维
本课程包括: Serverless 应用引擎的概念, 为开发者带来的实际价值, 以及让您了解常见的 Serverless 架构模式
丛霄
+关注
目录
打赏
0
0
0
3
39
分享
相关文章
亚太唯一!阿里云Serverless计算产品进入Forrester领导者象限
近日,Forrester发布《Serverless Development Platforms, Q2 2025》报告,阿里云函数计算FC与Serverless应用引擎SAE在21项评测中斩获9项最高分,成为国内唯一进入领导者象限的科技公司。
一体系数据平台的进化:基于阿里云 EMR Serverless Spark 的持续演进
本文介绍了一体系汽配供应链平台如何借助阿里云EMR Serverless Spark实现从传统Hadoop平台向云原生架构的迁移。通过融合高质量零部件供应与创新互联网科技,一体系利用EMR Serverless Spark和DataWorks构建高效数据分析体系,解决大规模数据处理瓶颈。方案涵盖实时数据集成、Lakehouse搭建、数仓分层设计及BI/ML应用支持,显著提升数据处理性能与业务响应速度,降低运维成本,为数字化转型奠定基础。最终实现研发效率提升、运维压力减轻,并推动AI技术深度整合,迈向智能化云原生数据平台。
亚太唯一,阿里云Serverless计算产品进入Forrester领导者象限
Forrester发布Serverless开发平台评估报告《Forrester Wave™: Serverless Development Platforms, Q2 2025》:在21项测评中,阿里云函数计算FC和Serverless应用引擎SAE的产品能力拿到了9项最高分。阿里云成功进入领导者象限,是国内唯一进入该象限的科技公司。
Fusion 引擎赋能:流利说如何用阿里云 Serverless Spark 实现数仓计算加速
本文介绍了流利说与阿里云合作,利用EMR Serverless Spark优化数据处理的全过程。流利说是科技驱动的教育公司,通过AI技术提升用户英语水平。原有架构存在资源管理、成本和性能等痛点,采用EMR Serverless Spark后,实现弹性资源管理、按需计费及性能优化。方案涵盖数据采集、存储、计算到查询的完整能力,支持多种接入方式与高效调度。迁移后任务耗时减少40%,失败率降低80%,成本下降30%。未来将深化合作,探索更多行业解决方案。
阿里云 Serverless 助力海牙湾构建弹性、高效、智能的 AI 数字化平台
海牙湾(G-Town)是一家以“供应链+场景+技术+AI”为核心驱动力的科技公司,致力于为各行业提供数字化转型解决方案。通过采用阿里云Serverless架构,解决了弹性能力不足、资源浪费与运维低效的问题。SAE全托管特性降低了技术复杂度,并计划进一步探索Serverless与AI结合,推动智能数字化发展。海牙湾业务覆盖金融、美妆、能源等领域,与多家知名企业建立战略合作,持续优化用户体验和供应链决策能力,保障信息安全并创造可量化的商业价值。未来,公司将深化云原生技术应用,助力更多行业实现高效数字化转型。
259 19
印刷文字识别使用问题之是否支持识别并返回文字在图片中的位置信息
印刷文字识别产品,通常称为OCR(Optical Character Recognition)技术,是一种将图像中的印刷或手写文字转换为机器编码文本的过程。这项技术广泛应用于多个行业和场景中,显著提升文档处理、信息提取和数据录入的效率。以下是印刷文字识别产品的一些典型使用合集。
印刷文字识别使用问题之如何数电发票进行识别
印刷文字识别产品,通常称为OCR(Optical Character Recognition)技术,是一种将图像中的印刷或手写文字转换为机器编码文本的过程。这项技术广泛应用于多个行业和场景中,显著提升文档处理、信息提取和数据录入的效率。以下是印刷文字识别产品的一些典型使用合集。
印刷文字识别使用问题之如何识别礼品册上的卡号、密码信息
印刷文字识别产品,通常称为OCR(Optical Character Recognition)技术,是一种将图像中的印刷或手写文字转换为机器编码文本的过程。这项技术广泛应用于多个行业和场景中,显著提升文档处理、信息提取和数据录入的效率。以下是印刷文字识别产品的一些典型使用合集。

相关产品

  • 函数计算
  • AI助理

    你好,我是AI助理

    可以解答问题、推荐解决方案等

    登录插画

    登录以查看您的控制台资源

    管理云资源
    状态一览
    快捷访问