質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
86.12%
docker-compose

docker-composeとは、複数のコンテナで構成されるサービスを提供する手順を自動的し管理を簡単にするツール。composeファイルを使用しコマンド1回で設定した全サービスを作成・起動することが可能です。

AWS(Amazon Web Services)

Amazon Web Services (AWS)は、仮想空間を機軸とした、クラスター状のコンピュータ・ネットワーク・データベース・ストーレッジ・サポートツールをAWSというインフラから提供する商用サービスです。

React.js

Reactは、アプリケーションのインターフェースを構築するためのオープンソースJavaScriptライブラリです。

Ruby on Rails 7

Ruby on Rails 7は、2021年12月に正式リリースされました。Ruby on Railsのバージョン7であり、フロントエンド開発環境を大幅に刷新。Node.jsを用いない構成がデフォルトになっています。

解決済

aws上でrailsコンテナとreactコンテナの間でaxiosを利用して通信することは可能でしょうか

senseIY
senseIY

総合スコア277

docker-compose

docker-composeとは、複数のコンテナで構成されるサービスを提供する手順を自動的し管理を簡単にするツール。composeファイルを使用しコマンド1回で設定した全サービスを作成・起動することが可能です。

AWS(Amazon Web Services)

Amazon Web Services (AWS)は、仮想空間を機軸とした、クラスター状のコンピュータ・ネットワーク・データベース・ストーレッジ・サポートツールをAWSというインフラから提供する商用サービスです。

React.js

Reactは、アプリケーションのインターフェースを構築するためのオープンソースJavaScriptライブラリです。

Ruby on Rails 7

Ruby on Rails 7は、2021年12月に正式リリースされました。Ruby on Railsのバージョン7であり、フロントエンド開発環境を大幅に刷新。Node.jsを用いない構成がデフォルトになっています。

2回答

0リアクション

0クリップ

313閲覧

投稿2022/08/30 09:11

前提

現在AWSを使用してバックエンド側とフロントエンド側に分けて開発したポートフォリオをデプロイしようとしています。デプロイはこちらの記事を参考にしました
。作業自体は終わってフロントエンド側の表示も上手く表示されているのですが、rails側のコンテナとaxiosを利用した通信を行うことができません。
参考にしたサイトの通りに作ったのでこのような構造になっています。EC2(webサーバ)の部分でdocker-compose upをしています。
イメージ説明
(注意事項)*Railsを本番環境で起動すると500エラーが出てしまうため、今回はdevelopment開発でデプロイする方針を取っています。(デバッグの時間がないため)

発生している問題・エラーメッセージ(ドメインは伏せさせていただきます。)

j

xhr.js:220 GET https://(ドメイン):3001/api/v1/auth/sessions net::ERR_CONNECTION_REFUSED

Reactのaxios通信をする部分の一部

tsx

export const FetchUser = (userId: any) => { return axios.get(`https://(ドメイン):3001/api/v1/users/${userId}`) .then(res => { return res.data }) .catch((e) => console.error(e)) }

docker-compose.yml

yml

version: "3" services: # db: # image: mysql:8.0 # environment: # MYSQL_ROOT_PASSWORD: password # command: --default-authentication-plugin=mysql_native_password # volumes: # - mysql-data:/var/lib/mysql # - /tmp/dockerdir:/etc/mysql/conf.d/ # ports: # - "3306:3306" # cap_add: # - SYS_NICE api: build: context: ./backend/ dockerfile: Dockerfile # command: bash -c "rm -f tmp/pids/server.pid && bundle exec rails s -p 3000" command: bash -c "rm -f tmp/pids/server.pid && bundle exec rails s -p 3000 -b '0.0.0.0'" volumes: - ./backend:/myapp - ./backend/vendor/bundle:/myapp/vendor/bundle environment: TZ: Asia/Tokyo RAILS_ENV: development ports: - "3001:3000" # depends_on: # - db stdin_open: true tty: true env_file: - .env front: build: context: ./frontend/ dockerfile: Dockerfile volumes: - ./frontend/app:/usr/src/app command: sh -c "yarn && yarn start" ports: - "80:3000" # - "4000:3000" environment: - WDS_SOCKET_PORT=0 # volumes: # # mysql-data:

