智谱AI发布最新开源旗舰模型GLM-4.5，专为智能体应用打造的基础模型。Hugging Face与ModelScope平台同步开源，模型权重遵循MIT License。GLM-4.5在推理、代码、智能体综合能力达到开源模型SOTA水平，在真实场景Agentic Coding对比评测中，实测结果国内最佳。

关键信息如下：

  1. 开源地址：https://github.com/zai-org/GLM-4.5

  2. GLM-4.5参数量是DeepSeek-R1的1/2、Kimi-K2的1/3，但综合评测登顶，全球模型第三、国产模型第一、开源模型SOTA。

  3. 定价极其离谱，超级便宜，API调用价格低至输入 0.8 元/百万 tokens，输出 2 元/百万 tokens。

  4. 生成速度最高能达到100tokens/秒。

  5. 在Agentic Coding的盲评测试中，跟Claude-4-Sonnet、Kimi-K2、Qwen3-Coder进行了对比，GLM-4.5在52个编程开发任务上的表现，国内最佳，在大部分场景中可以平替Claude-4-Sonnet，碾压了K2和Qwen3-Coder。

  6. 普通用户可以在z.ai上免费体验。

还是以我们实际的项目为准，作为一个普通开发者从最真实的角度体验一下这个模型的代码能力。

需求描述：我要开发一个相亲APP，帮我实现一个个人资料认证的页面，包括实名认证（身份证、港澳台、外国护照），学历认证（学信网），工作认证（工牌，工作邮箱等）

一直在更新，更多的大模型学习和面试资料已经上传带到CSDN的官方了，有需要的朋友可以扫描下方二维码免费领取【保证100%免费】👇👇

从整个简单的体验流程来看确实不错，首先速度很快，其次整个页面的布局也比较突出重点。对于需求的理解也很到位。完整的HTML代码如下：

