Cara Menerima Mesej pada Discord dengan Fungsi Cloudflare-tutorial js-php.cn

Cara Menerima Mesej pada Discord dengan Fungsi Cloudflare

WBOY

Lepaskan： 2024-07-19 16:26:32

asal

1065 orang telah melayarinya

Como Receber Mensagens no Discord com Cloudflare Functions

Cara menerima mesej daripada borang HTML terus pada Discord anda menggunakan Cloudflare Pages dan Fungsi Cloudflare.

Kami akan membahagikan proses kepada empat bahagian utama: mencipta borang HTML, mengkonfigurasi webhook pada Discord, mengkonfigurasi Worker on Cloudflare dan Menetapkan projek.

Mencipta Borang HTML

Pertama, anda memerlukan borang HTML untuk mengumpul data pengguna. Bentuk asas mungkin kelihatan seperti ini:

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <title>Formulário de Contato</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
  </head>
  <body>
    <form method="POST" action="/api/submit">
      <label for="name">Nome:</label>
      <input id="name" name="name" type="text" required>

      <label for="email">Email:</label>
      <input id="email" name="email" type="email" required>

      <label for="subject">Assunto:</label>
      <input id="subject" name="subject" type="text" required>

      <label for="message">Mensagem:</label>
      <textarea id="message" name="message" required></textarea>

      <button type="submit">Enviar</button>
    </form>
  </body>
</html>

Salin selepas log masuk

Borang ini menghantar permintaan POST ke titik akhir /api/submit apabila pengguna mengklik "Serah".

Mengkonfigurasi Discord Webhook

Untuk menerima mesej di Discord, anda perlu menyediakan webhook. Ikuti langkah di bawah:

Buat Saluran Discord: Jika anda belum mempunyai saluran khusus, buat satu pada pelayan Discord anda.
Konfigurasikan Webhook: Pergi ke "Tetapan Saluran" > "Integrasi" > "Webhooks" dan klik "Buat Webhook".
Namakan Webhook: Beri nama webhook anda dan salin URL yang dijana.

Mengkonfigurasi Halaman Cloudflare dan Pekerja

Sekarang anda mempunyai borang dan webhook dikonfigurasikan, tiba masanya untuk mengkonfigurasi Cloudflare Worker untuk memproses permintaan dan menghantar mesej kepada Discord.

1: Buat Projek di GitHub

Buat repositori di GitHub untuk projek anda. Dalam terminal anda, klon repositori dan konfigurasikan struktur projek:

mkdir meu-projeto
cd meu-projeto
git init
git remote add origin git@github.com:<seu-usuario>/<seu-repositorio>.git

Salin selepas log masuk

2: Struktur Projek

Atur projek anda seperti berikut:

meu-projeto
├── functions
│   └── api
│       └── submit.js
└── public
    └── index.html

Salin selepas log masuk

3: Konfigurasikan Pekerja

Dalam fail functions/api/submit.js, tambahkan kod berikut untuk memproses borang dan hantar mesej kepada Discord:

export async function onRequestPost(ctx) {
    try {
        return await handleRequest(ctx);
    } catch(e) {
        return new Response(`${e.message}\n${e.stack}`, { status: 500 });
    }
}

async function handleRequest({ request, env }) {
    const data = await request.formData();

    const name = data.get('name');
    const email = data.get('email');
    const subject = data.get('subject');
    const message = data.get('message');
    const captcha = data.get('h-captcha-response');

    if (!name || !email || !subject || !message || !captcha) {
        return new Response('Verifique se os campos estão preenchidos!', { status: 400 });
    }

    const captchaVerified = await verifyHcaptcha(
        captcha,
        request.headers.get('cf-connecting-ip'),
        env.HCAPTCHA_SECRET,
        env.HCAPTCHA_SITE_KEY
    );

    if (!captchaVerified) {
        return new Response('Captcha inválido!', { status: 400 });
    }

    await sendDiscordMessage(name, email, subject, message, env.DISCORD_WEBHOOK_URL);

    return new Response('OK');
}

async function verifyHcaptcha(response, ip, secret, siteKey) {
    const res = await fetch('https://hcaptcha.com/siteverify', {
        method: 'POST',
        headers: {
            'Content-Type': 'application/x-www-form-urlencoded',
        },
        body: `response=${response}&remoteip=${ip}&secret=${secret}&sitekey=${siteKey}`
    });

    const json = await res.json();
    return json.success;
}

async function sendDiscordMessage(name, email, subject, message, webhookUrl) {
    await fetch(webhookUrl, {
        method: 'POST',
        headers: {
            'Content-Type': 'application/json',
        },
        body: JSON.stringify({
            username: 'Formulário de Contato',
            embeds: [{
                color: 0x0099ff,
                title: 'Nova Mensagem',
                fields: [
                    {
                        name: 'Nome',
                        value: name,
                        inline: true,
                    },
                    {
                        name: 'Email',
                        value: email,
                        inline: true,
                    },
                    {
                        name: 'Assunto',
                        value: subject,
                    },
                    {
                        name: 'Mensagem',
                        value: "```

" + message + "

```",
                    }
                ]
            }]
        }),
    });
}

Salin selepas log masuk

Sebarkan

Dengan segala-galanya dikonfigurasikan, mari gunakan projek:

Komit dan tolak kod ke GitHub:

git add .
git commit -m "Projeto configurado"
git push origin main

Salin selepas log masuk

Dalam Cloudflare Pages, sambungkan repositori GitHub, pilih cawangan utama dan tetapkan output binaan kepada awam.
Untuk mengelak daripada mendedahkan kunci dan tetapan sensitif anda, konfigurasikan pembolehubah persekitaran dalam Cloudflare Pages. Akses papan pemuka Halaman Cloudflare anda. Pilih projek dan pergi ke Tetapan > Pembolehubah Persekitaran. Tambah pembolehubah berikut:
- DISCORD_WEBHOOK_URL dengan URL webhook Discord.
- HCAPTCHA_SECRET dengan rahsia hCaptcha.
- HCAPTCHA_SITE_KEY dengan kunci tapak web hCaptcha.

Selepas persediaan, tapak web anda akan boleh diakses melalui subdomain *.pages.dev dan sedia untuk digunakan. Apabila pengguna menyerahkan borang, mesej akan dihantar terus ke saluran Discord anda.

Tahniah! Anda telah berjaya mengkonfigurasi borang HTML yang menghantar mesej kepada Discord menggunakan Fungsi Cloudflare.

Atas ialah kandungan terperinci Cara Menerima Mesej pada Discord dengan Fungsi Cloudflare. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!