FastWeb之簡訊發送

• 適用平臺：WEB(桌面)

1. 說明

  本範例通過對接阿里簡訊平臺，填寫對應的簡訊模板以進行簡訊發送的功能。可用於實現簡訊驗證碼等相關功能。在使用該範例前，需開通阿里云簡訊服務 (opens new window)，獲取AccessKeyId、AccessKeySecret。並根據阿里云簡訊服務文件 (opens new window)進行簡訊模板的建立。

  該程式中的UgRFSmsSender需要配合TARS進行使用。

  通過本範例學習，可以掌握UgRFSMSSender的使用方式。

2. 設計明細

  開啟FastWeb設計器，分別加入下插圖之控制元件。或者點選左上角的[匯入]選擇模板檔案來打開對應模板。

  ①：TUgEdit元件，控制元件名稱為UgEdit01。

  ②：TUgEdit元件，控制元件名稱為UgEdit02。

  ③：TUgEdit元件，控制元件名稱為UgEdit03。

  ④：TUgEdit元件，控制元件名稱為UgEdit04。

  ⑤：TUgEdit元件，控制元件名稱為UgEdit05。

  ⑥：TUgEdit元件，控制元件名稱為UgEdit06。

  ⑦：TUgEdit元件，控制元件名稱為UgImage01。

• UgWebRunFrame屬性設定

  • Height：設定頁面高度=241。
  • Width：設定頁面寬度=643。

• ①UgEdit01屬性設定

  • EmptyText：設定顯示內容為空時顯示的提示字元，設定為請從阿里云簡訊平臺獲取AccessKeyID。
  • FieldLabel：設定編輯框顯示的欄位標籤，設定為AccessKeyID。
  • FieldLabelFont：設定欄位標籤顯示的字型，設定其中的Style.fsBold屬性為True。
  • FieldLabelWidth：設定標籤顯示界面的寬度，設定為110。

• ②UgEdit02屬性設定

  • EmptyText：設定顯示內容為空時顯示的提示字元，設定為請從阿里云簡訊平臺獲取AccessKeySecret。
  • FieldLabel：設定編輯框顯示的欄位標籤，設定為AccessKeySecret。
  • FieldLabelFont：設定欄位標籤顯示的字型，設定其中的Style.fsBold屬性為True。
  • FieldLabelWidth：設定標籤顯示界面的寬度，設定為110。

• ③UgEdit03屬性設定

  • FieldLabel：設定編輯框顯示的欄位標籤，設定為簡訊模板ID。
  • FieldLabelFont：設定欄位標籤顯示的字型，設定其中的Style.fsBold屬性為True。
  • FieldLabelWidth：設定標籤顯示界面的寬度，設定為110。
  • Text：設定編輯框中的內容，此處需設定簡訊模板ID，可從阿里云簡訊控制平臺中建立簡訊模板來進行獲取。

• ④UgEdit04屬性設定

  • FieldLabel：設定編輯框顯示的欄位標籤，設定為簡訊簽名。
  • FieldLabelFont：設定欄位標籤顯示的字型，設定其中的Style.fsBold屬性為True。
  • FieldLabelWidth：設定標籤顯示界面的寬度，設定為110。
  • Text：設定編輯框中的內容，此處需設定簡訊簽名，可從阿里云簡訊控制平臺中建立簡訊簽名來進行獲取。

• ⑤UgEdit05屬性設定

  • FieldLabel：設定編輯框顯示的欄位標籤，設定為簡訊模板參數。
  • FieldLabelFont：設定欄位標籤顯示的字型，設定其中的Style.fsBold屬性為True。
  • FieldLabelWidth：設定標籤顯示界面的寬度，設定為110。
  • Text：設定編輯框中的內容，此處需設定簡訊模板參數。如果使用的是驗證碼型別的簡訊，可設定的簡訊參數為{"code":"123456"}，其中123456為需要發送的驗證碼。

