サーバーレスでLINEを利用した決済サービスを自作しよう

最近、私はとある事業を始めようと考えています。具体的な内容は話しませんが、長年需要のあるサービスで、元々は対面でのサービスが普通でしたが、近年ではオンライン(主にチャット)完結のサービスも増えてきました。

そこで私はどのようにしてユーザーから支払いを受け取るかを考えました。

オンラインでサービスを販売する以上、決済システムの導入は不可欠です。しかし、できるだけ手数料は抑え、ユーザーにはストレスなく(=購入の障壁なく)決済を完了してもらいたい。

今回は、公式LINE、Stripe、Google Apps Script(GAS)、スプレッドシートという、サーバー契約不要(サーバレス)の構成だけで、ユーザーにとって安心・安全かつシームレスな決済の仕組みを自作する方法を、構成と思想を中心にご紹介します。

目次

既存の決済方法とその課題

一般的にオンラインでモノやサービスを販売する場合、どのような方法があるのでしょうか。

プラットフォームの利用

モノを売るならAmazonやメルカリ、電子サービスを売るならココナラやstoresなどが挙げられます。

これらのプラットフォームを利用する最大のメリットは集客力と手軽さですが、当然ながら手数料を支払う必要があります。

各支払いごとに数%が手数料として引かれる場合や、月額制(サブスクリプション)の場合など、料金形態は様々です。既存のサービスを利用する場合は、この手数料分を販売者か購入者が負担しなければなりません。

サービスを運営する上で、この「手数料」は継続的に発生するコストであり、可能ならば0に近づけたいものです。

決済手段の多様性

また決済手段も考慮が必要です。

PayPayなどのQRコード決済は、個人間の送金は手数料がかからないため、個人事業主で顧客が個人であれば選択肢になるかもしれません。

ですが、実際はネット上での決済方法は依然としてクレジットカードが主流です。

そして、クレジットカード決済を利用するには、プラットフォームを利用しようがしまいが、必ずクレジットカード会社(VISAやMasterなど)が徴収する「決済手数料」が発生します。

課題を解決する「決済代行サービス」

では、プラットフォームの高い手数料を回避しつつ、主流であるクレジットカード決済を導入することはどうすればよいでしょうか。

答えは「一から作る」ですが、クレジットカードの決済処理そのものを自作することは、セキュリティ要件や許認可の面から見てほぼ不可能です。

そこで登場するのが、StripeSquareといった「決済代行サービス」です。

これらのサービスは、Amazonやココナラのような「販売プラットフォーム」ではなく、あくまで「クレジットカード決済を実行する機能だけ」を提供します。

そのため、プラットフォーム利用料は含まれず、非常に格安な決済手数料(クレジットカード会社の手数料+α)のみで利用できます。

  • Stripe:主にネットサービスに組み込む形で利用されます。有名なところでは、ChatGPTを運営するOpenAIをの決済にもStripeが使われています。
  • Square:ネットサービスに加え、実店舗ビジネスにも強いのが特徴です。個人の飲食店などで、スマホと専用リーダーだけで決済しているのをよく見かけます。

ただし、これらのサービスは決済機能「だけ」を提供するため、商品の販売ページや、決済完了後のサンキューページなどは、すべてこちらで作成・用意する必要があります。

なぜプラットフォームに「LINE」を選ぶのか

決済機能はStripeを使うとして…では販売ページや顧客との接点はどこに設けるか。

私は「LINE」が最適だと思います。

圧倒的な利用率と「アカウント登録」の障壁

私の事業において言えば、ターゲット層が比較的低いこともあり、大半の人は日常的にLINEを使用していると考えています。今や日本でLINEを使ったことがない若者を探す方が難しいでしょう。

これが何を意味するか。

自前でwebサイトを作って商品を売る場合、ユーザーは「アカウント登録」という最初の障壁にぶつかります。

「この商品を買いたい…」と少し考えたとき
  1. アカウント登録が必須
  2. メールアドレスや電話番号で認証
  3. 個人情報を入力
  4. クレジットカード番号を入力….

このプロセスが面倒くさくて「買う気が失せる」と感じた経験は、誰しもあるのではないでしょうか。

だからこそ、私はLINEをプラットフォームとして利用することで、実質アカウント登録不要の仕組みを実現できると考えたわけです。

LINEでシームレスな決済体験を実現する「LIFF」

しかし、LINEをプラットフォームにすると言っても、決済のためにLINEアプリから外部のwebブラウザ(SafariやChrome)に遷移すると、ユーザーは「このサイトは本当に安全なのか?」と不安を抱く可能性があります。

この「アプリ切り替え」による体験の分断とユーザーの不安を解消するのが、LINEの「LIFF(LINE Front-end Framework)」という機能です。

LIFFとは、簡単に言えば「LINEアプリ内で起動できるwebページ」のことです。

なおくん

LINEの友だちにトークでwebサイトのURLを送って、そのURLを開くといきなりブラウザアプリが起動するのではなく、LINE上でサイトのページが開くと思います。

引用元:LINE Developers

LIFFを利用するメリットは計り知れません。

  1. シームレスな体験(UX):LINEのトーク画面やリッチメニューから直接LIFF(決済ページ)を開くことができます。見た目はLINEアプリのままwebページが表示されるため、ユーザーは外部サイトに飛ばされた感覚がなく、決済までの一体感を保てます。
  2. LINEアカウントとの連携:LIFFの最大の特徴は、webページ側で「今このページを開いているLINEユーザー」の情報を取得できることです。

