یک اتوماسیون خبرنامه مفید با Node و Google Spreadsheet ایجاد کنید 🧑‍💻

سلام به همه 👋،

امروز به شما نشان می دهم که چگونه اخیراً از Mailchimp به یک راه حل داخلی تغییر داده ام برای ذخیره ایمیل های من با Node API و Google Spreadsheet.

در اینجا نحوه استفاده را خواهیم دید Recaptcha و تعامل با a صفحه گسترده گوگل

برای این آموزش، من به صورت داخلی از برنامه سندباکس خود، Znote برای نمونه سازی، استقرار و بزرگ کردن تمام کارهایم استفاده می کنم. در پایان پیوند دستور پخت قابل کپی را مستقیماً در برنامه خواهید یافت، در غیر این صورت مشکلی از ابزار مورد علاقه خود استفاده نکنید

چطور کار میکند؟

ما یک Node Backend با Express و Recaptcha خواهیم ساخت (برای جلوگیری از اسپم). ایمیل های دریافتی از یک فرم HTML ارسال شده و به صفحه گسترده Google ارسال می شوند.

پیش نیازها

یک کپچا ایجاد کنید

https://www.google.com/recaptcha/admin

• یک سایت جدید ایجاد کنید
• اضافه کردن میزبان محلی و دامنه وب سایت شما در لیست دامنه ها
  
• کلیدهای خود را کپی کنید (عمومی و خصوصی)
  

صفحه گسترده گوگل

👉 Sheet API خود را فعال کنید

به Google Developers Console بروید

• پروژه خود را انتخاب کنید یا یک پروژه جدید ایجاد کنید (و سپس آن را انتخاب کنید)
  
• Sheets API را برای پروژه خود فعال کنید
• در نوار کناری سمت چپ، APIs & Services > Library را انتخاب کنید
• جستجو برای “برگ”
• روی “Google Sheets API” کلیک کنید
• روی دکمه آبی “فعال کردن” کلیک کنید
  

دستورالعمل های راه اندازی برای حساب خدمات
مراحل بالا را برای راه‌اندازی پروژه و فعال کردن Sheets API دنبال کنید

1. یک حساب کاربری ایجاد کنید برای پروژه شما
   • در نوار کناری سمت چپ، APIs & Services > Credentials را انتخاب کنید
   • روی آبی رنگ “+ CREATE CREDENTIALS” کلیک کنید و گزینه “Service account” را انتخاب کنید
   • نام، توضیحات را وارد کنید، روی “ایجاد” کلیک کنید
   • می‌توانید از مجوزها صرفنظر کنید، روی «ادامه» کلیک کنید
     
2. روی “+” کلیک کنید ایجاد کلید” دکمه
   • گزینه نوع کلید “JSON” را انتخاب کنید
   • روی دکمه “ایجاد” کلیک کنید
   • فایل کلید JSON شما تولید و در دستگاه شما دانلود می شود (این تنها کپی است!)
   • روی “انجام شد” کلیک کنید
     
   • آدرس ایمیل حساب سرویس خود را یادداشت کنید (در فایل کلید JSON نیز موجود است)
3. سند را به اشتراک بگذارید (یا اسناد) با حساب سرویس خود با استفاده از ایمیل ذکر شده در بالا
   • باز کن service_account.json فایل و پیدا کنید client_email ویژگی.
   • در صفحه گسترده گوگل خود، روی دکمه اشتراک گذاری در بالا سمت راست کلیک کنید و آدرس ایمیل حساب سرویس را به عنوان ویرایشگر اضافه کنید.
     

Doc

NPM: google-spreadsheet
Doc: احراز هویت صفحه گسترده Google
سند API برگه Google

نصب و راه اندازی

کلید json حساب سرویس Google خود را در پوشه توسعه دهنده خود کپی کنید

وابستگی NPM را نصب کنید

npm i -S google-spreadsheet
npm i -S express
npm i -S body-parser
npm i -S node-fetch@^2.6.6

کد خبرنامه

اکنون آماده کدنویسی فرم HTML و باطن خبرنامه خود هستیم

فرم خبرنامه
یک فرم خبرنامه ساده با Google recaptcha ایجاد کنید

<script src="https://www.google.com/recaptcha/api.js"></script>
<form id="demo-form" action="http://localhost:4000/subscribe" method="POST">
    Email: <input type="text" value="name@domain.com" name="email" id="email" required>
    <button class="g-recaptcha" 
    data-sitekey="YOUR_PUBLIC_CAPTCHA_KEY" 
    data-callback='onSubmit' 
    data-action='submit'>Submit</button>
</form>
<script>
function onSubmit(token) {
    document.getElementById("demo-form").submit();
}
</script>