<!DOCTYPE html><html lang="zh-CN"><head>    <meta charset="UTF-8">    <meta name="viewport" content="width=device-width, initial-scale=1.0">    <title>个人资料认证 - 相亲APP</title>    <script src="https://cdn.tailwindcss.com"></script>    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">    <style>        .step-indicator {            transition: all 0.3s ease;        }        .step-indicator.active {            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);        }        .step-indicator.completed {            background: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%);        }        .upload-area {            transition: all 0.3s ease;        }        .upload-area:hover {            border-color: #667eea;            background-color: #f8faff;        }        .verification-card {            transition: all 0.3s ease;        }        .verification-card:hover {            transform: translateY(-2px);            box-shadow: 0 10px 25px rgba(0,0,0,0.1);        }    </style></head><body class="bg-gray-50 min-h-screen">    <!-- 头部导航 -->    <nav class="bg-white shadow-sm border-b">        <div class="max-w-4xl mx-auto px-4 py-4">            <div class="flex items-center justify-between">                <div class="flex items-center space-x-3">                    <i class="fas fa-heart text-pink-500 text-2xl"></i>                    <h1 class="text-xl font-bold text-gray-800">相亲认证中心</h1>                </div>                <div class="flex items-center space-x-2">                    <div class="w-8 h-8 bg-gradient-to-r from-purple-400 to-pink-400 rounded-full flex items-center justify-center">                        <i class="fas fa-user text-white text-sm"></i>                    </div>                    <span class="text-sm text-gray-600">张小明</span>                </div>            </div>        </div>    </nav>
    <div class="max-w-4xl mx-auto px-4 py-8">        <!-- 认证进度指示器 -->        <div class="bg-white rounded-lg shadow-sm p-6 mb-8">            <div class="flex items-center justify-between mb-4">                <h2 class="text-lg font-semibold text-gray-800">认证进度</h2>                <span class="text-sm text-gray-500">完成认证可获得更高的信任度</span>            </div>            <div class="flex items-center space-x-4">                <div class="flex items-center space-x-2">                    <div class="step-indicator completed w-8 h-8 rounded-full flex items-center justify-center text-white text-sm font-bold">                        <i class="fas fa-check"></i>                    </div>                    <span class="text-sm font-medium text-gray-700">实名认证</span>                </div>                <div class="flex-1 h-1 bg-gray-200 rounded"></div>                <div class="flex items-center space-x-2">                    <div class="step-indicator active w-8 h-8 rounded-full flex items-center justify-center text-white text-sm font-bold">                        2                    </div>                    <span class="text-sm font-medium text-gray-700">学历认证</span>                </div>                <div class="flex-1 h-1 bg-gray-200 rounded"></div>                <div class="flex items-center space-x-2">                    <div class="step-indicator w-8 h-8 rounded-full bg-gray-300 flex items-center justify-center text-white text-sm font-bold">                        3                    </div>                    <span class="text-sm font-medium text-gray-500">工作认证</span>                </div>            </div>        </div>
        <!-- 认证选项卡 -->        <div class="bg-white rounded-lg shadow-sm">            <div class="border-b border-gray-200">                <nav class="flex space-x-8 px-6" aria-label="Tabs">                    <button class="tab-button active py-4 px-1 border-b-2 border-purple-500 font-medium text-sm text-purple-600" data-tab="identity">                        <i class="fas fa-id-card mr-2"></i>实名认证                    </button>                    <button class="tab-button py-4 px-1 border-b-2 border-transparent font-medium text-sm text-gray-500 hover:text-gray-700 hover:border-gray-300" data-tab="education">                        <i class="fas fa-graduation-cap mr-2"></i>学历认证                    </button>                    <button class="tab-button py-4 px-1 border-b-2 border-transparent font-medium text-sm text-gray-500 hover:text-gray-700 hover:border-gray-300" data-tab="work">                        <i class="fas fa-briefcase mr-2"></i>工作认证                    </button>                </nav>            </div>
            <!-- 实名认证内容 -->            <div id="identity-tab" class="tab-content p-6">                <div class="mb-6">                    <h3 class="text-lg font-semibold text-gray-800 mb-2">实名认证</h3>                    <p class="text-sm text-gray-600">请选择您的证件类型并上传相关信息，我们将严格保护您的隐私</p>                </div>
                <!-- 证件类型选择 -->                <div class="grid grid-cols-1 md:grid-cols-3 gap-4 mb-6">                    <div class="verification-card border-2 border-purple-500 bg-purple-50 rounded-lg p-4 cursor-pointer" data-id-type="china-id">                        <div class="text-center">                            <i class="fas fa-id-card text-3xl text-purple-600 mb-2"></i>                            <h4 class="font-medium text-gray-800">身份证</h4>                            <p class="text-xs text-gray-600 mt-1">中国大陆居民</p>                        </div>                    </div>                    <div class="verification-card border-2 border-gray-200 rounded-lg p-4 cursor-pointer hover:border-purple-300" data-id-type="hk-tw">                        <div class="text-center">                            <i class="fas fa-passport text-3xl text-gray-400 mb-2"></i>                            <h4 class="font-medium text-gray-800">港澳台证件</h4>                            <p class="text-xs text-gray-600 mt-1">港澳台居民</p>                        </div>                    </div>                    <div class="verification-card border-2 border-gray-200 rounded-lg p-4 cursor-pointer hover:border-purple-300" data-id-type="passport">                        <div class="text-center">                            <i class="fas fa-globe text-3xl text-gray-400 mb-2"></i>                            <h4 class="font-medium text-gray-800">外国护照</h4>                            <p class="text-xs text-gray-600 mt-1">外籍人士</p>                        </div>                    </div>                </div>
                <!-- 身份证认证表单 -->                <div id="china-id-form" class="space-y-6">                    <div class="grid grid-cols-1 md:grid-cols-2 gap-6">                        <div>                            <label class="block text-sm font-medium text-gray-700 mb-2">身份证正面</label>                            <div class="upload-area border-2 border-dashed border-gray-300 rounded-lg p-6 text-center cursor-pointer">                                <i class="fas fa-cloud-upload-alt text-4xl text-gray-400 mb-2"></i>                                <p class="text-sm text-gray-600">点击上传身份证正面照片</p>                                <p class="text-xs text-gray-500 mt-1">支持 JPG、PNG 格式，大小不超过 5MB</p>                                <input type="file" class="hidden" accept="image/*">                            </div>                        </div>                        <div>                            <label class="block text-sm font-medium text-gray-700 mb-2">身份证反面</label>                            <div class="upload-area border-2 border-dashed border-gray-300 rounded-lg p-6 text-center cursor-pointer">                                <i class="fas fa-cloud-upload-alt text-4xl text-gray-400 mb-2"></i>                                <p class="text-sm text-gray-600">点击上传身份证反面照片</p>                                <p class="text-xs text-gray-500 mt-1">支持 JPG、PNG 格式，大小不超过 5MB</p>                                <input type="file" class="hidden" accept="image/*">                            </div>                        </div>                    </div>
                    <div class="grid grid-cols-1 md:grid-cols-2 gap-4">                        <div>                            <label class="block text-sm font-medium text-gray-700 mb-2">姓名</label>                            <input type="text" class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-purple-500" placeholder="请输入真实姓名">                        </div>                        <div>                            <label class="block text-sm font-medium text-gray-700 mb-2">身份证号</label>                            <input type="text" class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-purple-500" placeholder="请输入身份证号码">                        </div>                    </div>
                    <div class="flex items-center justify-between pt-4">                        <div class="flex items-center">                            <input type="checkbox" id="privacy-agree" class="h-4 w-4 text-purple-600 focus:ring-purple-500 border-gray-300 rounded">                            <label for="privacy-agree" class="ml-2 text-sm text-gray-600">                                我已阅读并同意 <a href="#" class="text-purple-600 hover:underline">隐私政策</a> 和 <a href="#" class="text-purple-600 hover:underline">服务条款</a>                            </label>                        </div>                        <button class="bg-gradient-to-r from-purple-500 to-pink-500 text-white px-6 py-2 rounded-md hover:from-purple-600 hover:to-pink-600 transition duration-200">                            提交认证                        </button>                    </div>                </div>            </div>
            <!-- 学历认证内容 -->            <div id="education-tab" class="tab-content p-6 hidden">                <div class="mb-6">                    <h3 class="text-lg font-semibold text-gray-800 mb-2">学历认证</h3>                    <p class="text-sm text-gray-600">通过学信网认证您的学历信息，提升个人信誉度</p>                </div>
                <div class="bg-blue-50 border border-blue-200 rounded-lg p-4 mb-6">                    <div class="flex items-start">                        <i class="fas fa-info-circle text-blue-500 mt-1 mr-3"></i>                        <div>                            <h4 class="font-medium text-blue-800 mb-1">学信网认证说明</h4>                            <p class="text-sm text-blue-700">我们将通过学信网官方接口验证您的学历信息，请确保信息准确无误。认证过程通常需要1-3个工作日。</p>                        </div>                    </div>                </div>
                <div class="space-y-6">                    <div class="grid grid-cols-1 md:grid-cols-2 gap-4">                        <div>                            <label class="block text-sm font-medium text-gray-700 mb-2">学历层次</label>                            <select class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-purple-500">                                <option value="">请选择学历层次</option>                                <option value="bachelor">本科</option>                                <option value="master">硕士</option>                                <option value="doctor">博士</option>                                <option value="college">专科</option>                            </select>                        </div>                        <div>                            <label class="block text-sm font-medium text-gray-700 mb-2">毕业院校</label>                            <input type="text" class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-purple-500" placeholder="请输入毕业院校名称">                        </div>                    </div>
                    <div class="grid grid-cols-1 md:grid-cols-2 gap-4">                        <div>                            <label class="block text-sm font-medium text-gray-700 mb-2">专业名称</label>                            <input type="text" class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-purple-500" placeholder="请输入专业名称">                        </div>                        <div>                            <label class="block text-sm font-medium text-gray-700 mb-2">毕业时间</label>                            <input type="month" class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-purple-500">                        </div>                    </div>
                    <div>                        <label class="block text-sm font-medium text-gray-700 mb-2">学信网账号</label>                        <input type="text" class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-purple-500" placeholder="请输入学信网账号（手机号或邮箱）">                    </div>
                    <div>                        <label class="block text-sm font-medium text-gray-700 mb-2">学信网密码</label>                        <input type="password" class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-purple-500" placeholder="请输入学信网密码">                        <p class="text-xs text-gray-500 mt-1">我们承诺不会保存您的密码，仅用于本次认证</p>                    </div>
                    <div class="flex items-center justify-between pt-4">                        <button class="text-purple-600 hover:text-purple-700 text-sm">                            <i class="fas fa-question-circle mr-1"></i>                            如何找到学信网账号密码？                        </button>                        <button class="bg-gradient-to-r from-purple-500 to-pink-500 text-white px-6 py-2 rounded-md hover:from-purple-600 hover:to-pink-600 transition duration-200">                            开始认证                        </button>                    </div>                </div>            </div>
            <!-- 工作认证内容 -->            <div id="work-tab" class="tab-content p-6 hidden">                <div class="mb-6">                    <h3 class="text-lg font-semibold text-gray-800 mb-2">工作认证</h3>                    <p class="text-sm text-gray-600">认证您的工作信息，增加个人可信度</p>                </div>
                <!-- 认证方式选择 -->                <div class="grid grid-cols-1 md:grid-cols-2 gap-4 mb-6">                    <div class="verification-card border-2 border-purple-500 bg-purple-50 rounded-lg p-4 cursor-pointer" data-work-type="badge">                        <div class="flex items-center">                            <i class="fas fa-id-badge text-2xl text-purple-600 mr-3"></i>                            <div>                                <h4 class="font-medium text-gray-800">工牌认证</h4>                                <p class="text-xs text-gray-600 mt-1">上传公司工牌照片</p>                            </div>                        </div>                    </div>                    <div class="verification-card border-2 border-gray-200 rounded-lg p-4 cursor-pointer hover:border-purple-300" data-work-type="email">                        <div class="flex items-center">                            <i class="fas fa-envelope text-2xl text-gray-400 mr-3"></i>                            <div>                                <h4 class="font-medium text-gray-800">邮箱认证</h4>                                <p class="text-xs text-gray-600 mt-1">使用工作邮箱验证</p>                            </div>                        </div>                    </div>                </div>
                <!-- 工牌认证表单 -->                <div id="badge-form" class="space-y-6">                    <div class="grid grid-cols-1 md:grid-cols-2 gap-6">                        <div>                            <label class="block text-sm font-medium text-gray-700 mb-2">工牌正面照片</label>                            <div class="upload-area border-2 border-dashed border-gray-300 rounded-lg p-6 text-center cursor-pointer">                                <i class="fas fa-cloud-upload-alt text-4xl text-gray-400 mb-2"></i>                                <p class="text-sm text-gray-600">点击上传工牌照片</p>                                <p class="text-xs text-gray-500 mt-1">确保照片清晰，信息完整</p>                                <input type="file" class="hidden" accept="image/*">                            </div>                        </div>                        <div>                            <label class="block text-sm font-medium text-gray-700 mb-2">公司环境照片（可选）</label>                            <div class="upload-area border-2 border-dashed border-gray-300 rounded-lg p-6 text-center cursor-pointer">                                <i class="fas fa-building text-4xl text-gray-400 mb-2"></i>                                <p class="text-sm text-gray-600">点击上传公司环境照片</p>                                <p class="text-xs text-gray-500 mt-1">有助于提高认证通过率</p>                                <input type="file" class="hidden" accept="image/*">                            </div>                        </div>                    </div>
                    <div class="grid grid-cols-1 md:grid-cols-2 gap-4">                        <div>                            <label class="block text-sm font-medium text-gray-700 mb-2">公司名称</label>                            <input type="text" class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-purple-500" placeholder="请输入公司全称">                        </div>                        <div>                            <label class="block text-sm font-medium text-gray-700 mb-2">职位</label>                            <input type="text" class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-purple-500" placeholder="请输入您的职位">                        </div>                    </div>
                    <div class="grid grid-cols-1 md:grid-cols-2 gap-4">                        <div>                            <label class="block text-sm font-medium text-gray-700 mb-2">工作年限</label>                            <select class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-purple-500">                                <option value="">请选择工作年限</option>                                <option value="0-1">0-1年</option>                                <option value="1-3">1-3年</option>                                <option value="3-5">3-5年</option>                                <option value="5-10">5-10年</option>                                <option value="10+">10年以上</option>                            </select>                        </div>                        <div>                            <label class="block text-sm font-medium text-gray-700 mb-2">行业类型</label>                            <select class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-purple-500">                                <option value="">请选择行业类型</option>                                <option value="tech">互联网/IT</option>                                <option value="finance">金融</option>                                <option value="education">教育</option>                                <option value="medical">医疗</option>                                <option value="other">其他</option>                            </select>                        </div>                    </div>
                    <div class="flex items-center justify-between pt-4">                        <div class="text-sm text-gray-600">                            <i class="fas fa-shield-alt text-green-500 mr-1"></i>                            您的信息将被加密保护                        </div>                        <button class="bg-gradient-to-r from-purple-500 to-pink-500 text-white px-6 py-2 rounded-md hover:from-purple-600 hover:to-pink-600 transition duration-200">                            提交认证                        </button>                    </div>                </div>
                <!-- 邮箱认证表单 -->                <div id="email-form" class="space-y-6 hidden">                    <div class="bg-yellow-50 border border-yellow-200 rounded-lg p-4 mb-6">                        <div class="flex items-start">                            <i class="fas fa-exclamation-triangle text-yellow-500 mt-1 mr-3"></i>                            <div>                                <h4 class="font-medium text-yellow-800 mb-1">邮箱认证说明</h4>                                <p class="text-sm text-yellow-700">请使用您公司的企业邮箱进行认证，我们将发送验证邮件到该邮箱地址。</p>                            </div>                        </div>                    </div>
                    <div>                        <label class="block text-sm font-medium text-gray-700 mb-2">工作邮箱</label>                        <input type="email" class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-purple-500" placeholder="请输入您的工作邮箱（如：name@company.com）">                        <p class="text-xs text-gray-500 mt-1">请确保邮箱地址正确，验证邮件将发送到此邮箱</p>                    </div>
                    <div class="grid grid-cols-1 md:grid-cols-2 gap-4">                        <div>                            <label class="block text-sm font-medium text-gray-700 mb-2">公司名称</label>                            <input type="text" class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-purple-500" placeholder="请输入公司全称">                        </div>                        <div>                            <label class="block text-sm font-medium text-gray-700 mb-2">职位</label>                            <input type="text" class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-purple-500" placeholder="请输入您的职位">                        </div>                    </div>
                    <div class="flex items-center justify-between pt-4">                        <button class="text-purple-600 hover:text-purple-700 text-sm">                            <i class="fas fa-question-circle mr-1"></i>                            认证遇到问题？                        </button>                        <button class="bg-gradient-to-r from-purple-500 to-pink-500 text-white px-6 py-2 rounded-md hover:from-purple-600 hover:to-pink-600 transition duration-200">                            发送验证邮件                        </button>                    </div>                </div>            </div>        </div>
        <!-- 认证状态卡片 -->        <div class="mt-8 grid grid-cols-1 md:grid-cols-3 gap-4">            <div class="bg-white rounded-lg shadow-sm p-4 border-l-4 border-green-500">                <div class="flex items-center justify-between">                    <div>                        <h4 class="font-medium text-gray-800">实名认证</h4>                        <p class="text-sm text-green-600 mt-1">已认证</p>                    </div>                    <i class="fas fa-check-circle text-green-500 text-2xl"></i>                </div>            </div>            <div class="bg-white rounded-lg shadow-sm p-4 border-l-4 border-yellow-500">                <div class="flex items-center justify-between">                    <div>                        <h4 class="font-medium text-gray-800">学历认证</h4>                        <p class="text-sm text-yellow-600 mt-1">审核中</p>                    </div>                    <i class="fas fa-clock text-yellow-500 text-2xl"></i>                </div>            </div>            <div class="bg-white rounded-lg shadow-sm p-4 border-l-4 border-gray-300">                <div class="flex items-center justify-between">                    <div>                        <h4 class="font-medium text-gray-800">工作认证</h4>                        <p class="text-sm text-gray-500 mt-1">未认证</p>                    </div>                    <i class="fas fa-circle text-gray-300 text-2xl"></i>                </div>            </div>        </div>    </div>
    <script>        // 标签页切换功能        document.querySelectorAll('.tab-button').forEach(button => {            button.addEventListener('click', () => {                const tabName = button.getAttribute('data-tab');
                // 更新按钮状态                document.querySelectorAll('.tab-button').forEach(btn => {                    btn.classList.remove('active', 'border-purple-500', 'text-purple-600');                    btn.classList.add('border-transparent', 'text-gray-500');                });                button.classList.add('active', 'border-purple-500', 'text-purple-600');                button.classList.remove('border-transparent', 'text-gray-500');
                // 显示对应内容                document.querySelectorAll('.tab-content').forEach(content => {                    content.classList.add('hidden');                });                document.getElementById(`${tabName}-tab`).classList.remove('hidden');            });        });
        // 证件类型选择        document.querySelectorAll('[data-id-type]').forEach(card => {            card.addEventListener('click', () => {                document.querySelectorAll('[data-id-type]').forEach(c => {                    c.classList.remove('border-purple-500', 'bg-purple-50');                    c.classList.add('border-gray-200');                    c.querySelector('i').classList.remove('text-purple-600');                    c.querySelector('i').classList.add('text-gray-400');                });                card.classList.add('border-purple-500', 'bg-purple-50');                card.classList.remove('border-gray-200');                card.querySelector('i').classList.add('text-purple-600');                card.querySelector('i').classList.remove('text-gray-400');            });        });
        // 工作认证方式选择        document.querySelectorAll('[data-work-type]').forEach(card => {            card.addEventListener('click', () => {                const workType = card.getAttribute('data-work-type');
                document.querySelectorAll('[data-work-type]').forEach(c => {                    c.classList.remove('border-purple-500', 'bg-purple-50');                    c.classList.add('border-gray-200');                    c.querySelector('i').classList.remove('text-purple-600');                    c.querySelector('i').classList.add('text-gray-400');                });                card.classList.add('border-purple-500', 'bg-purple-50');                card.classList.remove('border-gray-200');                card.querySelector('i').classList.add('text-purple-600');                card.querySelector('i').classList.remove('text-gray-400');
                // 显示对应表单                if (workType === 'badge') {                    document.getElementById('badge-form').classList.remove('hidden');                    document.getElementById('email-form').classList.add('hidden');                } else {                    document.getElementById('badge-form').classList.add('hidden');                    document.getElementById('email-form').classList.remove('hidden');                }            });        });
        // 文件上传功能        document.querySelectorAll('.upload-area').forEach(area => {            area.addEventListener('click', () => {                const input = area.querySelector('input[type="file"]');                if (input) {                    input.click();                }            });
            const input = area.querySelector('input[type="file"]');            if (input) {                input.addEventListener('change', (e) => {                    const file = e.target.files[0];                    if (file) {                        area.innerHTML = `                            <i class="fas fa-check-circle text-4xl text-green-500 mb-2"></i>                            <p class="text-sm text-green-600">${file.name}</p>                            <p class="text-xs text-gray-500 mt-1">点击重新选择</p>                            <input type="file" class="hidden" accept="image/*">                        `;
                        // 重新绑定点击事件                        area.addEventListener('click', () => {                            const newInput = area.querySelector('input[type="file"]');                            if (newInput) {                                newInput.click();                            }                        });                    }                });            }        });
        // 表单提交处理        document.querySelectorAll('button').forEach(button => {            if (button.textContent.includes('提交认证') || button.textContent.includes('开始认证') || button.textContent.includes('发送验证邮件')) {                button.addEventListener('click', (e) => {                    e.preventDefault();
                    // 简单的表单验证提示                    const form = button.closest('.space-y-6, .tab-content');                    const requiredInputs = form.querySelectorAll('input[required], select[required], input:not([type="file"]):not([type="checkbox"])');
                    let isValid = true;                    requiredInputs.forEach(input => {                        if (!input.value.trim()) {                            isValid = false;                            input.classList.add('border-red-500');                        } else {                            input.classList.remove('border-red-500');                        }                    });
                    if (!isValid) {                        // 显示错误提示                        const toast = document.createElement('div');                        toast.className = 'fixed top-4 right-4 bg-red-500 text-white px-6 py-3 rounded-lg shadow-lg z-50';                        toast.innerHTML = '<i class="fas fa-exclamation-circle mr-2"></i>请填写所有必填项';                        document.body.appendChild(toast);
                        setTimeout(() => {                            toast.remove();                        }, 3000);                        return;                    }
                    // 显示成功提示                    const toast = document.createElement('div');                    toast.className = 'fixed top-4 right-4 bg-green-500 text-white px-6 py-3 rounded-lg shadow-lg z-50';                    toast.innerHTML = '<i class="fas fa-check-circle mr-2"></i>认证信息已提交，请等待审核';                    document.body.appendChild(toast);
                    setTimeout(() => {                        toast.remove();                    }, 3000);                });            }        });    </script></body></html>

