微信群的二维码每周都要更新一次,比较麻烦。于是搞了个简单的上传/下发的 Web 应用。

下面是优化前后流程,虽然看似步骤少了一步,但大大节省了时间。

主要功能

  • 常见类型图片上传,支持删除,提供外链访问
  • 支持上传前修改图片名,同名自动覆盖
  • 秘钥登录,配置更简单

Github: https://github.com/ATQQ/image-uploader

体验地址:https://imageupload.test.sugarat.top (秘钥testpwd)

https://imageupload.test.sugarat.top/images/user1/test.png

AI做了啥

Web站点生成

https://bolt.new/~/sb1-58wfad6k

使用 Bolt(https://bolt.new) 生成

Prompt 如下

实现一个Vue3 SSR的应用,通过填写一个指定的秘钥(服务器上可以配置多个秘钥)
就可以上传图片到服务器上,支持用户单选或者多选图片,上传后给用户返回图片链接,
链接构成 domain/images/秘钥对应账号名/图片名称 其中图片名称可以由用户可选指定,不指定就动态生成一个不重复的图片名 同时集成图片的自动压缩

哐哐的一顿输出,分分钟就好了。

图片压缩功能生成得有问题,代码上就先给移除了

项目最终就是 Vue Nuxt 技术栈。

镜像脚本生成

使用 Cursor 的 chat 功能,也是 kuakua 的就生成了!

我做了什么

  1. 代码逻辑的微调
  2. 镜像脚本的微调,构建镜像上传
  3. 部署服务器

上面的工作理论上AI都能搞定,复杂点的可以结合一下 MCP,但个人觉得重要的部分还是需要人工 Review 改造一下。

细微的地方修改,Prompt 效率还是没有直接改 code 来得快。

如何部署

Docker

最简单的方式使用 Docker 镜像(当然也是AI生成的)

docker run -d \
--name image-uploader \
-p 3000:3000 \
-v $(pwd)/data:/app/data \
-e NODE_ENV=production \
-e HOST=0.0.0.0 \
-e PORT=3000 \
-e SECRET_ACCOUNT_USER1=your-secret-key-here \
--restart unless-stopped \
sugarjl/image-uploader

通过修改SECRET_ACCOUNT_XXX的值来设置秘钥 比如

  -e SECRET_ACCOUNT_HELLO=a123456 \

PM2

# 拉代码
git clone https://github.com/ATQQ/image-uploader.git # Gitee 地址(Github 访问受阻)
git clone https://gitee.com/sugarjl/image-uploader.git cd image-uploader # 装依赖
npm install
# 构建
npm run build # 启动
# 在 ecosystem.config.cjs env中添加或修改秘钥
pm2 start ecosystem.config.cjs
# 或者 启动时通过环境变量指定秘钥
SECRET_ACCOUNT_USER1=test pm2 start ecosystem.config.cjs

最后

有 AI 后,能快速验证的各种想法,分分钟就生成 demo ,效率杠杠的!

语言不再是开发的障碍。

用AI做了个动态下发微信群二维码应用的更多相关文章

  1. 关于微信扫描二维码下载apk文件的细节设计

    微信使用的人数越来越多,渐渐的用户形成了一种习惯,扫描二维码的时候,也会打开微信去扫描,但是微信不支持第三方的链接下载,有些厂商已经发现了这一特点,所以在使用二维码下载自家的app时,会做一个提示,引 ...

  2. 微信连WiFi关注公众号流程更新 解决ios微信扫描二维码不关注就能上网的问题

    前几天鼓捣了一下微信连WiFi功能,设置还蛮简单的,但ytkah发现如果是ios版微信扫描微信连WiFi生成的二维码不用关注公众号就可以直接上网了,而安卓版需要关注公众号才能上网,这样就少了很多ios ...

  3. 微信支付之01------获取订单微信支付二维码的接口------Java实现

    [ 前言:以前写过一个获取微信二维码支付的接口,发现最近公司新开的项目会经常用到,现在我又翻出代码看了一遍,觉得还是把整个代码流程记下来的好 ] 借鉴博客: 他这篇博客写得不错,挺全的:https:/ ...

  4. JAVA实现的微信扫描二维码支付

    吐槽一下 支付项目采用springMvc+Dubbo架构实现,只对外提供接口. 话说,为什么微信支付比支付宝来的晚了那么一点,一句话,那一阵挺忙的,然后就没有时间整理,最近做完支付宝支付,顺便也把微信 ...

  5. (转)ZXing生成二维码和带logo的二维码,模仿微信生成二维码效果

    场景:移动支付需要对二维码的生成与部署有所了解,掌握目前主流的二维码生成技术. 1 ZXing 生成二维码 首先说下,QRCode是日本人开发的,ZXing是google开发,barcode4j也是老 ...

  6. 微信扫描二维码安卓弹出默认浏览器(苹果打开App Store)打开下载链接

    使用微信推广的用户经常都会遇到推广链接被拦截导致无法下载app的情况,此时用户在微信中打开会提示“ 已停止访问该网页 ”.这对于使用微信营销的商家来说就很不友好且损失非常大,因为用户是不知道为什么打不 ...

  7. 记一次vue 普通异步请求微信二进制二维码 乱码 问题解决然后渲染

    后端压力大,前端分忧. /*用微信小程序token拿二维码*/ async fetchMINIQRcode({commit,state},params){ var instance = axios.c ...

  8. ios app 解决微信扫二维码不能跳转问题

    <script> (function(){ // Setup GA (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i ...

  9. 微信扫描二维码跳转手机默认浏览器打开下载app的链接是怎么实现的

    此方法可以实现微信内置浏览器跳转到手机其它浏览器,现在网上其它的方法都只是一个页面,让访问者自己手动点右上角浏览器打开,而这个不同,是可以直接自动跳转的. <?php error_reporti ...

  10. 转:微信生成二维码java

    package com.wepayweb.weixin.util.device; /*** * V型知识库 www.vxzsk.com */ import java.io.BufferedReader ...

随机推荐

  1. 高数小技巧:和 e^x 有关的积分该怎么算?

    高数解题也需要日积月累,下面是和 \(e^{x}\) 相关的一些常用解题思路,记得收藏+关注哦,还有更多考研数学实战笔记等着你呢( ̄︶ ̄) 当前高数笔记的最新内容,可以查看: https://zhao ...

  2. mybatis - [13] 分页

    题记部分 001 || limit select * from mybatis.user limit 2,5; 2代表偏移量,从结果集的第3行开始. 5代表返回的记录数 UserMapper List ...

  3. 分布式锁—4.Redisson的联锁和红锁

    大纲 1.Redisson联锁MultiLock概述 2.Redisson联锁MultiLock的加锁与释放锁 3.Redisson红锁RedLock的算法原理 4.Redisson红锁RedLock ...

  4. Manus的开源复刻OpenManus初探

    OpenManus介绍 Manus需要邀请码才能体验,目前大部分人都体验不到. 有几个大佬花3个小时就复现了一个简单的原型OpenManus,让我们体验体验吧!! 截至目前,该项目已经获得了25.9k ...

  5. 【CF VP记录】Codeforces Round 1008 (Div. 2)

    比赛链接 本文原文发布于博客园,如您在其他平台刷到此文,请前往博客园获得更好的阅读体验. 跳转链接:https://www.cnblogs.com/TianTianChaoFangDe/p/18766 ...

  6. jQuery ajax 文件上传 Request Headers 缺少 boundary

    原文地址: https://blog.jijian.link/2020-07-28/jquery-ajax-upload-file/ 一般上传方式 const file = document.getE ...

  7. 基于webman实现的服务层框架-webman-biz-framework

    简介 webman的基础上扩展的一个服务层框架,基于分层体系结构的代码模式. 如果觉得有用,可以帮我在webman-biz-framework点个小星星哟,也希望大家交流 分层体系结构的代码模式 什么 ...

  8. vue2打包部署到nginx,解决路由history模式下页面空白问题

    项目使用的是vue2,脚手架vue-cli 4. 需求:之前项目路由使用的是hash,现在要求调整为history模式,但是整个过程非常坎坷,遇到了页面空白问题.现在就具体讲一下这个问题. 首先,直接 ...

  9. git 合并分支 merge

    git 分支开发 git 分支开发,分支(feature)同步主干(master)代码,以及最终分支合并到主干的操作流程   由于 rebase 执行速度慢,分支同步主干代码时,分支的每次提交都可能和 ...

  10. SpringSecurity5(10-动态权限管理)

    授权流程 SpringSecurity 的授权流程如下: 拦截请求,已认证用户访问受保护的 web 资源将被 SecurityFilterChain 中的 FilterSecurityIntercep ...