処理概要

ユーザが、ページ表示した時に、json形式のデータをPost送信します。
送信先はAzureのFunctions(受け取ったデータを処理して別の場所に書き込む、戻り値のない処理、本質問ではあまり関係ないと思います)
データ送信を行っていることは、ユーザにはわからないようにしたいです(画面遷移などはしません)

現状

他のサイトを参考に、ソースを作成しました。
上記処理は満たしています。(Post送信でjson形式のデータをFunctionsに渡せています)

問題

下記ソースでは、一時的に、成功した場合・失敗した場合にalertを表示させています。
処理は想定通りにも関わらず、常に、error側の処理が実行されてしまいます。
alertの内容は下記の通りです。

ajax通信に失敗しました
XMLHttpRequest:0
textStatus:error
errorThrown:undefined

質問内容

下記コードのsuccess/errorは何をもって判別されているのでしょうか？
エラーの出力内容はどういった意味なのでしょうか？

(XMLHttpRequest.statusが0なら通信に失敗という意味らしいですが、失敗しているわけじゃないため謎です。)
3. 何かコードに問題があるのでしょうか？

html
1<body onload="testFunction();">
2<script type="text/JavaScript">
3    function testFunction(){
4    
5        var jsonData = {
6            "name": "テスト！"
7        };
8        var functionsUrl = 'https://hogehoge';
9
10        $.ajax({
11            url: functionsUrl,
12            type: 'post',
13            dataType: 'json',
14            data: JSON.stringify(jsonData),
15            success : function(data) {
16                alert("success");
17                alert(JSON.stringify(data));
18                $("#response").html(JSON.stringify(data));
19            },
20            error : function(XMLHttpRequest, textStatus, errorThrown) {
21                alert("ajax通信に失敗しました");
22                alert("XMLHttpRequest : " + XMLHttpRequest.status);
23                alert("textStatus     : " + textStatus);
24                alert("errorThrown    : " + errorThrown.message);
25            }
26        });
27    }
28</script>

知識不足のため、質問等に不備がございましたら、
追記致しますので、よろしくお願いします。

退会済みユーザー

2018/12/19 11:44

Fiddler を使って要求・応答をキャプチャしてみると何か有用な情報が得られるかもしれません。

行動規範の内容に同意します

回答1件

ベストアンサー

var functionsUrl = 'https://hogehoge';

クロスドメインの処理でしょうか？
開発ツール画面でエラーが確認できると思います

alertはやめてconsole.logを利用して下さい

投稿2018/12/20 07:52

yambejp

総合スコア117734

HelloWorld2

2018/12/21 10:00

クロスドメインの処理だと思います。既存のwebサイトのソース内に、画面表示時にjsで画面の情報(URLなど)をPOSTでhttps://hogehogeに投げるscriptタグを追加しています。投げた後の処理は、投げた先で完結しています。(戻り値などはなし) > 開発ツール画面でエラーが確認できると思います開発ツール画面というのは何を指していますでしょうか・・・？私の開発環境としては、 VSCodeでcakePHPを用いて画面を作成しています。 PHPはXamppのapache上で実行しております。また、Azure上でFunctionsを作成しています。(https//hogehoge) あとalertでなくconsole.logで出力する意図はなんでしょうか・・・？初歩的な内容ですみません。。。

yambejp

2018/12/21 10:09

ajaxでクロスドメインは、受け側の設定が必要ですが大丈夫でしょうか？開発ツールはブラウザのF12を押したときに表示されるアレです alertではない意図は、alertは処理を止めてしまうのでデバッグには向いてないからです

HelloWorld2

2018/12/25 01:51

ご回答ありがとうございます。受け側の設定は何もしていないですが、何が必要なのでしょうか？現状ajaxを用いて、"なぜか"受け側でデータを取得できてはいるという点が謎です。(下記のようなエラーも出ているので。) 開発ツールのコンソールから見てみると、以下のようなエラーが表示されていました。【chrome】 Access to XMLHttpRequest at 'https://hogehoge' from origin 'http://website' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. 【IE】(2つ) SEC7120: 元の http://10.1.54.127 が Access-Control-Allow-Origin ヘッダーに見つかりません。 SCRIPT7002: XMLHttpRequest: ネットワークエラー 0x80070005, アクセスが拒否されました。調べてみたところ、 web側のconfig系の設定変更が必要なようですが、・http://blog.livedoor.jp/tknemuru/archives/36137964.html ・https://blog.mktia.com/how-to-solve-the-problem-that-access-has-been-blocked-by-cors-policy/ webサイト上(html内)で解決することはできないのでしょうか？

yambejp

2018/12/25 02:13

「CORS 」のエラーですからまさにクロスドメイン制約にひっかかってますねデータは送信されるのでエラーでも構わないとするかただしくサーバーの処理をいれるか選択して下さい

HelloWorld2

2018/12/25 03:31

なるほど、サーバ側で設定追加するしか解決方法はないのですね。。。ちなみに、クロスドメイン制約に引っかかっているにも関わらず、データが送信される理由は何でしょうか？データが送信されてしまっているので、クロスドメイン制約って何のためにあるのでしょう・・・？という疑問が生じております。また、今後現在の環境と全く異なるWebサイトで、同様のscriptタグを埋め込む想定なのですが、実行クロスドメイン制約により、データが送信されなくなると困るので、上記疑問を解決したい次第でございます。 (Webサーバの設定ができる環境とも限らないので)

yambejp

2018/12/25 03:46

> クロスドメイン制約に引っかかっているにも関わらず、 > データが送信される理由は何でしょうか？サーバーというものは基本的に常に攻撃をされるものですサーバー側ではアクセスされたデータを検証し、必要に応じてアクセスの可否を判断するので ajaxのデータだけを防いでも意味がないからでしょうね httpヘッダなどどうしても制御出来ない場合はとりあえず jsonpでのアクセスをできるようapiを組んでみて下さい

HelloWorld2

2018/12/25 08:18

ご丁寧にありがとうございました。とりあえずやってみます。

行動規範の内容に同意します