移动端实现项目

版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/qq_38003892/article/details/79073657

1 引言

利用Hbuilder尽行手机app开发，有以下几点好处：
（1）已有的web项目可以很快速的改成手机app
（2）开发一次双端运行（ios，安卓）
（3）开发简单，会基本的html就能开发

2 具体实现

其实与之前写的B/S相似，手机端主要实现图片上传功能，而后台则根据上传的图片进行分类查询数据库返回结果。这里我将后台的识别结果页面整体返回（可以理解成将后台页面嵌在app中）。一下是主要部分代码实现：
（1）html部分

<form action="http://39.107.81.82:80/appupload/" method="post" enctype="multipart/form-data">
    <input type="file" class="pic" id="img" name="pic1">
    <button type="button" class="btn" id="tp">选择图片</button>
    <br />
    <div class="sub"><input type="submit" id="sub"/></div>
    <button type="button" data-loading-text="识别中" id="tt" class="btn mui-btn">识别种类</button>
</form>

（2）后台处理

def appupload(request):
    if request.method == "POST":
        f1 = request.FILES['pic1']
        # 用于识别
        fname = '%s/pic/%s' % (settings.MEDIA_ROOT, f1.name)
        with open(fname, 'wb') as pic:
            for c in f1.chunks():
                pic.write(c)
        # 用于显示
        fname1 = './static/img/%s' % f1.name
        with open(fname1, 'wb') as pic:
            for c in f1.chunks():
                pic.write(c)

        num = testcat(f1.name)
        if (num == 0):
            num = 4
        # 通过id获取猫的信息
        name = models.Catinfo.objects.get(id = num)
        return render(request, 'app.html', {'nameinfo': name.nameinfo, 'feature': name.feature, 'livemethod': name.livemethod, 'feednn': name.feednn, 'feedmethod': name.feedmethod, 'picname': f1.name})
    else:
        return HttpResponse("上传失败！")

其中app.html为识别结果详情

效果展示：