テキスト漫画 お気に入り機能の使い方

テキスト漫画アプリにお気に入り機能を追加※しました。

利用手順は以下の通りです。

※月額利用料金(最低限)がかかります。

まず、トップ画面から「そのほか」を選択します。

「App内課金」をタップします。

お気に入り機能を購入します。

購入できたら、画面下の「閉じる」をタップします。

トップ画面に戻ると、メニューに「4.お気に入り」が追加されているので、タップします。

初期状態ではお気に入りに1つも登録されておらず何も表示されません。メニュー1〜3で気に入ったテキスト漫画の「☆」をタップしましょう。

お気に入りに登録したテキスト漫画は「☆」が「★」に変化します。

「ペシ!ペシ!」を登録

メニュー4に戻ると、先ほど登録したテキスト漫画が表示されます。

これで、たくさんのテキスト漫画の中からあなただけのコレクションを作成できます!!

テキスト漫画アプリを気に入っていただけましたら是非ご利用ください。

テキスト漫画アプリ 機種変更時等に利用する移行コードについて

近日、テキスト漫画に「お気に入り」や「広告オフ」の機能追加を予定しています。

アップデート申請時にAppleより、機種変更時等に利用する移行コードについて、1つのコードだけでの認証ではダメで(今までテキスト漫画では「あなたのID」というコードだけで移行可能でした)、2つ以上のコードが必要との指摘を受けました。

よって、次回バージョンからは「あなたのID」に加えて「ニックネーム」も必要になるため予めご承知おきください。

テキスト漫画アプリへのお気に入り機能や広告オフ機能の追加について

現在、テキスト漫画アプリに気に入ったテキスト漫画を登録していつでも呼び出せる「お気に入り機能」や「広告オフ機能」を月額課金(最低限の価格)で利用可能にすべく、アップルにアプリのアップデートを申請しておりますが、

5、6回ほど

リジェクトを喰らっておりアップデートできておりません。

 
    /\ ⌒ヽ ペタン
   / /⌒)ノ ペタン
  ∧∧\/ ((  ∧_∧
 (´ Д ) ^ ) ))(・∀・;)
 / ⌒ノ(⌒ヽ⊂⌒ヽ
(  ノ ) ̄ ̄(0_ )
 ))_)  (   ) (_(
    アップル    開

現在リジェクトされないよう鋭意アプリ改善中ですので、新機能を利用したいユーザ様はしばらくお待ちください・・・

     -ーー ,,_
   r'”      `ヽ,__
   \       ∩/ ̄ ̄ ヽつ
  ノ ̄\ /”ヽ/ ”   ノ   ヽi
 |  \_)\ .\    ・  ・ |\
 \ ~ )     \ .\_  ( _●_)\_つ
    ̄       \_つ

StoreKit2でシンプルな課金処理 第7回

今回は購入情報の復元(リストア)処理を行います。

※裏作業でSwiftUIにより、UI上部に”購入情報の復元(リストア)”のリンクを追加しました。課金処理の範囲外になるので「SwiftUI」の記述は詳しく行いませんが、第4回で紹介したAppleのサンプルコードが参考になると思います。

もちろんエラー処理は必要になりますが、購入情報の復元(リストア)処理を行うコードは、基本的に以下の1行だけです!

let result = try? await AppStore.sync()

課金アイテムの取得、課金処理、に続いて今回も1行だけです!

このコードが実行されると、ログインしているAppleIDに紐づいた課金情報が復元されるはずです。ログインしていない場合、ログインを促されると思います。

復元後、UIが更新されるはずですが、サンプルコードにはUIを更新するコードが一見、見当たりません。

おそらく、以下の

updateListenerTask = listenForTransactions()

このコードにより、トランザクションリスナーが開始されているため、課金関連処理が行われるとこのリスナーに検知されてUIが自動で変わる仕組みだと思います。(もし違ったら、詳しい方、コメント欄で教えてください!)