但是生成HTML绝对不是我们的重点，我们继续测试其它方面的能力，让其把HTML代码转换成微信小程序代码。

过程不细写了，代码比较长，在生成的过程中还中断了一下，我们直接看生成的效果。

小程序整体来看功能实现还是比较完整，UI排版还待优化！根据最近测试的其它模型整体对比下来还是不错，很nice!

照着这个速度发展下去，在编程这个领域，我认为我们离摆脱Claud模型已经非常接近了～

此时想想从年初DeepSeek的一鸣惊人，到如今阿里的Qwen3-Coder再到智谱的GLM-4.5，在AI这件事情上我们终究越走越稳，越成熟，越体面！、

如何学习大模型 AI ？

由于新岗位的生产效率，要优于被取代岗位的生产效率，所以实际上整个社会的生产效率是提升的。

但是具体到个人，只能说是：

“最先掌握AI的人，将会比较晚掌握AI的人有竞争优势”。

这句话，放在计算机、互联网、移动互联网的开局时期，都是一样的道理。

我在一线互联网企业工作十余年里，指导过不少同行后辈。帮助很多人得到了学习和成长。

我意识到有很多经验和知识值得分享给大家，也可以通过我们的能力和经验解答大家在人工智能学习中的很多困惑，所以在工作繁忙的情况下还是坚持各种整理和分享。但苦于知识传播途径有限，很多互联网行业朋友无法获得正确的资料得到学习提升，故此将并将重要的AI大模型资料包括AI大模型入门学习思维导图、精品AI大模型学习书籍手册、视频教程、实战学习等录播视频免费分享出来。

