day18-Trae开发微信小程序03

今日内容

0 回顾项目架构流程

如果同学想上线到服务器----》要看四期第二十天即可

image-20260312201124826

# 1 目前 Django后端已经写完--》没测试，可能有bug
	1.1 写了一堆接口，给小程序用
    	-注册接口--》操作数据库--》地址，端口，用户名，密码--》都是正确的
        -登陆接口
        -换脸接口
        -查询历史接口
        
    1.2 后台管理：浏览器打开--》可以看到所有用户的信息，所有用户的换脸
    	-运营使用：封某个用户账号
    1.3 换脸接口--》后端会调用Coze换脸工作流--》Trea写完后就可以用了
    	-工作流id，密钥
    
# 2 微信小程序端：只是创建了项目，还没让Trae写
	2.1 Trae写微信小程序代码--》可能有bug
    2.2 微信开发者工具看代码--》看运行才能找到bug
    2.3 找到bug，继续使用Trae修复
    
    
# 3 Trae能不能继续开发已经有的项目？
	-我们之前的案例是：Trae从0到1把后端写完
    -微信小程序项目，纯净项目--》相当于写了一些代码了，不是0了--》是0.1了
    -让Trae帮我们从0.1，写成1

1 一键换脸小程序后端处理

1.1 运行后端django项目

# 1 进入到后台管理看看

# 方式一：大家可以不用：需要敲命令，简单一些，不需要跟Trae交互
	-cd 后端项目目录下：
    -cd change_face_api
	-python manage.py runserver
# 方式二：大家可以用，直接让Trae帮我们启动--》最终一定会帮我们启动起来，可能需要等
	-直接在Trae中写提示词：
    	-帮我启动开发服务器
        -帮我启动Django后端
        -帮我启动一键换脸程序后端

1.2 Trae写完后，有bug

# 无论什么bug，通过提示词，继续交互，最终完成
帮我修复 xx 问题
帮我检查[后端文件夹]项目，有什么问题，帮我修复并启动

1.3 trae和claude和cursor

# 1 Trae 免费---》用了国产代码大模型--》代码质量没有那么强
	-国内只能用国产的
    -国外的，在国内访问不到【FQ可以范围啊？FQ违法，Trae不可能违法让你弄】
    -需要交互3,5次，等时间--》才能代码写好
    
# 2 claude和cursor--》用的大模型
	-claude
    -谷歌的
    -------目前全球最强的两个代码大模型---写的代码质量高--》收费20美刀一个月---
    好处，交互1,2次，就能把代码完全写好
    
    
# 3 如果我们使用Trae，能不能用claude？
	-其实可以，需要购买

image-20260312204517482

1.4 创建超级管理员账号

# 能够登陆到后台的
帮我创建一个超级管理员账号，用户名:lqz，密码:123456

1.5 后端还有错误，继续让Trae修复

# 1 输入提示词

打开后台管理，报错：OperationalError at /admin/face_swap/faceswaphistory/
no such table: face_swap_faceswaphistory
Request Method:	GET
Request URL:	http://127.0.0.1:8000/admin/face_swap/faceswaphistory/
            
# 2 把问题越精准告诉Trae，它改的越快

# 3 即便不精准，最终也能改完

image-20260312205306349

image-20260312205330942

1.6 最后

# 1 我们随便操作，发现有错误，就让Trae修复，最终发现不了了，就认为修复完成了--》继续后续操作即可
	-真的修复完了吗？可能我们没发现！---》不重要--》后续做联调，可能还会发现问题--》继续让Trae修复即可
    
    
# 2 就把Trae当成，你雇了一个程序员，我们不懂代码，我们不管过程如何，只需要用 提示词--》跟Trae交互--》最终只要交付给我们结果--》即可
	-你发现登陆有问题--》让程序员修改bug
    -程序员改完--》会不会导致注册功能出bug？--》可能的--》正常开发也可能
    -我们不需要关注--》只要发现问题--》让他继续改
    -### 只需要：最终只要交付给我们结果

2 一键换脸小程序微信端开发

