شروع سریع جاوا اسکریپت

برنامه وب جاوا اسکریپتی ایجاد کنید که درخواست‌هایی به Gmail API ارسال کند.

شروع‌های سریع نحوه راه‌اندازی و اجرای برنامه‌ای را که میانای برنامه‌سازی کاربردی Google Workspace را فراخوانی می‌کند توضیح می‌دهند. این شروع سریع از یک رویکرد اصالت‌سنجی ساده‌شده استفاده می‌کند که برای محیط آزمایشی مناسب است. برای محیط تولید، توصیه می‌کنیم قبل‌از انتخاب اطلاعات کاربری دسترسی مناسب برای برنامه‌تان، درباره اصالت‌سنجی و صدور مجوز اطلاعات کسب کنید.

این شروع سریع از کتابخانه‌های کارخواه میانای برنامه‌سازی کاربردی توصیه‌شده Google Workspace برای مدیریت برخی جزئیات جریان اصالت‌سنجی و صدور مجوز استفاده می‌کند.

اهداف اصلی

  • محیط را راه‌اندازی کنید.
  • نمونه را راه‌اندازی کنید.
  • نمونه را اجرا کنید.

پیش‌نیازها

  • حساب Google با Gmail فعال‌شده.

راه‌اندازی محیط

برای تکمیل این شروع سریع، محیط خود را راه‌اندازی کنید.

فعال کردن میانای برنامه‌سازی کاربردی

قبل‌از استفاده از Google API، باید آن‌ها را در پروژه Google Cloud روشن کنید. می‌توانید یک یا چند میانای برنامه‌سازی کاربردی را در یک پروژه Google Cloud روشن کنید.

پیکربندی صفحه کسب رضایت OAuth

اگر از پروژه Google Cloud جدیدی برای تکمیل این شروع سریع استفاده می‌کنید، صفحه رضایت OAuth را پیکربندی کنید. اگر قبلاً این مرحله را برای پروژه Cloud خود تکمیل کرده‌اید، به بخش بعدی بروید.

  1. در «کنسول Google API»، به «منو» > پلاتفرم Google Auth > نمانام‌سازی بروید.

    رفتن به نمانام‌سازی

  2. اگر قبلاً پلاتفرم Google Auth را پیکربندی کرده‌اید، می‌توانید تنظیمات «صفحه رضایت OAuth» زیر را در نمانام‌سازی، مخاطب، و دسترسی به داده پیکربندی کنید. اگر پیامی با این مضمون دیدید که پلاتفرم Google Auth هنوز پیکربندی نشده است، روی شروع به کار کلیک کنید:
    1. در بخش اطلاعات برنامه، در قسمت نام برنامه، نامی برای برنامه وارد کنید.
    2. در ایمیل پشتیبانی کاربر، نشانی ایمیل پشتیبانی را انتخاب کنید تا کاربران بتوانند درصورت داشتن سؤال درباره رضایتشان با شما تماس بگیرند.
    3. روی بعدی کلیک کنید.
    4. در بخش مخاطبان، داخلی را انتخاب کنید.
    5. روی بعدی کلیک کنید.
    6. در بخش اطلاعات تماس، نشانی ایمیلی را وارد کنید که بتوانید ازطریق آن از هرگونه تغییر در پروژه‌تان مطلع شوید.
    7. روی بعدی کلیک کنید.
    8. در بخش پایان، خط‌مشی داده‌های کاربر سرویس‌های Google API را مرور کنید و اگر موافقید، با «خط‌مشی داده‌های کاربر سرویس‌های Google API» موافقم را انتخاب کنید.
    9. روی ادامه کلیک کنید.
    10. روی ایجاد کردن کلیک کنید.
  3. فعلاً می‌توانید از افزودن گستره‌ها صرف‌نظر کنید. در آینده، وقتی برنامه‌ای برای استفاده در خارج از سازمان Google Workspace خود ایجاد می‌کنید، باید نوع کاربر را به خارجی تغییر دهید. سپس گستره‌های مجوزی را که برنامه‌تان نیاز دارد اضافه کنید. برای کسب اطلاعات بیشتر، راهنمای کامل پیکربندی رضایت OAuth را ببینید.

مجاز کردن اطلاعات اعتباری برای برنامه وب