一直在更新，更多的大模型学习和面试资料已经上传带到CSDN的官方了，有需要的朋友可以扫描下方二维码免费领取【保证100%免费】👇👇

01.大模型风口已至：月薪30K+的AI岗正在批量诞生

在这里插入图片描述

2025年大模型应用呈现爆发式增长，根据工信部最新数据：

国内大模型相关岗位缺口达47万

初级工程师平均薪资28K（数据来源：BOSS直聘报告）

70%企业存在"能用模型不会调优"的痛点

真实案例：某二本机械专业学员，通过4个月系统学习，成功拿到某AI医疗公司大模型优化岗offer，薪资直接翻3倍！

02.如何学习大模型 AI ？

🔥AI取代的不是人类，而是不会用AI的人！麦肯锡最新报告显示：掌握AI工具的从业者生产效率提升47%，薪资溢价达34%！🚀

由于新岗位的生产效率，要优于被取代岗位的生产效率，所以实际上整个社会的生产效率是提升的。

但是具体到个人，只能说是：

“最先掌握AI的人，将会比较晚掌握AI的人有竞争优势”。

这句话，放在计算机、互联网、移动互联网的开局时期，都是一样的道理。

我在一线互联网企业工作十余年里，指导过不少同行后辈。帮助很多人得到了学习和成长。

