Google Apps Script published web app doesn't work if link link clicked in Gmail

49 Views Asked by At

I have tow problem regarding Gmail and my published app script web app, I'm receiving my customers registration data to my Google sheet, then I used app script to create suitable email to the customer according to his entries, but here are my problems:

  • Embedded PayPal code: Gmail doesn't show PayPal buttons in the email sent to the customer, due this buttons created by JavaScript function, because of this problem, i have created new app script project containing PayPal codes, and it works correctly after has been published, here's my PayPal code:

    
      function initPayPalButton() {
        var shipping = 0;
        var itemOptions = document.querySelector("#smart-button-container #item-options");
    var quantity = parseInt();
    var quantitySelect = document.querySelector("#smart-button-container #quantitySelect");
    if (!isNaN(quantity)) {
      quantitySelect.style.visibility = "visible";
    }
    var orderDescription = 'اختر المبلغ الذي تود دفعه من القائمة المنسدلة';
    if(orderDescription === '') {
      orderDescription = 'Item';
    }
    paypal.Buttons({
      style: {
        shape: 'pill',
        color: 'gold',
        layout: 'vertical',
        label: 'paypal',
        
      },
      createOrder: function(data, actions) {
        var selectedItemDescription = itemOptions.options[itemOptions.selectedIndex].value;
        var selectedItemPrice = parseFloat(itemOptions.options[itemOptions.selectedIndex].getAttribute("price"));
        var tax = (12 === 0 || false) ? 0 : (selectedItemPrice * (parseFloat(12)/100));
        if(quantitySelect.options.length > 0) {
          quantity = parseInt(quantitySelect.options[quantitySelect.selectedIndex].value);
        } else {
          quantity = 1;
        }

        tax *= quantity;
        tax = Math.round(tax * 100) / 100;
        var priceTotal = quantity * selectedItemPrice + parseFloat(shipping) + tax;
        priceTotal = Math.round(priceTotal * 100) / 100;
        var itemTotalValue = Math.round((selectedItemPrice * quantity) * 100) / 100;

        return actions.order.create({
          purchase_units: [{
            description: orderDescription,
            amount: {
              currency_code: 'USD',
              value: priceTotal,
              breakdown: {
                item_total: {
                  currency_code: 'USD',
                  value: itemTotalValue,
                },
                shipping: {
                  currency_code: 'USD',
                  value: shipping,
                },
                tax_total: {
                  currency_code: 'USD',
                  value: tax,
                }
              }
            },
            items: [{
              name: selectedItemDescription,
              unit_amount: {
                currency_code: 'USD',
                value: selectedItemPrice,
              },
              quantity: quantity
            }]
          }]
        });
      },
      onApprove: function(data, actions) {
        return actions.order.capture().then(function(orderData) {
          
          // Full available details
          console.log('Capture result', orderData, JSON.stringify(orderData, null, 2));

          // Show a success message within this page, e.g.
          const element = document.getElementById('paypal-button-container');
          element.innerHTML = '';
          element.innerHTML = '<h3>Thank you for your payment!</h3>';

          // Or go to another URL:  
          actions.redirect('https://www.alhuqebi.com/thank_you');

        });
      },
      onError: function(err) {
        console.log(err);
      },
    }).render('#paypal-button-container');
  }
  initPayPalButton();
  
    

