常連

### やりたいこと
以下の構成でブラウザ上のreactからrails-apiにリクエストを送りたい

フロントエンド：react
バックエンド：rails
インフラ：AWS下記図

EC2にdockerをインストールして、docker-composeでreact、rails、nginxを起動しています。
![イメージ説明](3126b55bde0f755b7698eac1324254c0.png)
![イメージ説明](a3b06032effcdb2a961bca7b7730068b.png)


### 困っていること
'Access-Control-Allow-Origin' header がないというCORSのエラーが発生しています。
例えば、reactで以下のコードの4行目でAPIにゲットリクエストをすると、コンソールで写真のようなエラーが発生します。
```ここに言語を入力
  const guestSignIn = () => {
    axios
      .post(
        独自ドメイン + ":3001" + "/login",
        {
          user: {
            email: "guest@gmail.com",
            password: "password",
          },
        },
        { withCredentials: true }
      )
      .then((response) => {
        console.log("registration res", response);
        const createdId = response.data.user_id;
        console.log(createdId);
        props.login();
        history.push({ pathname: "/users/" + createdId });
      })
      .catch((error) => {
        console.log("registration error", error);
        alert(
          "ゲストアカウントでログインできませんでした。通信環境をご確認ください。"
        );
      });
  };

```
![イメージ説明](60b4bb67c95a9ddc6d9957e59eb70b1f.png)

railsではapplication.rbでCROSの設定をしており、Access-Control-Allow-Originについても設定しています。
実際に、localhostや本番環境にIPアドレスにアクセスして、rails-apiにリクエストを送った際は、Access-Control-Allow-Originが正常に機能しています。

しかし、独自ドメインにアクセスしたときにのみ、Access-Control-Allow-Originのheaderがなくなってしまいます。

独自ドメインのときのみ、このような問題が起こるため、AWSのRoute53かALBでCORSの設定が別途必要なのかとも思い現在調べておりますが、該当するようなページを見つけられていません。

なぜ、このような事が起こるのか、知見ございます方がいらっしゃいましたら、アドバイスいただけないでしょうか。

よろしくお願いいたします。0. 番号リスト


application.rb
```ここに言語を入力
require_relative 'boot'

require 'rails'
# Pick the frameworks you want:
require 'active_model/railtie'
require 'active_job/railtie'
require 'active_record/railtie'
require 'active_storage/engine'
require 'action_controller/railtie'
require 'action_mailer/railtie'
require 'action_mailbox/engine'
require 'action_text/engine'
require 'action_view/railtie'
require 'action_cable/engine'
# require "sprockets/railtie"
require 'rails/test_unit/railtie'

# Require the gems listed in Gemfile, including any gems
# you've limited to :test, :development, or :production.
Bundler.require(*Rails.groups)

module Myapp
  class Application < Rails::Application
    # Initialize configuration defaults for originally generated Rails version.
    config.load_defaults 6.1

    # Configuration for the application, engines, and railties goes here.
    #
    # These settings can be overridden in specific environments using the files
    # in config/environments, which are processed later.
    #
    # config.time_zone = "Central Time (US & Canada)"
    # config.eager_load_paths << Rails.root.join("extras")

    # Only loads a smaller set of middleware suitable for API only apps.
    # Middleware like session, flash, cookies can be added back manually.
    # Skip views, helpers and assets when generating a new resource.
    config.api_only = true
    config.middleware.insert_before 0, Rack::Cors do
      allow do
        origins 'http://localhost', 'https://独自ドメイン'
        resource '*',
                 headers: :any,
                 methods: %i[get post patch delete options],
                 credentials: true
      end
    end

    config.hosts << '.example.com'
    config.hosts << '独自ドメイン'
    config.hosts << 'localhost'

    # セッションメソッドを有効にする
    config.middleware.use ActionDispatch::Cookies
    config.middleware.use ActionDispatch::Session::CookieStore
    config.middleware.use ActionDispatch::ContentSecurityPolicy::Middleware

    config.time_zone = 'Tokyo'
    config.active_record.default_timezone = :local

    config.action_dispatch.default_headers = {
      'Access-Control-Allow-Credentials' => 'true',
      'Access-Control-Allow-Origin' =>
      if Rails.env.production?
        'https://独自ドメイン'
      else
        'http://localhost'
      end,
      'Access-Control-Request-Method' => '*'
    }
  end
end

```

### 追加
対症療法的ではありますが、上記問題を解決する事ができました。