# 1 我们之前已经创建好基本项目了
	-建议：后期按照我的流程来
    	使用微信开发者工具创建出纯净项目后--》让Trae继续开发
        我们先创建一个能运行的微信小程序--》在能运行的基础上继续让Trea写代码--》写完--》也能运行
        
    -不要：让Trae从0开始开发---》Trae不知道我们的 开发者id
    	这样开发出来的是不能用的微信开发者工具打开运行的

2.1 使用Trae帮我们开发微信小程序端

根据项目需求： 和项目小程序架构文档： 和UI设计图:  生成智能换脸小程序端代码
要求：
1.我已经创建了小程序： ，你在这个基础上继续编写，无效的文件和文件夹帮我删除。
2.根据需求帮编写完小程序端代码。
3.接口参考后端项目： ，注意接口返回格式，并正常测试通过，前后端调通。
4.后端链接地址为：http://127.0.0.1:8000。
5.小程序不使用Skyline 渲染模式。
6.小程序用户未登录，显示登录页面，登录成功进入首页。

2.2 如果有bug

# 1 bug 修复流程，跟后端修复无异
	-发现了什么bug，修复什么bug
    
# 2 如何发现问题？
	使用微信开发者工具--》看页面

image-20260312212717520

3 前后端连调

3.1 联调出错

# 1 修改错误
	描述好，复制好错误，给Trae修复即可
     
# 2 第二个错误
微信小程序注册功能，接口返回成功，但是小程端提示错误

# 3 第三个错误：把微信小程序端的错误提示记录下来
	-微信小程序注册功能成功，但是小程序端提示：注册失败，请检查网络，帮我修改
    
    
# 4 注册调通了--》进入到首页，发现没有个人中心，换脸历史
微信小程序端，进入到首页后，下方应该有个人中心，换脸历史的tab切换，我发现没有，帮我排查问题

# 5 小程序登陆功能，输入了正确的邮箱和密码，提示：{"status":"error","message":"邮箱或密码错误"} 帮我检查修复


# 6 没操作，但是network报错
	复制出访问地址和错误，交给Trae
    
    
# 7 小程序首页下方的tabBar，使用图片的切换：阿里图标矢量库
		-可下载图片手动替换
    	-Trae生成不了图片
            "iconPath": "images/tabbar/home.png",
            "selectedIconPath": "images/tabbar/home-active.png",

image-20260312212630116

image-20260312212829749

image-20260312213201037

image-20260312215035138

4 项目演示

# 1 老师课后把前后一步步都调通了，如果同学嫌自己调代码麻烦，可以直接使用老师的代码运行
	-你们需要两天时间

# 2 我的代码：ChangeFace.rar--》解压--》使用Trae打开


# 3 修改数据库--导入数据--》如下图-创建一个数据库：chang_face01
    # 输入到trae中，直接让trae改
    后端链接数据库地址如下，帮我修改:
        -host:127.0.0.1
        -port:3306
        -database:change_face
        -user:root
        -password:lqz123?

    # 手动改：
        -用户名：root  不改
        -密码：lqz123?
        -地址：127.0.0.1  如果是虚拟机：改成虚拟机地址
        -端口：3307
    # 把数据导入：按视频，把老师给的chang_face.sql 导入到你新建的chang_face01库
	
	

# 4 运行后端
	-输入提示词：帮我创建虚拟环境，安装依赖，运行django项目,运行在0.0.0.0:8000： change_face_api
    -后期再运行：帮我运行后端django项目，运行在0.0.0.0:8000
        
        
# 5 在微信小程序端，修改你电脑ip，如下图


# 6 真机测试：安卓，ios手机--》打开微信---》扫码
	-你的手机跟你的电脑，连同一个路由器
    
# 7 大家可以登陆到后台管理
	http://127.0.0.1:8000/admin/
    用户名：lqz
    密码：123456
    
    
# 8 改成你们的coze工作流：
	id号和密钥

image-20260312220420844

image-20260312221148569

image-20260312221221769

image-20260312221248762

image-20260312221342065

image-20260312221524559

image-20260312222413390

image-20260312222917674

posted @ 2026-03-16 15:48  凫弥  阅读(9)  评论(0)    收藏  举报