プロジェクトの作成が完了しました
qq交換グループ535620886
最終効果の経験
http://dadandmother.cn/stt/このレッスンでは、ページジャンプと下部オプションについて説明します。
開発ツール：HbuilderXの
完全なコードがgithubにアップロードされましたhttps://github.com/dmhsq/image-recognition-flask-uniappbilibili
チュートリアルビデオhttps：// www .bilibili .com / video / BV1R5411H7r2 /
下部にビデオチュートリアルがあります
フロントエンドとバックエンドの書き込み、インタラクション、Baidu画像認識アクセス
Baidu画像認識アクセス
Baidu aiオープンプラットフォームhttp://ai.baidu.com/
アプリケーションを作成
し、アプリケーションリストで
これらの値を取得するためだけに個人を選択します
ドキュメントを見るhttps://cloud.baidu.com/doc/IMAGERECOGNITION/s/vk3bcxiu2ドキュメントに
よると、バックエンドを作成します
バックエンドを書く
baidu-aipを
インストールし、同じ方法でフラスコをインストールします
APIファイルを書く
パラメータの説明タイプが1の場合、動物認識は2です。植物認識画像は、画像ファイルfile.read（）を読み取った結果です。
from aip import AipImageClassify
""" 你的 APPID AK SK """
APP_ID = '你的 App ID'
API_KEY = '你的 Api Key'
SECRET_KEY = '你的 Secret Key'
client = AipImageClassify(APP_ID, API_KEY, SECRET_KEY)
def delImg(type,image):
if(type==1):
return __animal(image)
if(type==2):
return __plant(image)
""" 调用动物识别 """
def __animal(image):
return client.animalDetect(image)
""" 调用植物识别 """
def __plant(image):
return client.plantDetect(image)
フラスコプログラムを書く
from flask import Flask,request
import os,json
from md5random import sjs
from ourApi import delImg
app = Flask(__name__)
@app.route("/file",methods=['POST'])
def test():
get_image = request.files['file']
dst = sjs();
get_image.save(dst)
cont = ""
with open(dst,'rb') as file:
cont = file.read();
os.remove(dst)
return json.dumps(delImg(1,cont))
if __name__ == '__main__':
app.run(host='0.0.0.0',port=8087)
md5randomの説明：ランダムな文字列ジェネレーターです
import random
import hashlib
def sjs():
a = random.randint(0, 100)
a = "a" + str(a);
b = random.randint(100, 10000);
b = "b" + str(b);
c = hashlib.md5(a.encode(encoding='UTF-8')).hexdigest() + hashlib.md5(b.encode(encoding='UTF-8')).hexdigest();
c = "c" + str(c);
d = random.randint(10, 100);
d = "d" + str(d);
e = hashlib.md5(c.encode(encoding='UTF-8')).hexdigest() + hashlib.md5(d.encode(encoding='UTF-8')).hexdigest();
e = hashlib.md5(e.encode(encoding='UTF-8')).hexdigest()
return e;
our_appファイルを実行してサービスを開始します
フロントエンドを書く
命令は、
最初のイメージを選択し、画像をアップロードします。
Uniapp公式文書APIの
画像を選択しhttps://uniapp.dcloud.io/api/media/image?id=chooseimage
アップロードファイルhttps://uniapp.dcloud.io/ api / request / network-ファイル
imgSrc画像パス
<template>
<view class="content">
<image class="logo" :src="imgSrc" @click="goTest()"></image>
<view class="text-area">
<text class="title">{
{title}}</text>
</view>
</view>
</template>
<script>
export default {
data() {
return {
title: 'Hello',
imgSrc: '/static/logo.png'
}
},
onLoad() {
},
methods: {
goTest(){
let vm =this;
uni.chooseImage({
count: 1,
success: function (res) {
vm.imgSrc = res.tempFilePaths[0];
uni.uploadFile({
url:'http://localhost:8087/file',
filePath:res.tempFilePaths[0],
name:'file',
formData:{
'type':1
},
success:function(ress){
console.log(ress)
}
})
}
});
}
}
}
</script>
<style>
.content {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.logo {
height: 200rpx;
width: 200rpx;
margin-top: 200rpx;
margin-left: auto;
margin-right: auto;
margin-bottom: 50rpx;
}
.text-area {
display: flex;
justify-content: center;
}
.title {
font-size: 36rpx;
color: #8f8f94;
}
</style>
テスト
成功
教育ビデオ
uniapp開発チュートリアル-P3-フロントエンドとバックエンドの書き込み、インタラクション、Baidu画像認識アクセス
みなさん、こんにちは。私は「犬」であり、何千マイルも肉を食べることができるので、ソフトウェアカレッジのネットワークエンジニアリングの学生であるコードハスキーです。大学時代に学んだことをみんなと共有し、進歩していきたいです。ただし、レベルに限りがあるため、必然的にブログの間違いもありますので、抜けがありましたらお知らせください！ブログのホームページ：https：//blog.csdn.net/qq_42027681。
Tencent Cloud + Community Column https://cloud.tencent.com/developer/column/90853
未经本人允许，禁止转载
後で発売されます
フロントエンド：vueエントリvue開発アプレットなど。
バックエンド：javaエントリspringbootエントリなど。
サーバー：MySQLエントリサーバープロジェクトを実行するための簡単な手順クラウドサーバー
python：ウォームアップしないことをお勧めします。必ず
使用方法を確認してください。いくつかのプラグインなどの
大学のやり方も自分自身にあり、一生懸命勉強し、
情熱を持って若者です。プログラミングに興味がある場合は、qqグループに参加して一緒にコミュニケーションをとることができます：974178910
ご不明な点がございましたら、下にメッセージを残していただければ、よろしければ返信いたします。