我意识到有很多经验和知识值得分享给大家，也可以通过我们的能力和经验解答大家在人工智能学习中的很多困惑，所以在工作繁忙的情况下还是坚持各种整理和分享。但苦于知识传播途径有限，很多互联网行业朋友无法获得正确的资料得到学习提升，故此将并将重要的AI大模型资料包括AI大模型入门学习思维导图、精品AI大模型学习书籍手册、视频教程、实战学习等录播视频免费分享出来。

1️⃣ 提示词工程：把ChatGPT从玩具变成生产工具
2️⃣ RAG系统：让大模型精准输出行业知识
3️⃣ 智能体开发：用AutoGPT打造24小时数字员工

📦熬了三个大夜整理的《AI进化工具包》送你：
✔️ 大厂内部LLM落地手册（含58个真实案例）
✔️ 提示词设计模板库（覆盖12大应用场景）
✔️ 私藏学习路径图（0基础到项目实战仅需90天）

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

第一阶段（10天）：初阶应用

该阶段让大家对大模型 AI有一个最前沿的认识，对大模型 AI 的理解超过 95% 的人，可以在相关讨论时发表高级、不跟风、又接地气的见解，别人只会和 AI 聊天，而你能调教 AI，并能用代码将大模型和业务衔接。

  • 大模型 AI 能干什么？
  • 大模型是怎样获得「智能」的？
  • 用好 AI 的核心心法
  • 大模型应用业务架构
  • 大模型应用技术架构
  • 代码示例：向 GPT-3.5 灌入新知识
  • 提示工程的意义和核心思想
  • Prompt 典型构成
  • 指令调优方法论
  • 思维链和思维树
  • Prompt 攻击和防范
  • …

