モバイルブラウザで開くとリクエストが送れない

以下のようなAPIにリクエストを送るサイトを作成して、AWSのS3に置いて公開しました。

しかし、PCからはリクエストを送れるのですが、iPhoneのchromeやsafariからだと、リクエストが送れません。

ツールでiPhoneの通信をキャプチャすると、APIへのリクエストは投げているので、JSの処理は動いているようです。

解決方法をご存知の方がいましたら、ご教示いただけないでしょうか。
よろしくお願いします。


<!DOCTYPE html>
<html lang="ja">
<head>
  <meta http-equiv="content-type" charset="utf-8">
  <title>テスト</title>

  <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script>
  <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js" integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy" crossorigin="anonymous"></script>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
  <script>

  /**
   * id：#～属性をクリックすると、対応する関数を実行する。
   */
  $(function() {
    $('#exePost').click(postFunc);
  });

    /* [POST]ボタン押下時の処理1 */
    function postFunc() {

      let url = 'https://（自作のAPI）/post';

      /* HTTPリクエスト */
      let request = new XMLHttpRequest();

      let body = {
        "val" : "piyopiyo"
      };

      /* リクエスト開始 */
      request.open('POST', url);
      /* HTTPヘッダー */
      request.setRequestHeader( 'Content-Type', "application/json; charset=utf-8" );

      request.onreadystatechange = function () {
        if (request.status != 200) {
            document.getElementById("result1").innerHTML = 'NG'
        } else {
            // 取得成功
            document.getElementById("result1").innerHTML = 'OK';
        }
      };
      request.send(JSON.stringify(body));
    }

  </script>
</head>
<body>
  <div style="margin:20px;">
    <h1>test</h1>
    <div>
      <label style="vertical-align:top;">パラメータ</label>
      <input type="text" id="searchCondition" cols="15" placeholder="（例）ほげほげ"/><br>
    </div>
    <br>
    <input id='exePost' type="button" value="　　リクエスト実行　　">
    <br>
    <div id='result1'>
    </div>
  </div>
</body>

</html>