游乐游手机版
首页/AI教程/文章详情

分钟搭建阿里云函数计算OCR智能识别小程序

时间：2026-06-16 15:53
基于阿里云函数计算与支付宝小程序，构建了一套轻量级、可扩展的云端OCR识别工具。通过函数计算的事件驱动机制，实现图片上传、OCR文字识别及结果存储，支持按需伸缩与弹性运行，简化后端开发与运维。

借助支付宝小程序与函数计算的深度融合，只需十分钟即可搭建一个轻量级、可弹性扩展的云端OCR识别工具。听起来很有吸引力？接下来，逐步拆解整个实现流程。

背景介绍

小程序生态兴起后，轻量级应用开发成为众多开发者关注的焦点。同时，后端Serverless化的优势日益凸显——两者结合，能够快速构建高可用、具备弹性伸缩能力的小程序。本教程的目标明确：让函数计算初学者也能迅速上手，并切实感受到函数计算带来的便捷与效率。那么，开始动手实践吧。

关于函数计算
阿里云函数计算是一款事件驱动的全托管计算服务。你无需管理服务器等基础设施，只需编写代码并上传，函数计算便会自动准备计算资源，以弹性、可靠的方式运行代码。再加上函数计算与云端服务的无缝集成能力，开发者用少量代码即可串联多个服务，完成复杂功能，效率提升显著。

采用函数计算作为小程序后端，优势直观：

  • 开发与部署更高效：只需聚焦业务逻辑，仅需实现业务逻辑本身。
  • 应用稳定性与可用性更强：函数计算提供弹性、可靠的计算资源，具备根据流量自动伸缩的能力。
  • 节省系统资源：Serverless与云服务器的核心区别在于——云服务器需持续运行，而函数计算按需执行。即仅在有请求时运行函数，无请求时完全不消耗资源。

应用架构

fc_ocr_flow

整体流程如下：小程序客户端上传图片，通过HTTP trigger触发upload_ocr_image函数，该函数将文件上传至OSS；OSS存入新图片后，触发process_image函数，函数读取图片并调用OCR API进行文字识别与提取；最后将识别结果存储回OSS。小程序客户端再请求识别结果，通过HTTP trigger触发get_ocr_result函数，获取最终结果。

开发步骤

1. 开发准备

  • 在阿里云控制台获取SecretId和SecretKey。
  • 开通函数计算服务，熟悉基本功能。
  • 开启OSS服务，创建两个bucket：一个用于存储上传的图片，另一个用于存储识别结果（本demo需要两个bucket）。
  • 开通OCR服务（提供免费试用次数：通用类图片文字识别），获取appcode和服务url，后续配置时会用到。
  • 在支付宝小程序开发平台，按示例创建应用：体验小程序Demo。

2. 编写函数

编写HTTP请求函数

函数计算可直接使用HTTP trigger触发，从而快速编写任意接口。这里需要两个接口：一个用于图片上传，另一个用于获取OCR结果。

图片上传接口的代码：

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']

获取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']

编写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

3. 编写支付宝小程序

在OCR识别代码中，和分别对应upload_ocr_image和get_ocr_result两个函数的触发地址（可在函数控制台查看）。以下是小程序的核心代码片段：

// 选择并上传图片
attach() {
    my.chooseImage({
        chooseImage: 1,
        success: res => {
            const path = res.apFilePaths[0];
            console.log(path)
            var key = path
            my.uploadFile({
                url: '',
                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: '',
                        method: 'POST',
                        data: {key: resKey},
                        dataType: 'json',
                        success: function(Res) {
                            my.alert({ content: 'Get OCR Result = ' + Res.data});
                        },
                        fail: function(Res) {
                            my.alert({content: 'get ocr result fail:' + Res.errorMessage});
                        }
                    });
                },
            });
        },
    });
},

4. 部署函数

使用Fun工具部署函数。需编写函数部署的YAML文件，更多模板文件编写信息可参考Serverless Application Model。以下是YAML配置：

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']