and the Html code for this PayPal is as the following:

  <div id="smart-button-container">
      <div dir="rtl" style="text-align: center;">
        <div style="margin-bottom: 1.25rem;">
          <h4 style="text-align: right;">اختر المبلغ الذي تود دفعه من القائمة المنسدلة</h4>
          <select dir="rtl" Style="text-align:right;" id="item-options">
          <option value="البرنامج الرمضاني لتطوير المهارات" price="120">البرنامج الرمضاني لتطوير المهارات - 120 دولار</option>
                  <option value="البرنامج التدريبي المتكامل" price="200">البرنامج التدريبي المتكامل - 200 دولار</option>
          <option value="شراء كتاب دليلك الى رفع انتاجية النفط" price="25">شراء كتاب دليلك الى رفع انتاجية النفط - 25 دولار</option>
          <option value="برنامج الانتاج المتكامل" price="175">برنامج الانتاج المتكامل - 175 دولار</option>
          <option value="برنامج الانتاج المتكامل" price="90">برنامج الانتاج المتكامل - 90 دولار</option>
          <option value="جميع مستويات برنامج البايبسيم" price="75">جميع مستويات برنامج البايبسيم - 75 دولار</option>
          <option value="خدمة دعم رسالة الماجستير أو أطروحة الدكتوراه" price="400">خدمة دعم رسالة الماجستير أو أطروحة الدكتوراه - 400 دولار</option>
          <option value="خدمة دعم مشروعات التخرج" price="200">خدمة دعم مشروعات التخرج - 200 دولار</option>
          <option value="دفع قسط  في خدمة مشروع التخرج" price="100">دفع قسط  في خدمة مشروع التخرج - 100 دولار</option>
          <option id="abc" value="دورة تدريب خاصة حسب الطلب"price="300">دورة تدريب خاصة حسب الطلب - 300 دولار</option>
          <option value="دورة تدريب برنامج البتريل"price="25">دورة تدريب برنامج البتريل - 25 دولار</option>
          <option value="دورة تدريب برنامج الـ GAP"price="25">دورة تدريب برنامج الـ GAP - 25 دولار</option>
          <option value="دورة تدريب برنامج التكلوج"price="25">دورة تدريب برنامج التكلوج - 25 دولار</option>
          <option value="دورة تدريب برنامج الآي بي"price="25">دورة تدريب برنامج الآي بي - 25 دولار</option>
          <option value="دورة تدريب برنامج البايبسيم-مبتدئ"price="25">دورة تدريب برنامج البايبسيم-مبتدئ - 25 دولار</option>
                  <option value="دورة تدريب برنامج البايبسيم-متوسط"price="25">دورة تدريب برنامج البايبسيم متوسط - 25 دولار</option>
                  <option value="دورة تدريب برنامج البايبسيم-متقدم"price="25">دورة تدريب برنامج البايبسيم-متقدم - 25 دولار</option>
              <option value="جميع مستويات برنامج البايبسيم"price="75">جميع مستويات برنامج البايبسيم - 75 دولار</option>
              <option Selected value="دورة تدريب Kappa Emeraude 2020" price="30">دورة تدريب Kappa Emeraude 2020</option>
                  <option value="دورة تدريب برنامج البروسبار"price="25">دورة تدريب برنامج البروسبار - 25 دولار</option>
                  <option value="دورة تدريب برنامج الأولجا"price="25">دورة تدريب برنامج الأولجا - 25 دولار</option>
                  <option value="دورة تدريب برنامج الساب بمب"price="25">دورة تدريب برنامج الساب بمب - 25 دولار</option>
                  <option value="دورة تكنولوجيا حفر الآبار النفطية والغازية" price="25">دورة تكنولوجيا حفر الآبار النفطية والغازية - 25 دولار</option>
                  <option value="دورة تحكم وسيطرة آبار"price="25">دورة تحكم وسيطرة آبار - 25 دولار</option>
          <option value="دفع مبلغ" price="50">دفع مبلغ - 50 دولار</option>
          <option value="دفع مبلغ" price="40">دفع مبلغ - 40 دولار</option>
          <option value="30دفع مبلغ" price="30">دفع مبلغ - 30 دولار</option>
          <option value="25دفع مبلغ" price="25">دفع مبلغ - 25 دولار</option>
          <option value="20دفع مبلغ" price="20">دفع مبلغ - 20 دولار</option>
          <option value="10دفع مبلغ" price="10">دفع مبلغ - 10 دولار</option>
          <option value="320دفع مبلغ" price="320">دفع مبلغ - 320 دولار</option>
          <option value="156دفع مبلغ" price="156">دفع مبلغ - 156 دولار</option></select>
          <select style="visibility: hidden" id="quantitySelect"></select>
        </div>
      <div id="paypal-button-container"></div>
      </div>
    </div>
  • The second problem is that i was forced to send the payment link to the customer, so i entered the link into the sent email to the customer, but when he tries to click that link from Gmail, it shows him that script project isn't available, although if we open that ink in any browser it works correctly, the button code I've used inside Html email message is as the following:
<form class="paypal_form" style="position: relative; text-align: center">
<h2 style="text-align: right;"><span style="color: #800180;">طريقة الدفع الالكتروني </span>
</h2>
    <div style="text-align: center; width: 90%;">
    <h3> للدخول الى صفحة الدفع الالكتروني، اضغط الزر التالي</h3>
  
  
  
    <a href="https://script.google.com/macros/s/AKfycbx9WPk-wrWwVjtoF9PBZPu49clWxQVbBm8IYEcohcKbtGuEuOLzr1zVBaoHsbcWxffW/exec" style="margin-left: 0; margin-right: 0;"><img type="button" alt="استخدام الدفع الالكتروني عبر الـ PayPal أو البطاقة" border="0" data-original-height="447" data-original-width="943" height="152" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjKUBxftQyvvUlUTw-TelW_uvCPP0-N6jOj3dZ0iX6d-w8qG0-Ztp0IgUeCpEwcTDO-xf33mfWPe-Am8hrM9HuWilDsgX2D1CNrN-rdUiWlqN93uP0QGYs1nmMMWVqGAaXW3dITTMk52k6os7ioWbsyDhDF8wlwMpZHZTo04wwvjr5Wf25m65kLKLGB/w320-h152/IMG_20230412_000608.jpg" title="استخدام الدفع الالكتروني عبر الـ PayPal أو البطاقة" width="320" /></a>
    </br>
   <p>إذا لم ينجح الدخول معك بالأزرار العلوية ، اضغط الزر التالي</p>
   <div style="text-align: center;"><a href="https://script.google.com/macros/s/AKfycbx9WPk-wrWwVjtoF9PBZPu49clWxQVbBm8IYEcohcKbtGuEuOLzr1zVBaoHsbcWxffW/exec" rel="nofollow" relf="noreferrer" style="text-align: center;" target="new_tab"><input aba02="" id="btn" onmouseout="this.style.backgroundColor=" onmouseover="this.style.backgroundColor=" style="background-color: #2aba02; border-bottom-width: 1px; border-color: rgb(213, 213, 213); border-left-width: 1px; border-radius: 46px; border-right-width: 1px; border-top-width: 0px; border-width: 0px 1px 1px; color: black; cursor: pointer; margin-bottom: 5px; margin-left: 5px; margin-right: 5px; margin-top: 5px; margin: 5px; padding-bottom: 8px; padding-left: 8px; padding-right: 8px; padding-top: 8px; padding: 8px;" this.style.bordercolor="#d5d5d5" this.style.color="#000000" type="button" value="صفحة الدفع الالكتروني" /></a></div>
  
    </div>

<hr style="text-align: center; width: 90%;" />
</form>

Tried both things explained above then I've got error.

0

There are 0 best solutions below