Help us understand the problem. What is going on with this article?

React native アプリをExpoで公開してスキャンする際に詰まった所

More than 1 year has passed since last update.

自己紹介

react-nativeを触り初めた初心者エンジニアです。約2ヶ月かけて独学でモバイルアプリを開発してきた知見を共有します。開発順序通りではないですが、思い出した項目ごとで共有しようと思います。
ちなみにMacを使用しています。

そもそも、
react-nativeとはの方は、こちらのサイトを参考に。
React Nativeとは何なのか

expoとはとはの方は、こちらのサイトを参考に。
Expo ではじめる ReactNative 開発環境

下記サイトでexpoのアカウントを作れます。
expoサイト

初めてのアプリ公開

いきなりアプリ公開の話で恐縮です。

まず、手順としては、ターミナルでプロジェクトフォルダまで移動しまして、
exp login
のコマンドを叩くと、expoのアカウント作成時の
ユーザー名とパスワードを求められるので、入力します。
これで、expoアカウントに紐づいたアップロード先が決まります。

次に、
exp publish
とコマンドを叩くと本番にアップロードされます。少し時間がかかりますが、エラー無しだと、最後に
https://exp.host/@Acount-name/app-name
のようにexpoのサイトURLが表示されます。
ここにアクセスして表示されたQRコードをモバイルにインストールしているExpo Cliantアプリでスキャンすると、
開発中のアプリの動作が確認できます。

ちなみに、
expo publish --release-channel <your-channel>
例えば、
expo publish --release-channel staging
のようにコマンドを叩くと、本番公開とは分けてテスト環境をアップロードし、共有することができます。

チャンネル名をつけて公開すると
https://exp.host/@Acount-name/app-name?release-channel=staging
のように、アクセスするURLが変わるのに注意してください。

ここでまず、つまずきました。stagingに公開したのに、デフォルトの
https://exp.host/@Acount-name/app-name
のQRコードをスキャンしてて全然読み込めませんでした。。。

ミスに気づいて、再度スキャンしなおすとandroidではうまくアプリ読み込みできました!
が、iosでは、読み込めませんでした。

iOSの挙動についての謎

アクセスしたサイトのQRコード付近に、「With an Android phone, you can scan this QR code with your Expo mobile app to load this project immediately.
(Android携帯電話では、ExpoモバイルアプリでこのQRコードをスキャンして、すぐにこのプロジェクトを読み込むことができます。)」
と記載がありました。
また、Expo 公式ドキュメントでも、
「On iOS, you can't share your published link
When you publish, any Android user can open your app inside Expo Client immediately.
Due to restrictions imposed by Apple, the best way to share your published app is to build a native binary with Expo's build service. You can use Apple TestFlight to share the app with your testers, and you can submit it to the iTunes Store to share more widely.
(iOSでは、公開リンクを共有できません
パブリッシュすると、Androidユーザーはすべて、Expo Client内でアプリをすぐに開くことができます。
Appleによって課せられた制限のため、公開されたアプリケーションを共有する最善の方法は、Expoのビルドサービスでネイティブバイナリを構築することです。Apple TestFlightを使用してテスターとアプリケーションを共有したり、iTunes Storeに提出してより広く共有することができます。)」と記載があったので、

なーんだ、単純にExpoの仕様上iosは対応していないだけかーと思っていましたが、同僚の別iosを借用しScanするとアプリ読み込みできました。。なぜ、、、???

再度、うまくいかないデバイスで読み込みを試みて、エラー内容を注意深く読むと、
「The experience you requested is not viable by you. You will need to log in or ask the owner to grant you access.
(あなたのリクエストした内容は、実行不可能です。あなたは、ログインするかあなたにアクセスの許可を与える方に確認する必要があるでしょう。)」
とあり、あまり意識していなったデバイスのExpo Cliantアプリをを確認すると、別のExpoアカウントでログインされていました。(会社の開発用iosデバイスだったため、別スタッフのアカウントでログイン)
再度、適切なアカウントでログインし直すとうまくアプリ読み込めましたー!

ちなみに、ログアウトした状態でもうまくアプリ読み込めます。これも謎。

結局

iosの挙動は公式ドキュメントの記載とは異なるが、iosでもandoroidでも、うまく動くと思いますー!
これからExpoでアプリ公開する方の参考になれば幸いです。
また、Expo公式サイトでの記載の挙動との違いについて何かご存知の方がいれば、情報共有していただけると助かります。

Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
Comments
No comments
Sign up for free and join this conversation.
If you already have a Qiita account
Why do not you register as a user and use Qiita more conveniently?
You need to log in to use this function. Qiita can be used more conveniently after logging in.
You seem to be reading articles frequently this month. Qiita can be used more conveniently after logging in.
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
ユーザーは見つかりませんでした