質問編集履歴

2

docker-compose.yml等のファイルを追加

2021/05/01 12:45

投稿

gozikyu
gozikyu

スコア4

test CHANGED
File without changes
test CHANGED
@@ -12,10 +12,176 @@
12
12
 
13
13
 
14
14
 
15
+ EC2にdockerをインストールして、docker-composeでreact、rails、nginxを起動しています。
16
+
17
+
18
+
15
19
  ![イメージ説明](471a45bf974133d240b5c15338d3b567.png)
16
20
 
17
21
 
18
22
 
23
+ docker-compose.yml
24
+
25
+ ```ここに言語を入力
26
+
27
+ version: "3"
28
+
29
+ services:
30
+
31
+ app:
32
+
33
+ build:
34
+
35
+ context: ./api/
36
+
37
+ dockerfile: Dockerfile
38
+
39
+ env_file:
40
+
41
+ - ./api/environments/db.env
42
+
43
+ command: bundle exec puma -C config/puma.rb -e production
44
+
45
+
46
+
47
+ volumes:
48
+
49
+ - ./api:/webapp
50
+
51
+ - public-data:/webapp/public
52
+
53
+ - tmp-data:/webapp/tmp
54
+
55
+ - log-data:/webapp/log
56
+
57
+ depends_on:
58
+
59
+ - db
60
+
61
+ web:
62
+
63
+ build:
64
+
65
+ context: ./api/containers/nginx
66
+
67
+ dockerfile: Dockerfile
68
+
69
+ volumes:
70
+
71
+ - public-data:/webapp/public
72
+
73
+ - tmp-data:/webapp/tmp
74
+
75
+ ports:
76
+
77
+ - 3001:80
78
+
79
+ depends_on:
80
+
81
+ - app
82
+
83
+ front:
84
+
85
+ build:
86
+
87
+ context: ./front/
88
+
89
+ dockerfile: Dockerfile
90
+
91
+ volumes:
92
+
93
+ - ./front:/usr/src/app
94
+
95
+ command: sh -c "cd react_front && npm start "
96
+
97
+ ports:
98
+
99
+ - "80:3000"
100
+
101
+ volumes:
102
+
103
+ public-data:
104
+
105
+ tmp-data:
106
+
107
+ log-data:
108
+
109
+ db-data:
110
+
111
+ ```
112
+
113
+ nginx.conf
114
+
115
+ ```ここに言語を入力
116
+
117
+ # プロキシ先の指定
118
+
119
+ # Nginxが受け取ったリクエストをバックエンドのpumaに送信
120
+
121
+ upstream webapp {
122
+
123
+ # ソケット通信したいのでpuma.sockを指定
124
+
125
+ server unix:///webapp/tmp/sockets/puma.sock;
126
+
127
+ }
128
+
129
+
130
+
131
+ server {
132
+
133
+ listen 80;
134
+
135
+ # ドメインもしくはIPを指定
136
+
137
+ server_name 独自ドメイン;
138
+
139
+
140
+
141
+ access_log /var/log/nginx/access.log;
142
+
143
+ error_log /var/log/nginx/error.log;
144
+
145
+
146
+
147
+ # ドキュメントルートの指定
148
+
149
+ root /webapp/public;
150
+
151
+
152
+
153
+ client_max_body_size 100m;
154
+
155
+ error_page 404 /404.html;
156
+
157
+ error_page 505 502 503 504 /500.html;
158
+
159
+ try_files $uri/index.html $uri @webapp;
160
+
161
+ keepalive_timeout 5;
162
+
163
+
164
+
165
+ # リバースプロキシ関連の設定
166
+
167
+ location @webapp {
168
+
169
+ proxy_set_header X-Real-IP $remote_addr;
170
+
171
+ proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
172
+
173
+ proxy_set_header Host $http_host;
174
+
175
+ proxy_pass http://webapp;
176
+
177
+ }
178
+
179
+ }
180
+
181
+ ```
182
+
183
+
184
+
19
185
  ### 困っていること
20
186
 
21
187
  独自ドメインへのアクセスはALBにSSLの証明書を適用することでSSL化できております。

1

現在の通信状況の簡略図を追加

2021/05/01 12:45

投稿

gozikyu
gozikyu

スコア4

test CHANGED
File without changes
test CHANGED
@@ -32,6 +32,8 @@
32
32
 
33
33
  reactとrails間の通信はAWSの管理下であり盗聴されることはないと考えているため、HTTPで通信を行っています。
34
34
 
35
+ ![イメージ説明](435d908ac04086c7c35208ee9dc1d85d.png)
36
+
35
37
 
36
38
 
37
39
  reactとrails間の通信をHTTPのまま、上記エラーを解消する方法はないでしょうか?