昨天說完「站內付2.0」的串接流程
不知道各位有沒有成功串接呢?

串接過程一定會遇到一些奇奇怪怪的問題
這裡列出一些可能會踩到的雷，分享給大家:

問題一: 「$ is not a function」

前面有提到過
站內付2.0內建需要使用到jquery

<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>

如果沒有引用到綠界指定的外部元件
或是擺放位置出錯，就會出現這個問題

解答:

按照文件方式，將jquery元件放到正確的地方就可以囉

問題二: 「ECPay is not defined」

如果沒有引用到綠界JS元件，就會出現這個問題

<script src="https://ecpg-stage.ecpay.com.tw/Scripts/sdk-1.0.0.js?t=20210121100116"></script>

解答:

一樣，必須按照文件方式
將綠界JS元件放到正確的地方就可以囉

問題一與問題二常常發生在使用「組件」進行的開發環境中
例如，使用React進行開發
React網頁是由各組件組成，又有各種鉤子、畫面渲染等問題
如果你的引用元件沒有和顯示畫面的區塊放在同一個組件中
那高機率會遇到這兩個情況

同款的錯誤訊息還有「i is not a function」

只要遇到類似上述錯誤訊息
就趕緊去檢查有沒有好好的引用到上述元件吧
同時還要注意元件的引用順序哦

問題三: 「找不到對應的Token資料」

明明測試環境沒問題，但是換到正式環境就出錯了
為什麼??

解答:

呼叫站內付2.0的流程中
有「四個地方」必須進行環境設置(正式環境or測試環境)
四個都要改到「同樣的環境」才能正常運作

第一個:取得廠商驗證碼

第二個:WEB JS SDK

第三個:初始化

第四個:建立交易

如果遇到「找不到對應的Token資料」
趕緊確認上述4個有沒有都如實更換成正確的環境吧

小提醒:MerchantID也要一起換成一樣的哦

問題四:

Different from the [MerchantTradeNo] sent in GetTokenbyTrade API.

有成功呼叫站內付2.0畫面，消費者輸入信用卡資訊後卻取得錯誤訊息:
Different from the [MerchantTradeNo] sent in GetTokenbyTrade API.

解答:

GetTokenbyTrade所輸入的「MerchantTradeNo」要和CreatPayment的一致才可以哦

問題五: 直接使用web JS SDK但畫面卻出不來

為什麼使用web JS SDK畫面卻出不來啊??

解答:

沒有串接過站內付2.0的人，可能以為直接使用web JS SDK可以叫畫面出來讓用戶進行付款

但實際執行後發現根本不會有畫面

這時，趕緊來去看昨天的站內付2.0攻略
一步一步照著做吧!

問題六:

The merchant does not have permission to access(Embedded Checkout Page), please contact the customer service to confirm.

解答:

與全方位金流不同，「站內付2.0」必須額外開通才能使用
如果遇到這個錯誤訊息，那就趕緊致電綠界客服協助你開通站內付2.0服務吧

以上是串接站內付2.0的常見問題
如果你遇到的問題不在上述文章內
也歡迎底下留言分享

我們明天見