基于表单下拉选择器动态分配Mailchimp用户标签的实现教程

<form action="/" method="post">
    <div class="mb-3">
        <label for="firstName" class="form-label">名</label>
        <input type="text" class="form-control" id="firstName" name="firstName" required>
    </div>
    <div class="mb-3">
        <label for="lastName" class="form-label">姓</label>
        <input type="text" class="form-control" id="lastName" name="lastName" required>
    </div>
    <div class="mb-3">
        <label for="email" class="form-label">邮箱</label>
        <input type="email" class="form-control" id="email" name="email" required>
    </div>

    <div class="dropdown me-1 mb-3">
        <label for="dropDown" class="form-label">选择您的兴趣</label>
        <select name="dropDown" id="dropDown" class="form-select">
            <option value="">请选择一个选项</option>
            <option value="B2B">企业对企业 (Business to Business)</option>
            <option value="B2C">企业对消费者 (Business to Consumer)</option>
        </select>
    </div>

    <button type="submit" class="btn btn-primary">订阅</button>
</form>

const express = require('express');
const bodyParser = require('body-parser');
const request = require('request'); // 假设您使用request库与Mailchimp API交互

const app = express();
const PORT = process.env.PORT || 3000;

// 配置body-parser来解析POST请求体
app.use(bodyParser.urlencoded({ extended: true }));
app.use(express.static("public")); // 如果有静态文件，如CSS
app.set('view engine', 'ejs'); // 设置EJS为模板引擎

// GET 请求：渲染表单页面
app.get('/', (req, res) => {
    res.render('index'); // 渲染包含表单的EJS模板
});

// POST 请求：处理表单提交
app.post('/', (req, res) => {
    // 从请求体中获取用户输入
    const firstName = req.body.firstName;
    const lastName = req.body.lastName;
    const email = req.body.email;
    const selectedTag = req.body.dropDown; // 获取下拉选择的值

    // 构建发送给Mailchimp API的数据
    const data = {
        status: "subscribed", // 订阅状态
        members: [
            {
                email_address: email,
                status: "subscribed",
                merge_fields: {
                    FNAME: firstName,
                    LNAME: lastName,
                },
                tags: [selectedTag], // 将下拉选择的标签值添加到tags数组
            }
        ]
    };

    // 将数据转换为JSON字符串
    const jsonData = JSON.stringify(data);

    // Mailchimp API 配置 (请替换为您的实际API Key和List ID)
    const mailchimpApiKey = "YOUR_MAILCHIMP_API_KEY"; // 您的Mailchimp API Key
    const mailchimpListId = "YOUR_MAILCHIMP_LIST_ID"; // 您的Mailchimp List ID
    const mailchimpServerPrefix = mailchimpApiKey.split('-')[1]; // 例如：us1, us2等

    const options = {
        url: `https://${mailchimpServerPrefix}.api.mailchimp.com/3.0/lists/${mailchimpListId}`,
        method: "POST",
        headers: {
            Authorization: `auth ${mailchimpApiKey}` // Mailchimp API认证
        },
        body: jsonData
    };

    // 发送请求到Mailchimp API
    request(options, (error, response, body) => {
        if (error) {
            console.error("Error sending to Mailchimp:", error);
            res.status(500).send("订阅失败，请稍后再试。");
        } else {
            const responseBody = JSON.parse(body);
            if (response.statusCode === 200 || response.statusCode === 201) {
                console.log("Mailchimp API Response:", responseBody);
                res.send("订阅成功！"); // 或重定向到成功页面
            } else {
                console.error("Mailchimp API Error:", response.statusCode, responseBody.detail || body);
                res.status(response.statusCode).send(`订阅失败: ${responseBody.detail || "未知错误"}`);
            }
        }
    });
});

app.listen(PORT, () => {
    console.log(`Server is running on port ${PORT}`);
});