これにより「LINEのアカウント情報」と「Stripeの決済情報」を紐づけることが非常に容易になります。

提案する「サーバーレス決済」の全体構成

今回紹介する構成は、前述の通り、スプレッドシート・GAS・公式LINE・Stripeの4つだけで完結します。維持費のかかるレンタルサーバーや、専門的なプログラミング言語(PHP、Ruby、Pythonなど)は一切使用しません。

各技術の役割は以下の通りです。

  • 公式LINE:ユーザーとの窓口(インターフェース)となり、リッチメニューなどを設置し、決済ページ(LIFF)への導線となります。
  • LIFF:LINE内で起動する決済ページ(webページ)であり、フロントエンドの役割を担う。ここでLINEユーザーIDを取得します。
  • Stripe:決済代行サービス。実際のクレジットカード処理を担当します。
  • GAS:すべての処理を裏側でつなぐバックエンドの役割。
  • スプレッドシート:データベースの役割を担い、決済履歴や顧客情報をここに蓄積していきます。

決済の具体的なフロー(仕組み)

では、ユーザーが決済を完了するまで、裏側で何が起こっているのかを説明します。

STEP
LIFF起動

ユーザーが公式LINEのトーク画面やリッチメニューから、決済用のLIFFをタップして起動します。

STEP
ユーザー情報取得

LIFF起動(webページ)は起動と同時にLINEの機能(liff.init)を呼び出し、そのユーザーのLINEユーザーIDをを取得します。

STEP
決済リクエスト(LIFF→GAS)

ユーザーが購入ボタンを押すと、LIFFはバックエンドであるGASに対し「このLINEユーザーIDの人が、この商品を買おうとしています」というリクエストを送信します。

STEP
Stripeセッション作成(インターフェースGAS→Stripe)

リクエストを受け取ったGASは、StripeのAPIを呼び出し「この金額で、決済完了後の戻り先はこのURLで」といった情報(決済セッション)の作成を依頼します。

※Stripeには決済フォーム自体を自作する機能(Elements)もありますが、より安全で実装が簡単な、Stripeがホストする決済ページ(Checkout)を利用する方式が推奨されます。

STEP
決済URLの取得(Stripe→GAS→LIFF)

StripeはGASに対し、その決済専用のURL(https://checkout.stripe.com/~~~)を発行して返します。GASは受け取った決済URLを、フロントエンドのLIFFに返します。

STEP
Stripeページへ遷移

LIFFはGASから受け取ったStripeの決済URLに、ユーザーを遷移させます。この遷移もLIFF(LINEアプリ内ブラウザ)の中で行われるため、シームレスです。

STEP
決済実行

ユーザーはStripeの安全なページでクレジットカード情報を入力し、決済を実行します。

STEP
決済情報の紐づけと保存(GAS&スプレッドシート)

決済が完了すると、Stripeは完了ページにユーザーを戻すか、または裏側でGAS(webhook)に「決済完了」の通知を送ります。GASは、Stripeからの決済情報と、ステップ3でLIFFから受け取っていたLINEユーザーIDを紐づけて、スプレッドシートに「いつ、誰が、いくら決済したか」を記録します。

STEP
完了通知

GASはさらにLINEのMessaging APIを呼び出し、決済が完了したユーザーに対し、LINEのメッセージで「お支払いが完了しました」といった通知を送ることも可能です。

この構成を採用するメリット

なぜ私がこの構成を推すのか、そのメリットをまとめます。

1. 圧倒的な低コスト(サーバーレス)

最大のメリットはサーバー維持費がゼロであることです。GASもスプレッドシートもGoogleアカウントがあれば無料で利用できます。発生するコストは、Stripeの決済手数料(売上の数%)のみです。

2. 管理の容易さ(DB=スプレッドシート)

決済履歴や顧客情報はすべてスプレッドシートに蓄積されます。これは小難しいデータベース(MySQLなど)を操作する必要がなく、普段遣い慣れたExcelやスプレッドシートの感覚でデータを閲覧・管理できることを意味します。絞り込みや集計も非常に楽です。

3. 開発の容易さ(GAS)

バックエンド処理はすべてGASで完結します。GASは中身がJavaScriptのGoogle拡張版であるため、学習コストが比較的低く、私のような(自称)プログラマーでも十分扱うことができます。

4. 優れたユーザー体験(LINE+LIFF)

そして何より、ユーザーにとっては「LINEの中で」「アカウント登録不要で」「シームレスに」決済が完了するという、購買の障壁が極めて低い体験を提供できます。

まとめ

小規模なオンラインサービスや、個人事業主が自身のサービスを販売する際、決済システムの構築は大きなハードルでした。

しかし、Stripeのような決済代行サービスと、LINE、LIFF、そしてGASというサーバーレス技術を組み合わせることで、低コストかつ高機能で、ユーザーにとってもストレスのない決済の仕組みを構築することが可能です。

「プログラミングは少しだけかじったことがある」というレベル(自称プログラマー)でも、アイデアと仕組みの理解次第で、このような協力なツールを自作できる時代です。ぜひ、ご自身のサービスに応用してみてください。

目次