kyle'sBlog: 6月 2022

2022年6月19日星期日

[2022.LEARN.014][筆記]Sendgrid發送信件的狀態

參考：

https://docs.sendgrid.com/ui/analytics-and-reporting/email-activity-feed
https://sendgrid.com/blog/the-nine-events-of-email/
https://www.activecampaign.com/blog/email-bounce
https://www.socialmediatoday.com/content/8-reasons-emails-bounce

原文：

Processed：

Requests from your website, application, or mail client via SMTP Relay or the API that SendGrid processed.
當SendGridAPI新增將觸發此事件，(第一個事件)，除非信件被判斷為dropped。

Clicks：

Whenever a recipient clicks one of the Click Tracked links in your email. In the Email History, SendGrid displays the date, time, and the URL for the link that was clicked.
信件連結被點擊了。（理論上應該是收到信才有可能觸發）

Delivered

The accepted response generated by the recipients' mail server.
此事件不保證接收伺服器接收到信件，只是標記已經傳送信件。
後續還有相關狀態回報。
Delivered、Bounced、Blocked、Deffered

Opens

The response generated by a recipient opening an email.
信件被打開了。（理論上應該是收到信才會打開）

Unsubscribes

Whenever a recipient unsubscribes from your emails.

Group Unsubscribes

黑名單:被列入黑名單。

8個原因：

垃圾郵件過濾器
被管理者擋掉(Individual Server Administrators)

主題出現「免費」、「訂閱」、類似詐騙信件、只有主旨沒有內容等。
Subject starts with “Free”
Contains, “If you want to subscribe...”
Offers a full refund
Claims you have provided permission
“See for yourself”
Subject is all capitals
Message is 0% to 10% HTML
HTML title contains no text
“Free Preview”

自然消亡(Natural Database Decay):企業，離職或是網域消失。
臨時無法交付(Temporary Un-deliverables):信箱滿了，夾黨太大，臨時狀況拒絕電子郵件，會發生軟退回(退回重送)。
無效地址(Invalid Addresses):地址無效，發生硬退回(不重送)。

不小心打錯或是故意填錯。

發信人信譽(Sender Reputation)：網域或郵件不被信任。
列入黑名單ip(Blacklisted IP Ranges)
不斷發展業界標準（evolving industry standards)

Blocks

When your IP address has been blocked by an ISP or messaging organization. Blocks are less severe than bounces and do not result in permanent suppressions: subsequent sends to blocked email addresses are not automatically suppressed.
當你的IP位置被ISP或 messaging organization 【block】。
【Block】不像【bounce】那麼嚴重，不會導致永久禁止。
後續發送的已被block的信件也不會自動禁止。

Spam Reports

Whenever a recipient marks your email as spam and their mail server tells us about it.
收件人將您的email標記為垃圾郵件，他們的mail server回傳告知。

筆記：自己依流程定義

processed：已處理
delivered：已送達
open：開啟郵件
click：開啟信件連結
deferred：異常重送
bounce：駁回重送'--rejected by the receiving mail server
blocked：駁回
dropped：被排除
success：發送成功
fail：發送失敗

正常流程：processed-->delivered(-->open開啟信件表示受件人有讀取到信)

2022年6月17日星期五

[2022.LEARN.013][筆記]html5上傳圖片轉base64預覽

範例：

DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>title>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js">script>  

head>

<body>
    <div class="container">
    <label>圖片預覽:label>
    <div id="previewDiv">
      
    div>

    
    <button type="button">
      上傳相片
    button>
    <input type="file" id="upimg" accept=".png, .jpg, .jpeg" onchange='imgUploadCheck(this)' />
    <button type="button" id="btnRemovePic" 
            class="am-btn am-btn-default am-radius am-btn-sm" style="display:none">移除圖片button>        
  
  div>
  <script>
    $(function(){
    
    });
    //圖片上傳檢查
    /* 1.只能是jpg/jpeg  2.檔名只接受小寫英文、數字、底線、連字號  3.不可超過150KB/
    function imgUploadCheck(input){
      //清空網址上傳欄位
      /$('#upimg').val('');
      $('#imgpreviewPic').attr({
        src: ''
      });
      $('#imgErrorTip').html('').hide();/

      var file = $(input)[0].files;
      //為空值>重置
      if(file.length==0){
        $('#btnRemovePic').click();
        $(input).parent().removeClass('am-form-error');
        $('#imgErrorTip').html('').hide();
        return false;
      }
      var fileName = file[0].name;
      var fileType = file[0].type;
      var fileSize = file[0].size;
      console.log(file,fileType,fileSize);
      var typeRule = ["image/jpg", "image/jpeg", "image/png"];
      if ($.inArray(fileType, typeRule) < 0) {
        alert(input,'檔案格式不符，請上傳 jpg/png 檔案');
        return false;
      }
      if((fileSize/1024) > 150){
        //lert('圖片大於150KB');
        $("#previewDiv").empty(); // 清空當下預覽
        previewFiles(file) // this即為元素
        //--------------
      }
      else{
        console.log('圖片OK');
        $("#previewDiv").empty(); // 清空當下預覽
        previewFiles(file); // this即為元素
      }
    }
    // 預覽圖片，將取得的files一個個取出丟到convertFile() ,IE不支援
    function previewFiles(files) {  
      console.log('previewFiles',files);
      if (files && files.length >= 1) {
        $.map(files, file => {
          convertFile(file)
            .then(data => {
              console.log(data) // 把編碼後的字串輸出到console
              showPreviewImage(data, file.name)
            })
            .catch(err => console.log(err))
        })
      } 
      
    }
    // 在頁面上新增
    function showPreviewImage(src, fileName) {
        /let image = new Image(250) // 設定寬250px
        image.name = fileName
        image.src = src // 中src屬性除了接url外也可以直接接Base64字串
        $("#previewDiv").append(image).append(<p>File: ${image.name})*/
        $('#divpreviewPic').show();
        $('#btnRemovePic').show();
        $("#previewDiv").html('');
        $("#previewDiv").html('+src+'" data-fancybox="gallery">\
          +src+'" alt ="'+fileName+'" width="250"/>\
檔案：'+fileName+'
');
    }
    // 使用FileReader讀取檔案，並且回傳Base64編碼後的source ,IE不支援(2022-06-15停用)
    function convertFile(file) {
      return new Promise((resolve,reject)=>{
          // 建立FileReader物件
          let reader = new FileReader()
          // 註冊onload事件，取得result則resolve (會是一個Base64字串)
          reader.onload = () => { resolve(reader.result) }
          // 註冊onerror事件，若發生error則reject
          reader.onerror = () => { reject(reader.error) }
          // 讀取檔案
          reader.readAsDataURL(file)
      }); 
    }
  script>
body>
html>