برای اصالت‌سنجی کاربران نهایی و دسترسی به داده‌های کاربر در برنامه‌تان، باید یک یا چند شناسه کارخواه OAuth 2.0 ایجاد کنید. از شناسه کارخواه برای شناسایی یک برنامه در سرورهای OAuth Google استفاده می‌شود. اگر برنامه‌تان در چند پلاتفرم اجرا می‌شود، باید برای هر پلاتفرم شناسه کارخواه جداگانه‌ای ایجاد کنید.
  1. در «کنسول Google Cloud»، به «منو» > پلاتفرم Google Auth > کارخواه‌ها بروید.

    رفتن به «کارخواه‌ها»

  2. روی ایجاد مشتری کلیک کنید.
  3. روی نوع برنامه > برنامه وب کلیک کنید.
  4. در فیلد نام، نامی برای اطلاعات کاربری تایپ کنید. این نام فقط در Google Cloud Console نشان داده می‌شود.
  5. شناسه‌های منبع یکسان مجاز مربوط به برنامه‌تان را اضافه کنید:
    • برنامه‌های سمت کارخواه (جاوا اسکریپت)–در بخش مبادی مجاز جاوا اسکریپت، روی افزودن شناسه منبع یکسان کلیک کنید. سپس، شناسه منبع یکسانی را برای استفاده در درخواست‌های مرورگر وارد کنید. این بخش دامنه‌هایی را که برنامه‌تان می‌تواند از آن‌ها درخواست‌های میانای برنامه‌سازی کاربردی به سرور OAuth 2.0 ارسال کند شناسایی می‌کند.
    • برنامه‌های سمت سرور (Java،‏ Python، و غیره)–در بخش URIهای هدایت مجاز، روی افزودن URI کلیک کنید. سپس، یک URI نقطه پایان وارد کنید که سرور OAuth 2.0 بتواند پاسخ‌ها را به آن ارسال کند.
  6. اختیاری: اگر برنامه‌تان عامل هوش مصنوعی است که ازطرف کاربران اقدام می‌کند، استفاده از این کارخواه برای عامل مجهز به هوش مصنوعی را انتخاب کنید. اگر برنامه‌تان هم از گردش‌های کاری عامل هوش مصنوعی و هم از ویژگی‌های استاندارد کاربر پشتیبانی می‌کند، برای هرکدام کارخواه OAuth جداگانه‌ای ایجاد کنید. بعداز ایجاد کردن کارخواه نمی‌توانید این تنظیم را تغییر دهید.
  7. روی ایجاد کردن کلیک کنید.

    اعتبارنامه جدیدی که ایجاد شده است در بخش شناسه‌های کارخواه OAuth 2.0 نشان داده می‌شود.

    توجه داشته باشید که از رمزهای کارخواه برای برنامه‌های وب استفاده نمی‌شود.

  8. شناسه کارخواه را برای استفاده بعدی در این شروع سریع ذخیره کنید.

ایجاد کلید میانای API (کلید میانای برنامه‌سازی کاربردی)

  1. در کنسول Google Cloud، به «منو» > میاناهای برنامه‌سازی کاربردی و سرویس‌ها > اطلاعات کاربری بروید.

    رفتن به «اطلاعات کاربری»

  2. روی ایجاد اطلاعات کاربری > کلید API کلیک کنید.
  3. کلید میانای API جدیدتان نمایش داده می‌شود.
    • روی «کپی کردن» کلیک کنید تا کلید میانای API شما برای استفاده در کد برنامه‌تان کپی شود. کلید میانای API را می‌توانید در بخش «کلیدهای میانای API» در اعتبارنامه‌های پروژه‌تان نیز پیدا کنید.
    • برای جلوگیری از استفاده غیرمجاز، توصیه می‌کنیم مکان و میاناهای برنامه‌سازی کاربردی‌ای را که کلید میانای برنامه‌سازی کاربردی می‌تواند در آن‌ها استفاده شود محدود کنید. برای جزئیات بیشتر، افزودن محدودیت‌های API را ببینید.

