まだどこにもないアプリを作る

アプリ開発でつまづいたところなどを中心に記事にして行きます。

Firebase Cloud Messagingで「キャンペーンで読み込みエラー」が出た場合の対処の一例

私はiOSアプリをリリースしていてPUSH通知を導入しています。

いつものようにPUSH通知しようとしたら

 

 

 

こういうふうに

PUSH通知を送信しても毎回40件しか送信されないという症状になっていたんですよね。

f:id:rils_k:20211019110234p:plain



かなり困っていたのですが結構単純な問題でした。

 

私の場合はAPNs証明書の期限が切れていたことが原因でした。

 

丁寧ではありませんが少し解説します。

 

 

 

Firebaseのプロジェクトの設定→CloudMessagingのタブ

f:id:rils_k:20211019110513p:plain

ここが赤くなってたらダメです。

 

Certificateを更新する必要があります。

 

まずキーチェーンアクセスを起動して

上のバーのキーチェーンアクセス→証明書アシスタント→認証局に証明書を要求

→メールアドレス入力して

→ディスクに保存にチェック

→OK

FCMを実装したことのある方なら知っていると思います。

 

 

Appleデベロッパーページに行って

https://developer.apple.com/account/resources/certificates/list

 

Certificates

にてプラスボタンから新規Certificateを作成します。

 

Apple Push Notification service SSL (Sandbox & Production)

Establish connectivity between your notification server, the Apple Push Notification service sandbox, and production environments to deliver remote notifications to your app. When utilizing HTTP/2, the same certificate can be used to deliver app notifications, update ClockKit complication data, and alert background VoIP apps of incoming activity. A separate certificate is required for each app you distribute.

 

を選択

Choose Fileから先ほど作った

f:id:rils_k:20211019111324p:plain

このファイルを指定します。

それから

Download

 

→ダウンロードしたものをダブルクリックします。

 

するとキーチェーンが立ち上がり、新しく証明書ができていると思うのでそれを右クリック

f:id:rils_k:20211019112247p:plain

 

~を書き出すを選択

 

そうすると.p12ファイルが出来上がります

f:id:rils_k:20211019112625p:plain

これを先ほどの赤くなっていた

Firebaseプロジェクト設定のCloudMessagingの場所に

開発用

本番用

両方に割り当てましょう。

 

両方同じもので大丈夫だと思います。

 

 

 

それから通知をすればちゃんとできるようになっています。

 

 

※アプリのアップデートを提出しなくても本番通知もできました。

 

 

丁寧な説明はできませんでしたが誰かの参考になれば幸いです。

 

 

 

 

 

 

 

 

M1 AppleSilicon Macにてcocoapodsが使えない時に対処した方法

一応書いておきます

 

基本的には以下のGithubのissueやサイトに書いてあることを実行しました。

github.com

armen-mkrtchian.medium.com

 

 

1:Finderからターミナル.appの場所を見つけて右クリックで

f:id:rils_k:20211018092717p:plain

これだけでは終わりません

 

2:一回ターミナルを再起動して、心配な方はMac自体を再起動して

次はターミナルにて

sudo gem install ffi

と打ち込んで実行

 

3:一応cocoapodsをアップデート

ターミナルにて

sudo gem update cocoapods

と打ち込んで実行

 

4:ターミナルにて

sudo arch -x86_64 gem install ffi

と打ち込んで実行

 

 

これで私の場合は使えるようになりました。

 

参考になったら良いです。

MacでSafariのExperimental features(実験的な機能)の設定をオンオフする方法

MacをMacOSBig Sur 11.6

Safariをバージョン15.0 にアップデートしたところ

 

Flutterを使って作られているWebサイトにアクセスすることができなくなってしまいました。

 

こことか

Flutterラボ|動画で学ぶFlutter学習サイト

 

これはiPhone iPadSafariでもiOS15にすると同様にFlutterWebが開かなくなります。

iOSでの解決方法は設定→safari→詳細→Experimental features→Gpu process canvas renderingですね。

 

今回はMacで「Experimental features」の「GPU process canvas rendering」のオフにするまでを解説します。

 

まず、MacSafari

開きます。

 

1.上のバーのSafari→環境設定をクリックします。

f:id:rils_k:20211016093349p:plain

 

2.詳細タブに移動してメニューバーに"開発"メニューを表示をチェック

f:id:rils_k:20211016093514p:plain

 

3.すると開発の項目がバーに追加されているのでそれをクリック

f:id:rils_k:20211016093727p:plain


