1. 開發(fā)環(huán)境準備 在開始開發(fā)微信小程序與騰訊云DeepSeek API的對接之前,我們需要做好必要的環(huán)境準備工作。本章將指導你完成開發(fā)環(huán)境的搭建,包括安裝最新版本的微信開發(fā)者工具 (IDE),配置小程序的基本信息,如果你習慣于wxml語法的開發(fā),本教程中也會有關于騰訊云AI代碼助手插件
的安裝,需要注意的是本教程對于騰訊云AI代碼助手插件
僅停留在安裝的的這一步驟,因為我還是習慣于uniapp 的使用。 讓我們按照以下步驟,一步步完成開發(fā)環(huán)境的準備工作。
系統(tǒng)架構 1.1 微信開發(fā)者工具安裝 注意:第一次使用微信開發(fā)者工具 時,第一步并不是下載微信開發(fā)者工具哦! 而是前往小程序后臺 , 進行注冊并完成小程序開發(fā) 者認證,這一內容本篇不會詳細講解。
關于:微信開發(fā)者工具 , 我們需要點鏈接選擇符合自己電腦版本的ide 進行下載
下載完成之后按照提示進行安裝即可
當開發(fā)工具安裝完成之后, 我們首先創(chuàng)建一個空的項目模板 如下圖所示
1.2 騰訊云AI代碼助手配置 騰訊云AI代碼助手現(xiàn)已完全集成到微信開發(fā)者工具中,配置過程變得更加簡便。具體步驟如下:
如上圖所示三步幫你安裝騰訊云AI 代碼助手
點擊圖中所示的 1
(擴展)。 在2
(輸入框)中輸入騰訊云
即可 點擊 3
(安裝) ,等待安裝完成之后我們就可以體驗啦 如下所示,騰訊AI代碼助手目前已整合了tencent-deepseek R1
模型。 開發(fā)者可以盡情的體驗tencent-deepseek R1
模型帶來的便捷開發(fā)體驗了嘍~~
1.3 文案生成流程 2. 小程序界面設計 溫馨提示:由于本人習慣于uniapp 項目的開發(fā) 因此本項目使用的是uniapp 來打包運行我們的小程序項目
UI界面如下圖所示:
2.1 搭建基礎UI界面 我們的UI界面設計簡潔,主要包含以下四個核心組件:
關鍵詞輸入?yún)^(qū):用戶通過輸入關鍵詞,來覺得接下來文案的主要風格。 類型選擇區(qū): 用戶通過選擇公眾號
,小紅書
等類型,來覺得文案生成的類型。 結果展示區(qū):用于展示騰訊云DeepSeek API 返回的結果。 運行效果圖如下
3. 騰訊云DeepSeek API集成 下面是騰訊云DeepSeek API 最新計費標準, 注意自己的token使用哦!
?? 騰訊云DeepSeek API 最新計費標準
?? 生效時間 :2025年2月26日 0時起
DeepSeek 模型價格表
| 模型類型 | 輸入價格 | 輸出價格 |
|:--------:|:--------:|:--------:|
| DeepSeek-R1 | 0.004元/千token | 0.016元/千token |
| DeepSeek-V3 | 0.002元/千token | 0.008元/千token |?? 詳細文檔 :騰訊云DeepSeek API調用指南
3.1 API接入配置 關于 DeepSeek API 接口 的相關文檔可以點擊鏈接進行查看, 接下來我們將逐步實現(xiàn)如和配置 騰訊云DeepSeek 為我們接下來的開發(fā)作準備
創(chuàng)建API KEY API 使用前提是需要用于一個API KEY ,訪問地址 來創(chuàng)建我們的API KEY 如下圖所示, 點擊按鈕 創(chuàng)建API KEY
即可, 點擊查看時可以看到已經(jīng)創(chuàng)建的 API KEY
編寫py代碼 進行本地請求 我這里用的是Flask
框架,為我們小程序調用DeepSeek API提供接口服務,代碼如下:
代碼語言:python
代碼運行次數(shù):10
import os
import logging
from flask import Flask, request, jsonify
from flask_cors import CORS
from openai import OpenAI
from typing import Dict, Any
# 初始化Flask應用
app = Flask(__name__)
CORS(app) # 啟用跨域支持
# 配置日志記錄
logging.basicConfig(level=logging.INFO)
logger = logging.getLogger(__name__)
# 環(huán)境變量配置
OPENAI_CONFIG = {
"api_key": os.getenv("OPENAI_API_KEY", "sk-pXLyNnk8bdl8zkmFkBIi7KBRiaLTATlmGsr8QfTwek7Zawfk"),
"base_url": os.getenv("OPENAI_BASE_URL", "https://api.lkeap.cloud.tencent.com/v1")
}
# 初始化OpenAI客戶端
client = OpenAI(**OPENAI_CONFIG)
def validate_request(data: Dict[str, Any]) -> tuple:
"""請求參數(shù)驗證"""
if not data.get('content'):
logger.warning("Missing content parameter")
return False, "Content parameter is required"
if len(data['content']) > 1000:
logger.warning("Content length exceeds limit")
return False, "Content exceeds maximum length of 1000 characters"
return True, ""
def process_stream_response(stream) -> dict:
"""處理流式響應數(shù)據(jù)"""
result = {"reasoning_content": "", "answer_content": ""}
for chunk in stream:
if not chunk.choices:
continue
delta = chunk.choices[0].delta
# 使用getattr安全獲取屬性
if reasoning := getattr(delta, 'reasoningcontent', None):
result["reasoning_content"] += reasoning
if content := getattr(delta, 'content', None):
result["answer_content"] += content
return result
@app.route('/deepseekapi', methods=['POST'])
def generate_content():
"""
處理生成請求
---
parameters:
- name: body
in: body
required: true
schema:
type: object
properties:
content:
type: string
responses:
200:
description: 生成結果
400:
description: 無效請求
500:
description: 服務器錯誤
"""
# 請求驗證
data = request.get_json()
print(data)
is_valid, message = validate_request(data)
if not is_valid:
return jsonify({"error": message}), 400
try:
# 創(chuàng)建流式請求
stream = client.chat.completions.create(
model="deepseek-r1",
messages=[{"role": "user", "content": data['content']}],
stream=True,
temperature=0.7, # 添加生成參數(shù)
max_tokens=1000
)
# 處理流式響應
processed_data = process_stream_response(stream)
# 結果后處理
processed_data["answer_content"] = processed_data["answer_content"].strip()
return jsonify(processed_data)
except Exception as e:
logger.error(f"API請求失敗: {str(e)}", exc_info=True)
return jsonify({"error": "服務暫時不可用,請稍后再試"}), 500
if __name__ == "__main__":
app.run(
host=os.getenv("FLASK_HOST", "0.0.0.0"),
port=int(os.getenv("FLASK_PORT", 5001)),
debug=os.getenv("FLASK_DEBUG", "false").lower() == "true"
)
驗證 我們的Flask
框架暴露出來的請求信息如下:
curl --location --request POST 'http://192.168.31.134:5001/deepseekapi' --header 'User-Agent: Apifox/1.0.0 (https://)' --header 'Content-Type: application/json' --header 'Accept: */*' --header 'Host: 192.168.31.134:5001' --header 'Connection: keep-alive' --data-raw '{
content: "請根據(jù)以下內容生成500字小紅書種草文案:?關鍵詞:三亞,海邊,游泳,拍照?"
}'
我么通過postman 來測試其連通性,如下圖所示
運行服務
postman 數(shù)據(jù)返回
postman 接口配置示例
我們輸入的content
內容是:請根據(jù)以下內容生成500字小紅書種草文案:?關鍵詞:三亞,海邊,游泳,拍照?
, 發(fā)送請求查看結果
此時我們的DeepSeek接口的本地調用就已經(jīng)完成了。
整體來說整個過程還是蠻絲滑的, 接下來我們分析一下 如和實現(xiàn)小程序的對接。
4. 小程序代碼實現(xiàn) ui 代碼層
<template>
<view class="content">
<!-- <view class="upload-section">
<uv-upload
:fileList="fileList"
@afterRead="afterRead"
@delete="deletePic"
:maxCount="1"
name="1"
></uv-upload>
</view> -->
<view class="txtArea">
<uv-textarea
v-model="textArea"
placeholder="請輸入關鍵詞,以逗號隔開"
:height="150"
:border="'surround'"
:count="true"
:maxlength="500"
></uv-textarea>
</view>
<view class="type-section">
<uv-radio-group
v-model="typeValue"
placement="row"
@change="handleChangeType"
:wrap="false"
>
<uv-radio
v-for="(item, index) in typeOptions"
:key="index"
:name="item.value"
:label="item.text"
></uv-radio>
</uv-radio-group>
</view>
<view class="button-section">
<uv-button
type="primary"
text="開始生成"
@click="startGenerate"
></uv-button>
<uv-button type="info" text="重置" @click="resetForm"></uv-button>
</view>
<view class="result-section">
<uv-loading-icon
v-if="loading"
text="文案生成中..."
mode="circle"
size="28"
></uv-loading-icon>
<uv-text v-if="resultText" :text="resultText"></uv-text>
</view>
</view>
</template>
tip:
關于注釋地方會在最下面的附錄項進行講解說明
接口調用方法
startGenerate() {
// 1. 判斷用戶是否上傳圖片或輸入關鍵詞
if (!this.textArea) {
uni.showToast({
title: "請輸入關鍵詞",
icon: "none",
});
return;
}
// 2. 配置prompt提示詞
let prompt = `請根據(jù)以下內容生成500字${this.typeText}文案:\n`;
// 添加關鍵詞內容
if (this.textArea) {
prompt += `關鍵詞:${this.textArea}\n`;
}
// 添加圖片信息
// if (this.fileList.length > 0) {
// prompt += `${this.fileList[0].url}\n`;
// }
// 3. 設置加載狀態(tài)
this.loading = true;
// 4. 接口調用
request({
url: "/deepseekapi",
method: "POST",
data: {
content: prompt,
},
})
.then((res) => {
console.log("生成成功:", res);
this.loading = false;
this.resultText =
res.answer_content || "文案生成失敗,請稍后重試...";
})
.catch((err) => {
console.error("生成失敗:", err);
this.loading = false;
});
},
此處我們主要實現(xiàn)的事對于提示詞的拼接,然后進行接口的調用, 需要注意的是 ,我進行的提示詞拼接可能并不是最完美的, 具體應用到業(yè)務層時還需要微調哦!!
效果演示 如下圖所示:
附錄 該小程序其實最初的設計是有個圖片識別功能, 通過識別圖片來生成對應的文案, 但是目前如果僅使用騰訊云DeepSeek API
是無法實現(xiàn)該功能的,需要結合 大模型知識引擎
中的圖片對話或文件對話(實時文檔解析+對話) 的接口,通過識別圖片內容之后再次調用騰訊云DeepSeek API
來獲取對應的文案。
總結 通過本教程,開發(fā)者可以快速搭建一個基于騰訊云DeepSeek API的文案生成小程序,為內容創(chuàng)作提供AI助手支持。后續(xù)還可以擴展更多功能,如圖片識別等高級特性,進一步提升應用的實用性。
[uniapp](https:///qq_33681891/txDeepseek)
源碼訪問地址