変更点
ALBのターゲットを変更
変更前：独自ドメインのポート3001へのアクセスの転送先の設定はインスタンス（ポート3001）
変更後：独自ドメインのポート3001へのアクセスの転送先の設定はVPC内のインスタンスのプライベートIP（ポート3001）

変更前のターゲット
![イメージ説明](aa5013e663def35ac0f4869c8d9d5288.png)
変更後のターゲット
![イメージ説明](d3f5b9e2580189200ae72fcb26712eb9.png)

問題は解決できたのですが、根本的理解はできていません。具体的には以下2点です。
・ターゲットの設定方法の違いでなぜ問題が解決したのか？
・変更後のターゲットのヘルスチェックでstatus403でエラーになっているのになぜ、アプリは正常に動作するのか？
（言い換えると、ブラウザのReactからリクエストを投げたときはなぜ403にならないのか？）

こちら、自分でも調べておりますが、わかる方いらっしゃいましたらご教示いただけると幸いです。

よろしくお願いいたします。

### 追加2
Route53のレコード設定
Aレコードにportfolio-elbというALBを設定しています
![イメージ説明](4b1694812fc03ab244d5277c9c8dd51c.png)
ALBの設定画面
![イメージ説明](e9cc8d59b4d813f9c014b4c31fb3c77f.png)

ALBのヘルスチェックでEC2ポート3001の/gymsにアクセスした際のEC2のdocker上のログ　403になっている
![イメージ説明](4d63d4ac3db1c4043689213ca2286676.png)

ブラウザからEC2ポート3001の/gymsにアクセスした際のEC2のdocker上のログ　304になっている
![![イメージ説明](df79ac1abe85f2ee1ff78a420607f546.png)]
![イメージ説明](353746ce34cdb72fe7f1a4ab9c3efe3a.png)

このことから、ALBのヘルスチェックはEC2に届いているが、ヘルスチェックの場合のみ403で弾かれていると考えております。

### 追加3
nginx.conf
```ここに言語を入力
# プロキシ先の指定
# Nginxが受け取ったリクエストをバックエンドのpumaに送信
upstream webapp {
  # ソケット通信したいのでpuma.sockを指定
  server unix:///webapp/tmp/sockets/puma.sock;
}

server {
  listen 80;
  # ドメインもしくはIPを指定
  server_name 独自ドメイン;

  access_log /var/log/nginx/access.log;
  error_log  /var/log/nginx/error.log;

  # ドキュメントルートの指定
  root /webapp/public;

  client_max_body_size 100m;
  error_page 404             /404.html;
  error_page 505 502 503 504 /500.html;
  try_files  $uri/index.html $uri @webapp;
  keepalive_timeout 5;

  # リバースプロキシ関連の設定
  location @webapp {
    proxy_set_header X-Real-IP $remote_addr;
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    proxy_set_header Host $http_host;
    proxy_pass http://webapp;
  }
}
```

【環境：EC2、ALB、Route53】独自ドメインからAPIにアクセスするときにCORSエラーが発生する

Route53の設定について
！問題！
EC2インスタンスのIPアドレスをドメイン名を登録してDNSを介して接続をしたいのですが、うまくできません。

以前はできていたのですが、いろいろと触っているうちにおかしくなりました。

どのようにデバックをしたらいいかご教授ののほどよろしくお願いします。

！行ったこと！
コマンドプロンプト下記のコマンドを実行
nslookup xxxx.com
結果
DNS request timed out.
    timeout was 2 seconds.
サーバー:  UnKnown
Address:  xxxx::xxx:xxxx:xxxx:xxxx

DNS request timed out.
    timeout was 2 seconds.
DNS request timed out.
    timeout was 2 seconds.
*** UnKnown への要求がタイムアウトしました

ドメイン名はAWSで取得しました。

![イメージ説明](355c1884c292c973ac5a447fe80d0032.png)
![イメージ説明](7a827aee147467ab530ca424b88c4aa9.png)

!追記!
EC2ではWordPressを起動させていて、PublicIPではなく登録したドメイン名でブラウザでアクセスしたいです。
以前ドメインを取得したての時は、EC2のIPやS3やメールサーバを登録して使っていましたが、
不要なものが増えたので、作成したレコードを削除しました。
Check response from Route 53でRecord nameをwwwにしGet responsをするとちゃんと登録しているPublicIPが返ってきます。

HostZoneを一度削除して、再度設定することで解決しますか、

IPv6を無効することで結果が変わりました。
nslookup xxxx.com

nslookup xxxx.com
サーバー:  UnKnown
Address:  xxx.xx.xx.x

DNS request timed out.
    timeout was 2 seconds.
