本來套件有內建結帳功能 方便直接用 shopify 結帳
https://github.com/Kyon147/laravel-shopify/wiki/Creating-a-Billable-App
但因為 shopify 審核政策一直在變 我不確定 UI 方面是否還能通過
如果太麻煩 我考慮乖乖去用 official remix 進行開發吧?
驗證起見,我決定先嘗試做出 free vs pro 方案的效果
首先,我將設定檔內的兩個值打開 billing_enabled
billing_freemium_enabled
參考文件,用以下方式準備 pro 方案的資料
INSERT INTO plans (`type`,`name`,`price`,`interval`,`capped_amount`,`terms`,`trial_days`,`test`,`on_install`,`created_at`,`updated_at`) VALUES
('RECURRING','Pro Plan',4.99,'EVERY_30_DAYS',NULL,NULL,NULL,FALSE,0,NOW(),NOW());
為了測試,我建立了兩筆 plan 資料
我在 app 首頁準備兩個連結
<a href="{{ URL::tokenRoute('home', ['plan' => 1, 'shop' => Auth::user()->name]) }}">Move to plan 1</a> -> broken
<a href="{{ route('billing', ['plan' => 2, 'shop' => Auth::user()->name, 'host' => app('request')->input('host')]) }}">Upgrade</a> -> working
結果第一個沒效,但第二個真的會跳轉到 shopify 結帳頁面
這真的非常棒!真的可以升級方案,感覺離進入 shopify apps 生態系又更近一步了
點擊 Approve
之後 會在 charges 資料表看到多一筆資料
另外,在 uninstall app 的時候,那筆資料狀態會變成 CANCELLED
因為我沒有推出三個以上的方案,所以只靠下面這行,已經可以開發各種商業邏輯
Auth::user()->isFreemium()
我最後做了一些跳轉的測試:如果我就是不用 app bridge + spa 架構
我就是要用普通的 routing 會怎樣?
<a href="/hello">Navigation UX Test 1</a>
<a href="/react">Navigation UX Test 2</a>
準備兩個路徑,測試發現頁面是會打開,但網址不會改變
這可以理解,畢竟是在 iframe 裡面換頁
就 UX 來說這非常糟糕,果然預計會改變網址的動作,還是乖乖整合 app bridge 去實作比較好!