4.実験的な機能をクリックすると色々出てきます。ここでオンオフを管理することができます。

f:id:rils_k:20211016094115p:plain

 

 

こんな感じでできます。

なかなかわかりにくいですよね

FutureBuilderにてNull check operator used on a null value in Futerbuilderと出るときの対処法。<初心者>

stackoverflow.com

 

こちらの記事を全面的に参考にさせていただきました。

 

Futurebuilderでなにかを表示する際

Null check operator used on a null value in Futerbuilderなどの

このエラーが出ることがあります。

 

私の修正前のコードはこれでした↓

<main.dart>のStatelessWidget


class MyApp extends StatelessWidget {
Future<bool> isAgreeCheck() async {
//利用規約にまだ同意してなかったら画面を表示
final prefs = await SharedPreferences.getInstance();

final bool1 = prefs.getBool('bool1') ?? false;
return bool1;
}

@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primaryColor: Colors.yellow, //メインカラー
),
debugShowCheckedModeBanner: false, //デバッグのバナーなし
home: FutureBuilder<bool>(
future: isAgreeCheck(),
builder: (context, snapshot) {

return snapshot.data! ? Screen() : WalkThrough();
}),
);
}

}


shared_prefを使用しているのでもし再現したい方は↓をpub getしてください。

shared_preferences | Flutter Package

 

以上のコードは

利用規約に同意していたらメイン画面していなかったら、ウォークスルー画面に遷移するような実装を意識しました。

 

shared_prefを使うときも一応async awaitで処理を待つようにしました。

 

async awaitを使うにはおそらくFutureBuilderでWidgetを構築しないといけないので、

FuteureBuilderを使いました。

 

しかしこれで走らせたところ、

The following _CastError was thrown building FutureBuilder<bool>(dirty, state: _FutureBuilderState<bool>#6b231):
Null check operator used on a null value

The relevant error-causing widget was: 
  FutureBuilder<bool> 

 

のようなエラーが出ました。

これを防ぐ方法は、

↓の記事にも載っているように

flutter - Null check operator used on a null value in Futerbuilder - Stack Overflow

FutureBuilderの中に

if (!snapshot.hasData) {
return Container(
child: Center(
child: CircularProgressIndicator(),
),
);
}

というコードを追加するだけです。

 

修正したコード


class MyApp extends StatelessWidget {
Future<bool> isAgreeCheck() async {
//利用規約にまだ同意してなかったら画面を表示
final prefs = await SharedPreferences.getInstance();

final bool1 = prefs.getBool('bool1') ?? false;
return bool1;
}

@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primaryColor: Colors.yellow, //メインカラー
),
debugShowCheckedModeBanner: false, //デバッグのバナーなし
home: FutureBuilder<bool>(
future: isAgreeCheck(),
builder: (context, snapshot) {
if (!snapshot.hasData) {//ここに追加
return Container(
child: Center(
child: CircularProgressIndicator(),
),
);
}
return snapshot.data! ? Screen() : WalkThrough();
}),
);
}

}

 

こうすることで魔法のようにエラーが消えます。

 

もしshared_prefが動かなかったらクルクルのローディングインジケータが回るようになっているようですね。

Flutter Dart 文字列から数値のみを取り出す方法

簡単にできると思いましたが意外と見つけるまで時間かかってしまいました。

 

Dartには文字列から数値のみを抽出するようなメソッドはないようです。

なので.replaceAllを使います。

 

RegExp(r"[^0-9]")は正規表現を使っているようです。

rはスペルミスじゃないですよ。不思議な書き方ですね。

 

//Flutter Dart 数値のみを抽出 数値のみを取り出す 正規表現 
var text = "あ1い2う3";
var extractedText = text.replaceAll(RegExp(r"[^0-9]"), "");
print("数字のみ抽出したテキスト $extractedText");//数字のみ抽出したテキスト 123

 

下記のサイト様を参考にさせていただきました。

PHPで文字列から数値のみを取り出す | ハトらぼ

[Flutter] Dartの文字列操作チートシート

テキストから数字だけを取得したい - #2 by lakshman - フォーラム - UiPath Community Forum

 

 

Flutter Firestoreエラー Bad state: field does not exist within the DocumentSnapshotPlatform

私の場合は存在しないフィールドの名前を指定してしまっていました。

document['content'])

この``で囲まれているところにスペルミスとかないかチェック

 

 

存在するフィールドに直したところ治りました。

 

参考になれば幸いです。