11
7

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

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

Last updated at Posted at 2018-12-11

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

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

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

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

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

まず、手順としては、ターミナルでプロジェクトフォルダまで移動しまして、

```のコマンドを叩くと、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 公式ドキュメント](https://docs.expo.io/versions/latest/workflow/publishing#__next)でも、
「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公式サイトでの記載の挙動との違いについて何かご存知の方がいれば、情報共有していただけると助かります。

11
7
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
11
7

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?