試したことや考察など

1 踏み台サーバからアクセスできるか

踏み台サーバから接続確認をしてみました

j

[ec2-user@ip-(伏せさせていただきます。) ~]$ curl (伏せさせていただきます。):3001/api/v1/users []

これは登録しているuserを全て返すというindexアクションです。そのため、[]が返って来るのは正常な動作です。ですが、なぜか実際のURLから試すとエラーが発生してしまいます。

2 セキュリティーグループの設定に3001を設定

設定したものの、エラーは変わらず。

3 同一ec2(webサーバ)に向けてaxiosを設定

もしかすると、そのアプリケーションが動いているec2のIPアドレスでないと反応しないのではないかと考えて、axiosの通信先を以下のように設定してみました

j

baseURL: "https://(伏せさせていただきます。):3001/api/v1

ですが、同じようにエラーになってしまいます。

ロードバランサーのパブリックIPアドレス EC2(踏み台サーバ)のIPアドレスからアクセスできるか

1 EC2のグローバルIP(踏み台サーバのもの):3001
*EC2のwebサーバはプライベートIPアドレスしか持っていないのでチェックしませんでした。
こちらを検索バーに入れて検索してみましたが、

j

このサイトにアクセスできません (一応伏せさせていただきます。)で接続が拒否されました。

となってしまいました。
2 ロードバランサーのグローバルIP:3001

j

このサイトにアクセスできません(同上)で接続が拒否されました。

*一応フロントエンド側にはアクセスできました

このようにどちらもアクセスできませんでした。

考察など

・1のように踏み台サーバにssh接続してアクセスは可能だが、検索バーに「EC2のグローバルIP(踏み台サーバのもの):3001」このような形で入力して検索するとアクセスできないのはなぜか分からない
・もしかすると、何かAWS側での設定ミスがあるかもしれません(しかし、コンテナは両者正常に起動しているし、フロントエンド側にはドメインからアクセス可能)
・まず、そもそもこの構成でaxiosによるコンテナ間の通信は可能なのか
・参考にしたサイトではAPIを叩いていなかったので分かりませんが、APIとReactの通信もルーターに設定しないといけないのでしょうか?

・出せる情報が少なくてすみません。不備があれば追記いたします。なにかしらアドバイスがあればよろしくお願いいたします。

以下のような質問にはリアクションをつけましょう

  • 質問内容が明確
  • 自分も答えを知りたい
  • 質問者以外のユーザにも役立つ

リアクションが多い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。

気になる質問をクリップする

クリップした質問は、後からいつでもマイページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

下記のような質問は推奨されていません。

  • 間違っている
  • 質問になっていない投稿
  • スパムや攻撃的な表現を用いた投稿

適切な質問に修正を依頼しましょう。

まだ回答がついていません

会員登録して回答してみよう

アカウントをお持ちの方は

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
86.12%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問

同じタグがついた質問を見る

docker-compose

docker-composeとは、複数のコンテナで構成されるサービスを提供する手順を自動的し管理を簡単にするツール。composeファイルを使用しコマンド1回で設定した全サービスを作成・起動することが可能です。

AWS(Amazon Web Services)

Amazon Web Services (AWS)は、仮想空間を機軸とした、クラスター状のコンピュータ・ネットワーク・データベース・ストーレッジ・サポートツールをAWSというインフラから提供する商用サービスです。

React.js

Reactは、アプリケーションのインターフェースを構築するためのオープンソースJavaScriptライブラリです。

Ruby on Rails 7

Ruby on Rails 7は、2021年12月に正式リリースされました。Ruby on Railsのバージョン7であり、フロントエンド開発環境を大幅に刷新。Node.jsを用いない構成がデフォルトになっています。