第二阶段（30天）：高阶应用

该阶段我们正式进入大模型 AI 进阶实战学习，学会构造私有知识库，扩展 AI 的能力。快速开发一个完整的基于 agent 对话机器人。掌握功能最强的大模型开发框架，抓住最新的技术进展，适合 Python 和 JavaScript 程序员。

  • 为什么要做 RAG
  • 搭建一个简单的 ChatPDF
  • 检索的基础概念
  • 什么是向量表示（Embeddings）
  • 向量数据库与向量检索
  • 基于向量检索的 RAG
  • 搭建 RAG 系统的扩展知识
  • 混合检索与 RAG-Fusion 简介
  • 向量模型本地部署
  • …

第三阶段（30天）：模型训练

恭喜你，如果学到这里，你基本可以找到一份大模型 AI相关的工作，自己也能训练 GPT 了！通过微调，训练自己的垂直大模型，能独立训练开源多模态大模型，掌握更多技术方案。

到此为止，大概2个月的时间。你已经成为了一名“AI小子”。那么你还想往下探索吗？

  • 为什么要做 RAG
  • 什么是模型
  • 什么是模型训练
  • 求解器 & 损失函数简介
  • 小实验2：手写一个简单的神经网络并训练它
  • 什么是训练/预训练/微调/轻量化微调
  • Transformer结构简介
  • 轻量化微调
  • 实验数据集的构建
  • …