برای استفاده از Recaptcha باید فایل HTML خود را در لوکال هاست سرویس کنید.
می توانید این کار را با http-server برای Node انجام دهید

npm install --global http-server
http-server .

و http://localhost:8080 را باز کنید

سرور
در حال حاضر باطن گره برای دریافت ایمیل.

const express = require('express')
const bodyParser = require('body-parser');
const fetch = require('node-fetch');
const fs = require('node:fs');
const app = express()

app.post('/subscribe', 
    express.urlencoded({extended: true}), async (request, response) => {
  const data = new URLSearchParams();
  data.append('secret', 'YOUR_PRIVATE_CAPTCHA_KEY'); // private key
  data.append('response', request.body["g-recaptcha-response"]);

  const result = await fetch("https://www.google.com/recaptcha/api/siteverify", {
    body: data,
    method: "post"
  });
  const json = await result.json();
  if (json.success) {
    // captcha succeeded
    print(`email to add: ${request.body.email}`)
    return;
  }
})
app.listen(4000)

صفحه گسترده گوگل

در این مرحله، اکنون می توانید ایمیل ها را در Node API خود منتشر کنید.
اکنون می خواهیم ایمیل ها را در صفحه گسترده گوگل آپلود کنیم.
شما قبلاً API صفحه گسترده Google خود را فعال کرده اید و فایل کلید json خود را در آن کپی کرده اید پوشه

کد صفحه گسترده گوگل
بیایید شروع به هک کردن برخی از کدها با استفاده از Google Spreadsheet کنیم

const { GoogleSpreadsheet } = require('google-spreadsheet');
const creds = require('./google-spreadsheet-key.json');

// Initialize the sheet - doc ID is the long id in the sheets URL
const doc = new GoogleSpreadsheet('YOUR_SPREADSHEET_ID');
await doc.useServiceAccountAuth(creds);
await doc.loadInfo();
const sheet = doc.sheetsByIndex[0];

const newEmail = "tony3@gmail.com";

// read rows
const rows = await sheet.getRows();
const isExists = rows.map(r => r.email).includes(newEmail);
if (!isExists) {
    await sheet.addRow({ email: newEmail });    
}

همه را به هم وصل کنید

const express = require('express')
const bodyParser = require('body-parser');
const fetch = require('node-fetch');
const fs = require('node:fs');
const { GoogleSpreadsheet } = require('google-spreadsheet');
const creds = require('./google-spreadsheet-key.json');
const app = express()

// Initialize the sheet - doc ID is the long id in the sheets URL
const doc = new GoogleSpreadsheet('YOUR_SPREADSHEET_ID');
await doc.useServiceAccountAuth(creds);
await doc.loadInfo();
const sheet = doc.sheetsByIndex[0];

app.post('/subscribe', 
    express.urlencoded({extended: true}), async (request, response) => {
  try {
    const data = new URLSearchParams();
    data.append('secret', 'YOUR_PRIVATE_CAPTCHA_KEY'); // private key
    data.append('response', request.body["g-recaptcha-response"]);

    const result = await fetch("https://www.google.com/recaptcha/api/siteverify", {
        body: data,
        method: "post"
    });
    const json = await result.json();
    if (json.success) {
        const newEmail = request.body.email;
        // publish if email does not exist
        const rows = await sheet.getRows();
        const isExists = rows.map(r => r.email).includes(newEmail);
        if (!isExists) {
            await sheet.addRow({ email: newEmail });    
            // captcha succeeded
            print(`email to add: ${newEmail}`)
        }
        return response.send("done");
    }
  } catch(err) {
    return response.send("error");
  }

})
app.listen(4000)

سپس 🎉🥳

به طور خلاصه

اکنون می‌دانید که چگونه از یک کپچا استفاده کنید و چگونه یک صفحه گسترده Google را برای خودکار کردن هر فرآیند مشابه متصل و دستکاری کنید.

👉 امیدوارم این مثال برای شما الهام بخش باشد! آیا این مقاله برای شما مفید بود؟ اگر چنین است، من مثال های زیادی برای به اشتراک گذاشتن با شما دارم: دستور پخت

در زیر دستور پخت آماده را مشاهده خواهید کرد:
https://recipe.znote.io/recipes/make-newsletter-with-node-and-google-spreadsheet?td=dark

برو جلوتر

اگر به دنبال یک زمین بازی JS کارآمد برای ادامه نمونه سازی هستید، به برنامه من نگاهی بیندازید 👉 اینجا (از نظر دادن خوشحال میشم)

در همین حال، شروع به تبدیل کارهای روزانه خود به چیزی آسان و قابل تکرار کنید و کار شما سرگرم کننده تر خواهد بود. 🌈️

شما می توانید وبلاگ من 👉 اینجا را بررسی کنید

و فراموش نکنید که در خبرنامه من مشترک شوید! 😄