心配な場合は、リストア後にUIを更新するコードを念のため書いておくと良いかと思います。


以上、第1回から今回までで、課金に必要な処理は一通り説明しました。少し前までは、課金処理はとても複雑・面倒で、手を出しにくかった開発者の方も多かったかと思います。特に個人開発者の場合、できれば余分な実装に手間をかけたく無いですよね。

今回、StoreKit2で手軽に課金処理を実装可能になりましたので、いままで手を出せなかった方もどんどん手を出していただければと思います!

(੭ ˃̣̣̥ ω˂̣̣̥)੭ु⁾⁾

StoreKit2でシンプルな課金処理 第6回

今回は課金アイテムの購入処理を行います。

※実は裏作業で、「SwiftUI」により課金用のUIを作り込みました。課金処理の範囲外になるので「SwiftUI」の記述は詳しく行いませんが、第4回で紹介したAppleのサンプルコードが参考になると思います。

価格が表記されたボタン押下時に課金処理コードを記述します。

もちろんエラー処理は必要になりますが、基本的に課金処理を行うコードは以下の1行だけです。

let result = try await item.purchase()

※”item” は前回取得した課金アイテムです。

このコードが実行されると、

上記の画像のように、課金アイテムの詳細表示と、購入を促すUIが自動で表示されます。

以上です!

(੭ ˃̣̣̥ ω˂̣̣̥)੭ु⁾⁾

あとは、購入済みアイテムの場合、価格ボタンを購入済みと分かる表示に切り替える処理などが必要ですが、この部分も第4回で紹介したAppleのサンプルコード(function isPurchasedの部分)が参考になると思います。

Appleのサンプルコードは一見コード量が多いですが、課金を行うStoreKit2の中核部分は本当にシンプルなコードです。

UIの部分は皆さん好みがあると思いますので、Appleのサンプルコードを参考に独自に実装していただければと思います。

次回は、”リストア”処理を行います!!

(੭ ˃̣̣̥ ω˂̣̣̥)੭ु⁾⁾

Javascript と PHP での iOS(iPad)判定

iOS13以降、HTTP_USER_AGENTだけではiPadとPCの区別がつかなくなりました。

これは、9.7インチ以上のiPadの場合にHTTP_USER_AGENTに”iPad”の文字列が含まれなくなり、PCのブラウザ(MacのSafari)からのアクセスとほぼ同じになるケースが発生したからです。

PHPの場合、以前は以下のようなコードでiOS判定が可能でしたが、現在は無理です。

function is_ios() {
    $ua = $_SERVER['HTTP_USER_AGENT'];
    // iOSと判定する文字リスト
    $ua_list = array('iPhone', 'iPad', 'iPod');
    foreach ($ua_list as $ua_smt) {
        if (strpos($ua, $ua_smt) !== false) {
           return true;
        }
    } return false;
}

Javascript ならば、HTTP_USER_AGENTに加えて ‘ontouchend’ なども利用する事で判別可能です。

const ua = window.navigator.userAgent.toLowerCase();
const isIOS = ua.indexOf("iphone") >= 0 
   || ua.indexOf("ipad") >= 0 
   || (ua.indexOf('macintosh') > -1 
       && 'ontouchend' in document) /* iPad */
   || ua.indexOf("ipod") >= 0;

PHP内で判定するには、JavascriptなどからPHPに判定済みの情報を渡すことが必要です。

2022年2月現在、Mac、Windows、iPadからのHTTP_USER_AGENTは以下となります。

[Mac の Safari] と [iPad(9.7インチ以上)の Safari] の違いがほぼ無いことが確認出来ます。

[Mac の Safari]
Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/15.0 Safari/605.1.15:

[Mac の Chrome]
Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/98.0.4758.80 Safari/537.36

[Windows の Chrome]
Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/98.0.4758.82 Safari/537.36

[11インチiPad Pro(第2世代) の Safari]
Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_6) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/15.1 Safari/605.1.15