请务必替换cloud_func_ocr.py代码中<>内的内容为你自己的实际配置。然后在代码目录下运行命令$ fun deploy，即可一键部署函数。

5. 测试

运行小程序模拟器，上传一张图片，便能看到OCR识别结果。

img2

总结

尽管本示例较为简单，但已充分展示了支付宝小程序与函数计算结合的典型模式。通过简洁的开发步骤，即可快速构建弹性、高可用的云端小程序。当然，这仅是冰山一角，更多富有想象力的应用场景正等待你去探索。

来源：https://developer.aliyun.com/article/704745
小程序
上一篇云周刊221期2019高考加油全国新增AI院校盘点 下一篇CentOS官方Docker镜像安装SSHD服务
本站内容用于信息整理与展示，如有侵权或内容问题请及时联系处理。

相关推荐

补充同频道和同主题内容，方便继续浏览更多相关内容。

支付宝小程序玩转系列教程第5期 支付宝小程序刷脸认证示例教程 个人全栈开发实战通过口述编程完成外包小程序项目 AI文档助手小程序高效释放你的办公潜力 小程序打开背后的运行全生命周期管理机制 团队将H5替换为小程序容器解耦APP端云一体跨端混合开发 小程序本地存储实现方法

同类最新

继续查看同栏目最近更新的文章。

更多
Windows Docker Desktop RabbitMQ生产级部署完整指南
AI教程 · 2026-06-29

Windows Docker Desktop RabbitMQ生产级部署完整指南

前言 在 Windows 本地开发环境中，直接安装 RabbitMQ 确实颇为周折：需要单独配置 Erlang 运行环境、手动管理环境变量、服务启停全凭手工操作。更令人困扰的是，版本兼容冲突、端口占用、环境不一致等问题层出不穷。笔者见过不少开发者为搭建环境就得耗费整整半天时间。 相比之下，借助 Do

 AI搜索重构制造业采购逻辑的阿里云企业级GEOCMS优化实践
AI教程 · 2026-06-29

AI搜索重构制造业采购逻辑的阿里云企业级GEOCMS优化实践

先分享一个切实感受。过去两年，我们与福建制造企业合作较为频繁，发现一个非常突出的现象：超过80%的企业官网，产品参数仍然存放在PDF或图片中。AI爬虫？根本无法抓取。这些企业技术实力不弱、资质证照齐全、应用案例也丰富，但在AI搜索这一全新战场上，它们几乎处于隐身状态。 一、一个正在发生的行业变化 A

 阿里云Token Plan团队版功能价格与省钱购买指南
AI教程 · 2026-06-29

阿里云Token Plan团队版功能价格与省钱购买指南

阿里云百炼近期推出了名为“Token Plan 团队版”的全新服务，这一服务专为企业与开发者量身打造，定位为AI大模型订阅平台。通过引入Credits作为统一计量单位，将文本生成、图像生成等多模态AI能力纳入单一计费体系，同时无缝兼容主流AI编程工具及智能体（Agent）生态系统。其核心亮点包括：全

 阿里云物联网.NET Core客户端位置信息上报
AI教程 · 2026-06-29

阿里云物联网.NET Core客户端位置信息上报

阿里云物联网平台的位置服务并非一个完全独立的功能模块。位置信息可包含二维坐标与三维坐标，而位置数据的来源本质上是借助设备属性进行上传。换言之，若要让设备上报位置，您需先将其视为一个普通属性进行处理。 1）添加二维位置数据 操作过程十分简洁。进入数据分析 → 空间数据可视化 → 二维数据，点击添加，将

 年阿里云服务器选型配置与网站部署全攻略
AI教程 · 2026-06-29

年阿里云服务器选型配置与网站部署全攻略

2026年，阿里云服务器生态已高度成熟，形成了清晰的轻量应用服务器与ECS云服务器两大产品阵营。无论你是计划搭建个人博客、企业官网，还是运营电商平台、进行应用开发，基本都能找到理想的解决方案。本指南将从服务器选型、配置选择、部署流程到安全运维，系统梳理2026年最实用的操作要点，帮助你少走弯路，让网