8.让 Kimi 实时帮你写文案

03210

好！升级成真AI，让 Kimi 实时帮你写文案。

第一步：注册 Kimi 开放平台（3分钟）

  1. 浏览器访问 👉 https://platform.moonshot.cn
  2. 点 「注册」 → 手机号登录（收验证码）
  3. 注册成功后进入控制台

第二步：获取 API Key（2分钟）

  1. 进入控制台后，左侧菜单点 「API Key 管理」
  2. 点 「创建 API Key」
  3. 给 Key 起个名字，比如 my-website
  4. 复制生成的 Key（一串很长的字母数字，类似 sk-xxxxxxxx）
  5. 保存好，不要泄露给别人

⚠️ 重要：这个 Key 就像你的密码，不要发给别人。前端代码里暴露 Key 有被盗用风险，但这是学习阶段，先用着，后面学后端了再保护起来。

第三步：修改文案生成器代码

  1. Trae 里打开 ai-copywriter.html
  2. 按 Ctrl + A 全选，Delete 删掉
  3. 完整复制下面这段新代码，粘贴进去
  4. 找到第 15 行，把 你的API_Key 换成你刚才复制的真实 Key
  5. Ctrl + S 保存

HTML

<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>AI文案生成器 - 真AI版</title>
    <style>
        * { margin: 0; padding: 0; box-sizing: border-box; }
        
        body {
            font-family: "Microsoft YaHei", Arial, sans-serif;
            background: linear-gradient(135deg, #fce7f3, #fbcfe8);
            min-height: 100vh;
            display: flex;
            justify-content: center;
            align-items: center;
            padding: 20px;
        }
        
        .container {
            background: white;
            border-radius: 20px;
            padding: 40px;
            max-width: 600px;
            width: 100%;
            box-shadow: 0 20px 60px rgba(0,0,0,0.1);
        }
        
        h1 {
            text-align: center;
            color: #db2777;
            margin-bottom: 10px;
            font-size: 28px;
        }
        
        .subtitle {
            text-align: center;
            color: #666;
            font-size: 14px;
            margin-bottom: 30px;
        }
        
        .input-group {
            display: flex;
            gap: 10px;
            margin-bottom: 20px;
        }
        
        input {
            flex: 1;
            padding: 15px;
            border: 2px solid #fbcfe8;
            border-radius: 10px;
            font-size: 16px;
            outline: none;
            transition: border-color 0.3s;
        }
        
        input:focus {
            border-color: #db2777;
        }
        
        button {
            padding: 15px 30px;
            background: linear-gradient(135deg, #db2777, #be185d);
            color: white;
            border: none;
            border-radius: 10px;
            font-size: 16px;
            cursor: pointer;
            transition: transform 0.2s;
            white-space: nowrap;
        }
        
        button:hover {
            transform: scale(1.05);
        }
        
        button:disabled {
            background: #ccc;
            cursor: not-allowed;
            transform: none;
        }
        
        .result-box {
            background: #fdf2f8;
            border: 2px dashed #f9a8d4;
            border-radius: 12px;
            padding: 20px;
            min-height: 150px;
            display: none;
        }
        
        .result-box.show {
            display: block;
        }
        
        .result-title {
            color: #db2777;
            font-weight: bold;
            margin-bottom: 10px;
            font-size: 16px;
        }
        
        .result-content {
            color: #333;
            line-height: 1.8;
            font-size: 15px;
            white-space: pre-wrap;
        }
        
        .loading {
            text-align: center;
            color: #db2777;
            font-size: 14px;
            display: none;
        }
        
        .loading.show {
            display: block;
        }
        
        .tag {
            display: inline-block;
            background: #fce7f3;
            color: #db2777;
            padding: 2px 8px;
            border-radius: 4px;
            font-size: 12px;
            margin-right: 5px;
        }
        
        .tips {
            margin-top: 20px;
            font-size: 12px;
            color: #999;
            text-align: center;
        }
    </style>
</head>
<body>
    <div class="container">
        <h1>📝 AI文案生成器</h1>
        <p class="subtitle">接入 Kimi 真AI，输入产品名称，自动生成小红书种草文案</p>
        
        <div class="input-group">
            <input type="text" id="productInput" placeholder="输入产品名称，比如：奶茶、口红、面膜...">
            <button id="generateBtn" onclick="generateCopy()">✨ 生成文案</button>
        </div>
        
        <div class="loading" id="loading">
            🤖 Kimi 正在思考中，请稍候...
        </div>
        
        <div class="result-box" id="resultBox">
            <div class="result-title">🎯 生成结果</div>
            <div class="result-content" id="resultContent"></div>
        </div>
        
        <p class="tips">
            <span class="tag">真AI</span>
            <span class="tag">Kimi</span>
            <span class="tag">小红书风格</span>
            <br><br>
            由 Kimi AI 实时生成，每次结果都不同
        </p>
    </div>

    <script>
        // ========================================
        // 把你的 API Key 填在这里（替换掉引号里的内容）
        // ========================================
        const API_KEY = '你的API_Key';
        
        async function generateCopy() {
            const product = document.getElementById('productInput').value.trim();
            const btn = document.getElementById('generateBtn');
            const loading = document.getElementById('loading');
            const resultBox = document.getElementById('resultBox');
            const resultContent = document.getElementById('resultContent');
            
            // 检查输入
            if (!product) {
                alert('请输入产品名称！');
                return;
            }
            
            // 检查 API Key 是否已填写
            if (API_KEY === '你的API_Key' || API_KEY === '') {
                alert('请先填写你的 Kimi API Key！\n\n步骤：\n1. 访问 platform.moonshot.cn 注册\n2. 创建 API Key\n3. 把 Key 填到代码第 15 行');
                return;
            }
            
            // 显示加载状态
            btn.disabled = true;
            btn.textContent = '生成中...';
            loading.classList.add('show');
            resultBox.classList.remove('show');
            
            try {
                // 调用 Kimi API
                const response = await fetch('https://api.moonshot.cn/v1/chat/completions', {
                    method: 'POST',
                    headers: {
                        'Content-Type': 'application/json',
                        'Authorization': `Bearer ${API_KEY}`
                    },
                    body: JSON.stringify({
                        model: 'moonshot-v1-8k',  // 使用的模型
                        messages: [
                            {
                                role: 'system',
                                content: '你是一个资深的小红书文案博主，擅长写种草文案。你的文案风格：真实、有网感、带emoji、分段清晰、有感染力。'
                            },
                            {
                                role: 'user',
                                content: `请为"${product}"写一段小红书风格的种草文案，要求：\n1. 开头吸引人\n2. 中间讲真实使用感受\n3. 结尾有互动号召\n4. 带emoji\n5. 分段清晰\n6. 150字左右`
                            }
                        ],
                        temperature: 0.8  // 创意度，越高越有创意
                    })
                });
                
                const data = await response.json();
                
                if (data.error) {
                    throw new Error(data.error.message);
                }
                
                // 显示结果
                const copyText = data.choices[0].message.content;
                resultContent.textContent = copyText;
                resultBox.classList.add('show');
                
            } catch (error) {
                alert('生成失败：' + error.message + '\n\n可能原因：\n1. API Key 填错了\n2. 网络问题\n3. 免费额度用完了');
            } finally {
                // 恢复按钮状态
                btn.disabled = false;
                btn.textContent = '✨ 生成文案';
                loading.classList.remove('show');
            }
        }
        
        // 回车键也能生成
        document.getElementById('productInput').addEventListener('keypress', function(e) {
            if (e.key === 'Enter') {
                generateCopy();
            }
        });
    </script>
</body>
</html>

第四步：测试

  1. 双击打开 ai-copywriter.html
  2. 输入”奶茶”
  3. 点 「生成文案」
  4. 等 2-3 秒，看 Kimi 生成的文案

第五步：重新上传

  1. 把新的 ai-copywriter.html 上传到 GitHub
  2. 等 1 分钟，刷新网站
  3. 在线版也能用真AI了！

    替换步骤（1分钟）
    1. 打开文件
    Trae 里打开 ai-copywriter.html
    2. 找到第15行
    按 Ctrl + F，输入：
    plain


    你的API_Key

    会高亮显示，直接定位到那一行。
    3. 替换
    把：
    JavaScript


    const API_KEY = '你的API_Key';

    改成：
    JavaScript


    const API_KEY = 'sk-EsbZd1Gl8j21gKrYlAImEQcbr8myT1raqgtqbdliLJZ9n3Jg';

    4. 保存
    按 Ctrl + S

    测试
    双击打开 ai-copywriter.html
    输入”奶茶”
    点 「生成文案」
    等 2-3 秒，看 Kimi 生成的真AI文案

    完成后
    ✅ 能生成真AI文案 → 上传到 GitHub，更新网站

    在这里你很大的概率会报错，按着我说的走

第 1 步：在 Kimi 平台查看你可用的模型

看你现在截图的左侧菜单：

  1. 点 「资源管理」（在左侧菜单里，”文件” 的上面）
  2. 或者点 「用量限制」（在 “API Key 管理” 下面）

点进去后，会显示你的账号能调用哪些模型。

第 2 步：截图给我

点「资源管理」或「用量限制」后，截图那个页面，我直接告诉你用哪个模型名。

如果还是找不到

你就直接试这三个模型名（一个一个试）：

  1. kimi-k3
  2. kimi-k2. 一般免费的都是这个

在代码里替换，保存刷新。

改代码（1分钟）

  1. Trae 里打开 ai-copywriter.html
  2. 按 Ctrl + F，搜索：plainmoonshot-v1-32k
  3. 改成：plainkimi-k2.6
  4. 按 Ctrl + S 保存

temperature 参数不支持 0.8，这个模型只能用 1。

改 temperature（1分钟）

  1. Trae 里打开 ai-copywriter.html
  2. 按 Ctrl + F，搜索：plaintemperature
  3. 找到：plaintemperature: 0.8
  4. 改成：plaintemperature: 1
  5. 按 Ctrl + S 保存
© 版权声明
文章版权归作者所有，未经允许请勿转载。
THE END
学习笔记
喜欢就支持一下吧
点赞10 分享
yanzhi的头像-衍挚资源站
15.装 Python-衍挚资源站
15.装 Python
15.装 Python
19小时前 49
11.今天加这3个功能-衍挚资源站
11.今天加这3个功能
11.今天加这3个功能
20小时前 48
3.网页计算器-衍挚资源站
3.网页计算器
3.网页计算器
前天 47
13.AI工作流（Agent）-衍挚资源站
13.AI工作流（Agent）
13.AI工作流（Agent）
20小时前 46
7.把这个加到作品集网站里-衍挚资源站
7.把这个加到作品集网站里
7.把这个加到作品集网站里
前天 42
16.安装 Flask-衍挚资源站
16.安装 Flask
16.安装 Flask
19小时前 41
相关推荐
15.装 Python-衍挚资源站
15.装 Python
15.装 Python
19小时前 49
11.今天加这3个功能-衍挚资源站
11.今天加这3个功能
11.今天加这3个功能
20小时前 48
3.网页计算器-衍挚资源站
3.网页计算器
3.网页计算器
前天 47
13.AI工作流（Agent）-衍挚资源站
13.AI工作流（Agent）
13.AI工作流（Agent）
20小时前 46
7.把这个加到作品集网站里-衍挚资源站
7.把这个加到作品集网站里
7.把这个加到作品集网站里
前天 42
16.安装 Flask-衍挚资源站
16.安装 Flask
16.安装 Flask
19小时前 41
评论 抢沙发

请登录后发表评论

    暂无评论内容