راه‌اندازی نمونه

  1. در فهرست راهنمای کاری‌تان، فایلی با نام index.html ایجاد کنید.
  2. در فایل index.html، کد نمونه زیر را جای‌گذاری کنید:

    gmail/quickstart/index.html
    <!DOCTYPE html>
    <html>
      <head>
        <title>Gmail API Quickstart</title>
        <meta charset="utf>-8&<quot;> /
    <  /h>ead
     < >body
        pGmail API <Qu>icksta<rt/p
    
        !--Add buttons to initiate auth sequence and >sign <out--
        button id="authorize_button" onclick>="ha<ndleAut>hClic<k()"Authorize/button
        button id="signout_but>ton"<; oncli>ck=&qu<ot;handleSignoutClick()"Sign Out/button
    
     ><   p>re id=<"content" style=&qu>ot;white-space: pre-wrap;"/pre
    
        script type="text/javascript"
          /* exported gapiLoaded */
          /* exported gisLoaded */
          /* exported handleAuthClick */
          /* exported handleSignoutClick */
    
          // TODO(developer): S<et to client I>D and API key from the Dev<eloper Conso>le
          const CLIENT_ID = 'YOUR_CLIENT_ID';
          const API_KEY = 'YOUR_API_KEY';
    
          // Discovery doc URL for APIs used by the quickstart
          const DISCOVERY_DOC = 'https://www.googleapis.com/discovery/v1/apis/gmail/v1/rest';
    
          // Authorization scopes required by the API; multiple scopes can be
          // included, separated by spaces.
          const SCOPES = 'https://www.googleapis.com/auth/gmail.readonly';
    
          let tokenClient;
          let gapiInited = false;
          let gisInited = false;
    
          document.getElementById('authorize_button').style.visibility = 'hidden';
          document.getElementById('signout_button').style.visibility = 'hidden';
    
          /**
           * Callback after api.js is loaded.
           */
          function gapiLoaded() {
            gapi.load('client', initializeGapiClient);
          }
    
          /**
           * Callback after the API client is loaded. Loads the
           * discovery doc to initialize the API.
           */
          async function initializeGapiClient() {
            await gapi.client.init({
              apiKey: API_KEY,
              discoveryDocs: [DISCOVERY_DOC],
            });
            gapiInited = true;
            maybeEnableButtons();
          }
    
          /**
           * Callback after Google Identity Services are loaded.
           */
          function gisLoaded() {
            tokenClient = google.accounts.oauth2.initTokenClient({
              client_id: CLIENT_ID,
              scope: SCOPES,
              callback: '', // defined later
            });
            gisInited = true;
            maybeEnableButtons&&();
          }
    
          /**
           * Enables user interaction after all libraries are loaded.
           */
          function maybeEnableButtons() {
            if (gapiInited  gisInited) {
              document.getElementById('authorize_button').style.visibility = 'vis>ible';
            }
          }
    
          /**
           *  Sign in the user upon button click.
           */
          function handleAuthClick() {
            tokenClient.callback = async (resp) = {
              if (resp.error !== undefined) {
                throw (resp);
              }
              document.getElementById('signout_button').style.visibility = 'visible';
              document.getElementById('authorize_button').innerText = 'Refresh';
              await listLabels();
            };
    
            if (gapi.client.getToken() === null) {
              // Prompt the user to select a Google Account and ask for consent to share their data
              // when establishing a new session.
              tokenClient.requestAccessToken({prompt: 'consent'});
            } else {
              // Skip display of account chooser and consent dialog for an existing session.
              tokenClient.requestAccessToken({prompt: ''});
            }
          }
    
          /**
           *  Sign out the user upon button click.
           */
          function handleSignoutClick() {
            const token = gapi.client.getToken();
            if (token !== null) {
              google.accounts.oauth2.revoke(token.access_token);
              gapi.client.setToken('');
              document.getElementById('content').innerText = '';
              document.getElementById('authorize_button').innerText = 'Authorize';
              document.getElementById('signout_button').style.visibility = 'hidden';
            }
          }
    
          /**
           * Print all Labels in the authorized user's inbox. If no labels
           * are found an appropriate message is printed.
           */
          async function listLabels() {
            let response;
            try {
              response = await gapi.client.gmail.users.labels.list({
                'userId': 'me',
              });
            } catch (err) {
              document.getElementById('content').innerText = err.message;
              return;
       >     }
            const labels = response.result.labels;
            if (!labels || labels.length == 0) {
              document.getElemen<tById(&>#39;c<ontent').innerText = 'No labels found.';
              return;
            }><
          >  // <Flatten to string to display
            const output = labels.reduce(
                (str,>< label)> = <`${st>r<}${la>bel.name}\n`,
                'Labels:\n');
            document.getElementById('content').innerText = output;
          }
        /script
        script async defer src="https://apis.google.com/js/api.js" onload="gapiLoaded()"/script
        script async defer src="https://accounts.google.com/gsi/client" onload="gisLoaded()"/script
      /body
    /html

    موارد زیر را جایگزین کنید:

اجرای نمونه

  1. در دایرکتوری کاری‌تان، بسته http-server را نصب کنید:

    npm install http-server
    
  2. در فهرست راهنمای کاری‌تان، سرور وب را راه‌اندازی کنید:

    npx http-server -p 8000
    
  1. در مرورگر، به http://localhost:8000 بروید.
  2. درخواستی برای مجاز کردن دسترسی می‌بینید:
    1. اگر ازقبل به سیستم «حساب Google» خود وارد نشده‌اید، وقتی از شما خواسته شد به سیستم وارد شوید. اگر به سیستم چند حساب وارد شده‌اید، یک حساب را برای استفاده جهت صدور مجوز انتخاب کنید.
    2. روی Accept (پذیرش) کلیک کنید.

برنامه جاوا اسکریپت شما اجرا می‌شود و Gmail API را فراخوانی می‌کند.

مراحل بعدی