DNS request timed out.
    timeout was 2 seconds.
*** UnKnown への要求がタイムアウトしました

Addressで帰ってくるIPはどこの設定が影響しているのでしょうか

!追記!
nslookup ns-522.awsdns-01.net　←　Registered domains の	Name servers
DNS request timed out.
    timeout was 2 seconds.
サーバー:  UnKnown
Address:  xxx.xx.xx.x　　←　wi-fiのDNSサーバ

権限のない回答:
名前:    ns-522.awsdns-01.net
Addresses:  2600:9000:5302:a00::1
          205.251.194.10

nslookup xxxx.com 205.251.194.10
サーバー:  UnKnown
Address:  205.251.194.10

*** UnKnown が cloudkazan2019.com を見つけられません: Query refused

DNSに取得したドメインが登録されていないような状況なのでしょうか

Route53で名前解決ができない

### 前提

A社からB社へAWSのアカウントの譲渡を考えています。
A社のアカウントにはEC2,RDS,S3,ALB,Route53などのサービスが紐付いている状態です。
B社側はこれから新規でAWSのアカウントを作成します。

### 実現したいこと

現在稼働しているサービスを停止せずにA社からB社にAWSのアカウントを譲渡したいです。
AWSの譲渡をする上で稼働しているサービスが停止してしまうなどは考えられますでしょうか？
ドメインなどは別途移管が必要など...
またアカウントを譲渡する上で他に考えられるリスクはありますでしょうか？

アカウント譲渡の経験がある方や知見のある方がいらっしゃいましたらご教授いただけると助かります。

よろしお願い致します。

AWSのアカウント譲渡におけるリスクについて

### 実現したいこと

Amazon EC2をWebサーバーとして、Webアプリケーションを試作しています。
Elastic IPアドレスだけでなく、ドメイン名からもアクセスできるようにしたいです。

### 前提

・Djangoでプロジェクトを作成し、EC2にデプロイしました。(nginx・gunicorn起動中。)
・IPアドレスからのアクセスは問題ありません。
・お名前.comでドメインを購入、ネームサーバーを設定済です。

以前、別のプロジェクトをデプロイした時に、このドメイン名を取得して設定していました。
その時は、ドメイン名からもアクセスできました。
今回、新規プロジェクトという事で、EC2はじめホストゾーン・各レコードも作り直し、ネームサーバーの設定も変更しました。

### 発生している問題・エラーメッセージ

Elastic IPアドレスからはサイトにアクセスできるのですが、
ドメイン名からはアクセスできず、「Welcome to nginx!」のページが表示されてしまいます。

### 試したこと

仮にドメイン名を[XXX-XXX.net]として、ubuntu上で、`dig XXX-XXX.net NS +short`を実行すると、Route53のNSレコードの4つの値と同じ結果が出ています。
`nslookup XXX-XXX.net`した結果のドメイン名とアドレスも、期待通りの値でした。

nginxの設定は、以下の通りです。
(server_nameにドメイン名とIPを列記しています。)

### /etc/nginx/sites-available/config

```
server{
listen 80;
server_name XXX-XXX.net XX.XX.XX.XX;

location =/fabicon.ico {access_log off; log_not_found off;}
location /static{
alias /usr/share/nginx/html/static;
}

location /media{
alias /usr/share/nginx/html/media;
}

location /{
include proxy_params;
proxy_pass http://unix:/home/ubuntu/project/config.sock;
}
}
```

数日間、いろいろ検索しつつ、頭を悩ませている状態です…。
宜しくお願いいたします。

Route53に設定したドメイン名にアクセスすると、nginxのスタートページが表示されてしまう。

初心者です。
独自ドメインを設定したいと思っていて、Route53でホストゾーンの設定をしているところです。
現在レコードの作成を行っているところで、CloudFrontディストリビューションの選択をしようとしても「リソースが見つかりません」と出ています。画像の赤い部分です。
![イメージ説明](2857ab4c2c0ca47380fbc5d3f57b31b2.png)

AWS Route53 ホストゾーン　レコードの作成でリソースが見つからない