• ⑥UgEdit06屬性設定

  • EmptyText：設定顯示內容為空時顯示的提示字元，設定為如填寫多個號碼請用「;」分隔開。
  • FieldLabel：設定編輯框顯示的欄位標籤，設定為接收手機號碼。
  • FieldLabelFont：設定欄位標籤顯示的字型，設定其中的Style.fsBold屬性為True。
  • FieldLabelWidth：設定標籤顯示界面的寬度，設定為110。

• ⑦UgImage01屬性設定

  • Stretch：設定圖片是否根據控制元件大小進行拉伸，設定為True。
  • Picture：設定顯示的圖片。點選Picture屬性右側的[√]，打開影象編輯器，點選[Load]按鈕打開檔案上傳界面，點選右側的[Browse...]打開影象瀏覽界面，選擇影象后，點選[確定]按鈕返回到檔案上傳界面，點選[Upload]將檔案上傳至編輯器中，待圖片顯示后，點選[Save]按鈕即可。

  

3. 程式設計

  點選程式設計界面右下角的按鈕，切換至單元選擇界面，勾選需要使用的單元。該程式的程式需要引用pub_js_tarslink(JScript)或者pub_pas_tarslink(PasScript)單元。

3.1. 程式初始設定

  程式啟動時為控制元件指定連線設定。

//JScript
{
  UgRFSMSSender01.Connection = GetRFWeb;
}

//PasScript
begin
  UgRFSMSSender01.Connection := GetRFWeb;
end.

// Make sure to add code blocks to your code group

3.2. 事件設定

• ①UgImage01-OnClick事件

  點選圖片以執行發送簡訊申請的操作。

//JScript
function UgImage01OnClick(sender)
//點選執行簡訊發送
{
  if (UgEdit06.Text == "")
  {
    ShowMessage(UGMM.LT("請填寫接收簡訊的手機號碼。"));
    return;
  }
  //如果AccessKeyID 與 AccessKeySecret參數為空，則使用TARS中簡訊平臺的預設值。
  UgRFSMSSender01.AccessKeyId = UgEdit01.Text;
  UgRFSMSSender01.AccessKeySecret = UgEdit02.Text;
  UgRFSMSSender01.TemplateCode = UgEdit03.Text;
  UgRFSMSSender01.SignName = UgEdit04.Text;
  UgRFSMSSender01.TemplateParam = UgEdit05.Text;
  UgRFSMSSender01.PhoneNumbers = UgEdit06.Text;
  if (UgRFSMSSender01.Execute)
    ShowMessage(UGMM.LT("簡訊下發成功！"));
}

//PasScript
procedure UgImage01OnClick(sender: tobject);
//點選執行簡訊發送
begin
  if UgEdit06.Text = '' Then
  Begin
    ShowMessage(UGMM.LT('請填寫接收簡訊的手機號碼。'));
    Exit;
  End;
  //如果AccessKeyID 與 AccessKeySecret參數為空，則使用TARS中簡訊平臺的預設值。
  UgRFSMSSender01.AccessKeyId := UgEdit01.Text;
  UgRFSMSSender01.AccessKeySecret := UgEdit02.Text;
  UgRFSMSSender01.TemplateCode := UgEdit03.Text;
  UgRFSMSSender01.SignName := UgEdit04.Text;
  UgRFSMSSender01.TemplateParam := UgEdit05.Text;
  UgRFSMSSender01.PhoneNumbers := UgEdit06.Text;
  if UgRFSMSSender01.Execute Then
    ShowMessage(UGMM.LT('簡訊下發成功！'));
end;

// Make sure to add code blocks to your code group

4. 運行結果

  使用滑鼠在FastWeb功能表，點選[儲存至資料庫]按鈕，將其儲存至資料庫，點選[除錯運行]確認能夠正常打開。

  在啟動的程式中對應填寫簡訊發送需要的參數，填寫完成後，點選右側的發送簡訊圖示按鈕執行簡訊發送，如接收到發送成功的提示則簡訊發送申請成功，簡訊會發送至指定手機號碼處。