第四阶段（20天）：商业闭环

对全球大模型从性能、吞吐量、成本等方面有一定的认知，可以在云端和本地等多种环境下部署大模型，找到适合自己的项目/创业方向，做一名被 AI 武装的产品经理。

  • 硬件选型
  • 带你了解全球大模型
  • 使用国产大模型服务
  • 搭建 OpenAI 代理
  • 热身：基于阿里云 PAI 部署 Stable Diffusion
  • 在本地计算机运行大模型
  • 大模型的私有化部署
  • 基于 vLLM 部署大模型
  • 案例：如何优雅地在阿里云私有部署开源大模型
  • 部署一套开源 LLM 项目
  • 内容安全
  • 互联网信息服务算法备案
  • …

学习是一个过程，只要学习就会有挑战。天道酬勤，你越努力，就会成为越优秀的自己。

如果你能在15天内完成所有的任务，那你堪称天才。然而，如果你能完成 60-70% 的内容，你就已经开始具备成为一名大模型 AI 的正确特征了。

这份完整版的大模型 AI 学习资料已经上传CSDN，朋友们如果需要可以微信扫描下方CSDN官方认证二维码免费领取【保证100%免费】

在这里插入图片描述

# 开发语言 # 人工智能 # 自然语言处理 # java # AI
Logo
AI编程社区

汇聚全球AI编程工具，助力开发者即刻编程。

更多推荐

AI原生应用领域混合推理技术的最新进展

当我们谈论AI原生应用（如ChatGPT、GitHub Copilot、智能诊疗系统）时，“灵活但不可靠”“准确但不智能”的矛盾始终是绕不开的痛点——纯神经模型（如大语言模型）像“凭直觉做题的学生”，擅长处理复杂场景却常犯“幻觉”错误；纯符号系统（如传统专家系统）像“死记硬背的书呆子”，逻辑严谨却无法应对非结构化数据。混合推理技术。

avatar AI编程社区
cover

技术速递｜如何使用 Playwright MCP 和 GitHub Copilot 调试 Web 应用

avatar AI编程社区

小白也能学会，OpenAI的Codex新玩法，让它成为你的7x24小时AI员工

这套玩法的核心，是利用跨平台的异步协作，将我们的碎片化时间和AI的强大执行力完美结合。AI不再是一个需要你时刻监督的实习生，而是一个可以独立完成任务、多线程工作的可靠团队。这可能也是AI编程的未来范式。

avatar AI编程社区