EC2のアプリケーションロードバランサーを使ってAmazon Certificate Managerで発行したサーバ証明書を用いてhttps接続を実現しようとしています．（下記画像の構成を実現したい）
解決方法でなくても，このほかにチェックすべき項目などがありましたらご教示いただけると幸いです．
![![全体構成](1352a0398db946c46e48962ddc3e8d25.png)
[AWSでWebサイトをHTTPS化 その1：ELB(+ACM発行証明書)→EC2編](https://recipe.kc-cloud.jp/archives/11084)より

# 動作状況
- http://{パブリックIPアドレス}, http://{パブリックIPアドレス}/health はアクセス可能
- http://{ドメイン}, https://{ドメイン} にアクセスすると503 Service Temporarily Unavailable
- CloudWatchでロードバランサーを見ると，HTTPCode_ELB_503_Countでカウントされている（EC2側の処理エラーではないとわかる）
- EC2のターゲットグループで対象のターゲットを開いてモニターを見てもHealthy Hostsなどは「データがありません。」と表示されている．

# 行ったこと
### Application Load Balancer
- 「ロードバランサーの作成」から「Application Load Balancer」
- 「ロードバランサーのプロトコル」はHTTPS
- 証明書は「ACM から証明書を選択する」から指定
- 「ターゲットグループのプロトコル」はHTTP
- 「ヘルスチェック」はHTTPで，/healthを指定

### Route53
- ドメインの取得
- レコードを作成し，エイリアスをALBで作ったものを指定

EC2 ALBでのhttps通信で503エラー

### 実現したいこと

・AWSで取得したドメインにアクセスしたらShopifyのページが開くようにしたい。

### 前提

AWSで取得したドメインhoge.comに対して、ホストゾーンを作成し、ShopifyのDNSレコードを追加した。
Shopify上で独自ドメインを追加すると、いつまで経ってもAレコードがAWSのまま、CNAMEは空白となってしまう。
![イメージ説明](https://ddjkaamml8q8x.cloudfront.net/questions/2023-09-07/f48f1fed-3783-4fd9-bab3-b05f692de36f.png)
（CNAMEレコード追加済みのスクリーンショット）

### 発生している問題・エラーメッセージ

Shopify側で
```
AおよびCNAMEが正しく入力されていません
必要な値が入力されていることを確認し、接続を再度確認してください。
```

と出ている状況。
![イメージ説明](https://ddjkaamml8q8x.cloudfront.net/questions/2023-09-07/992b6048-af6e-4a4f-abb0-c2e2b8ed4cc8.png)
（Aレコードが2つになっているが、片方は@、もう片方は空白で両方試したため）

AWS側ではAレコードはShopifyのものに置き換わっている。
（レコードをテストから確認済み）
![画像のIPはShopify指定のもの](https://ddjkaamml8q8x.cloudfront.net/questions/2023-09-07/641fe7d3-9062-4b26-b634-e4a6a40c1b6c.png)

### 補足情報（FW/ツールのバージョンなど）

Shopifyは初期ドメインの状態。
AWSでドメインを取得しており毎月ドメイン料金を支払っている。

ご教示いただけますと幸いです！
よろしくお願いいたします。


AWS Route53で取得したドメインのDNSにShopifyのAレコード、CNAMEを追加したが動作しない

### 事象・問題
Route 53でドメインを取得した後、
Route 53 > ホストゾーン画面のレコードの作成から、Elastic IPと紐づけたタイプAのレコードを作った後、
それまで公開できていたdocker-compose.yml の hostname と external_url をElastic IPからドメインに書き換えてコンテナを起動してみたのですが、
ブラウザ上で**「タイプミスがないか確認してください。」**と表示され、うまく紐づけられていないように見えます。
レコードの作成以外にも他に何かすることがあるのでしょうか？

プログラミングの内容とはちょっと違いますが、
インフラ、ネットワークに詳しい方ご教授のほどお願いいたします。


### 該当のソースコード
docker-compose.yml 
```
version: '3.6'
services:
  web:
    image: 'gitlab/gitlab-ce:latest'
    restart: always
    hostname: 'gitlab-testXXX.com'               #今回このドメインを取得しました。
    environment:
      GITLAB_OMNIBUS_CONFIG: |
        external_url 'http://gitlab-testXXX.com:8082'
        gitlab_rails['gitlab_shell_ssh_port'] = 22
        nginx['listen_port'] = 80
    ports:
      - '8082:80'
      - '22:22'
    volumes:
      - '$GITLAB_HOME/config:/etc/gitlab'
      - '$GITLAB_HOME/logs:/var/log/gitlab'
      - '$GITLAB_HOME/data:/var/opt/gitlab'
    shm_size: '256m'
```

### 試したこと・前提
・ドメインを取得した後、Route 53 > ホストゾーン画面で、Elastic IPを紐づけたタイプAのレコードを作りました。
・ドメインを取得する前 (hostname、external_url が Elastic IPの値の時) は正常にコンテナが公開されていました。



Amazon Route 53