[11インチiPad Pro(第2世代) の Chrome]
Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_6) Mozilla/5.0 (iPad; CPU OS 15_1 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) CriOS/97.0.4692.84 Mobile/15E148 Safari/604.1

[iPad mini(第6世代) の Safari]
Mozilla/5.0 (iPad; CPU OS 15_2_1 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/15.2 Mobile/15E148 Safari/604.1

StoreKit2でシンプルな課金処理 第5回

今回は、課金アイテムの取得と表示を行ないます。

課金アイテムは第3回でApp Store Connect上に定義しましたが、これを利用しようとするとSandbox環境でテスト用アカウントを利用する必要があり面倒です。

そこで、第4回のサンプルでも利用されている、ローカルでテストできるようにする仕組み(StoreKit Testing)を用います。

Xcodeのプロジェクトから「New File …」「StoreKit Configuration File」を選択、ファイル名を決めて「Create」で課金アイテム用ファイルを作成します。

作成したファイルを選択後「+」を押して、「Add Auto-Renewable Subscription」 (定期購読型) を追加します。

サブスクリプショングループも、第3回での設定と同じにします。

その他の設定も第3回での指定と同じにします。

課金単位を ¥ にするためには、StoreKit の設定ファイルを選択した状態で、メニュー「Editor」から「Default Storefont」や「Default localization」を選択して「Japan(JPY)」や「Japanese」を選択してください。

あとは「StoreKit Testing」を有効にするために、第4回で行なった手順1〜4の設定を行ってください。

これで準備は完了です。

1行で課金アイテムを取得出来ます。

let items = try await Product.products(for: ["uka.apple.textmanga_favo_120_month", "uka.apple.textmanga_adoff_120_month"])

(広告オフのアイテムも追加したので、2つのアイテムを取得しています)

上の画像は、取得した配列から “displayName” を「SwiftUI※」で表示したものです。

※課金処理の範囲外になるので「SwiftUI」の記述は詳しく行いませんが、以下のようなコードで表示しました。

List(items) { item in
    Text(item.displayName)
}

表示部分は、第4回で紹介したAppleのサンプルコードをどんどんパクりましょう。

次回は課金アイテムの購入処理を行います!!

(੭ ˃̣̣̥ ω˂̣̣̥)੭ु⁾⁾

StoreKit2でシンプルな課金処理 第4回

課金処理の実装は、昨年実施された WWDC21 でStoreKit2紹介時にサンプルとして利用されたプロジェクトを参考に行います。

開発元のAppleが紹介しているサンプルなので、利用するコードとしては最高です。

このページのDownloadボタンからサンプルプロジェクトを取得してください。

ダウンロードして解凍後、SKDemo.xcodeprojを開いてプロジェクトを立ち上げます。

プロジェクト実行前に、このページの手順1〜4の設定を行わないと課金アイテムが表示されないので注意してください。

下記画像の赤部分です。

設定後、実行すれば、サンプルプロジェクトが正常に動作します。

次回からはこのプロジェクトを元に、自分のプロジェクトへ自動更新サブスクリプションの部分だけを移植、調整していくこととします。

(੭ ˃̣̣̥ ω˂̣̣̥)੭ु⁾⁾

第5回へ続きます。

StoreKit2でシンプルな課金処理 第3回

前回に引き続き、事前の設定作業を行なっていきます。


下記6箇所の設定を行います。

1.まずは、一番上に水色の背景色で表示されている「ローカライゼーションを追加」の文字をクリックします。プルダウンが表示されるので “日本語” を選択します。

「サブスクリプショングループ表示名」は、下記画像の赤丸部分の箇所で表示されます。ここでは “テキスト漫画サブスクリプション” としました。

「App名表示オプション」は、上記のサブスクリプショングループ表示名と共に表示される名前で、そのままでもOKです。右上の「保存」ボタン押下後、元の画面に戻ります。

2.次に「サブスクリプション期間」を設定します。1ヶ月ごとに¥120円としたいので、ここでは “1ヶ月” をプルダウンから選択しました。

3.「サブスクリプション価格」の右にある「+」をクリックし、価格を決定します。テキスト漫画は日本向けに売るので、通貨は “JPY – 日本 円”、価格は “¥120” を選択し、「次へ」をクリックします。

他の国の価格は、上記で選択した価格をベースに自動でセットされます。必要に応じて調整後「作成」をクリックします。

4.次は「ローカライゼーション」の右にある「+」をクリックします。プルダウンが表示されるので “日本語” を選択します。

「サブスクリプション表示名」はApp Store に表示される App 内課金の名前です。ここでは “お気に入り(¥120/月)” としました。

後日追記:サブスクリプション表示名に価格情報を含めてはいけません。リジェクト喰らいました・・・

説明欄には、このサブスクリプションで実現可能な機能を記述します。文字数制限があるため簡潔に記述します。

5.次に、これは任意ですが、アプリ内課金用のイメージを指定します。

画像は 1024 x 1024 で指定します。下のチェックボックスをオンにすると、アプリをインストールしていないユーザがアプリストアでこのアプリを見たときに、どんなことが課金で実現できるのか確認できます。

6.最後に、「審査に関する情報」を設定します。

アプリ内課金で実現可能な機能を、スクリーンショットと共に文章での説明を行います。審査で利用されます。

(あまりにしょぼい機能だとリジェクトを喰らうと思います。自動更新サブスクリプションは特にそうだと思います・・・)

上記画像のようにステータスが「送信準備完了」となればOKです!(広告非表示のアプリ内課金も追加しました)

ついでに、上記画像右上の「App 用共用シークレット」をクリックして、あとで利用する「App用共有シークレット」のコードを生成しておきましょう。


以上で、App Store Connectでの設定はほぼ終わりました!

次回は Xcode を利用しての実装作業に入ります!!

(੭ ˃̣̣̥ ω˂̣̣̥)੭ु⁾⁾

第4回へ続きます。

StoreKit2でシンプルな課金処理 第2回

第2回は、事前準備のため、App Store Connectで必要な設定を行なっていきます。誰にでもわかるよう、ログイン画面から操作手順を解説していきます。

※アプリ開発経験者向けの課金処理に関する解説です。


1.App Store Connectにログインします。

2.「契約/税金/口座情報」をクリックします。

3.「有料App」のステータスが「アクティブ」になっていることを確認します。

※上記のようになっていなければ、「有料App」の文字をクリックして、口座情報などを正しく設定します。

4.App Store Connectログイン直後の画面に戻って「マイApp」をクリックします。

5.これから課金処理を実装する、あなたのアプリをクリックします! (※初回バージョンからアプリ内課金を実装する場合は8へ)

6.iOS App の右横の「+」をクリックします。

7.新しいバージョンを入力します。このバージョンからアプリ内課金が有効になります。

8.アプリ画面の左下にあるApp内課金から「管理」をクリックし、App内課金 (0) の右側にある「+」をクリックします。

9.課金タイプを選択します。今回は “自動更新サブスクリプション” を選択します。

10.「参照名」と「製品ID」を入力します。

「参照名」はApp Store Connect上のみで表示されます。自分があとで見て分かりやすい名前をつければ大丈夫です。作成後に変更可能です。

「製品ID」はあとで変更出来ません。他とかぶらない一意のIDを指定します。アプリの識別IDに加えて機能名や金額を指定すると良いと思います。

11.サブスクリプショングループを作成します。

「サブスクリプショングループ参照名」は、サブスクリプションの管理単位で、通常1つのアプリに対して1つあれば良いようです。App Store Connectおよび「売上とトレンド」のレポートでのみ表示されます。App Storeには表示されません。

1〜11の手順が終わると、下記のような画面になります。

(੭ ˃̣̣̥ ω˂̣̣̥)੭ु⁾⁾

長くなってきたので、第3回へ続きます。

大手には作れないアプリを(気持ちだけは(๑•̀ㅂ•́)و✧)