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

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

ただいまの
回答率

91.45%

  • AngularJS

    476questions

    AngularJSはオープンソースのJavaScriptフレームワークです。ブラウザ上で動作するウェブアプリケーションの開発にMVCアーキテクチャを取り入れることを目的としています。

複数の$httpの処理の際、どれかの$http処理が失敗しているときは他の$http処理も全て失敗させたい

解決済

回答 1

投稿 2017/01/12 01:15

  • 評価
  • クリップ 0
  • VIEW 524

xxx_aoi

score 27

$q.allを使用して複数の$httpのpost処理が全て正常に動作すると判断されてから$httpのリクエスト送信(mysqlにフォームに入力した情報を追加する)させ、どちらかの$httpのpost処理が失敗している場合はもう片方の$httpのpost処理が成功していても行われないようにしたいのですが、うまくできません。

index.html

<!DOCTYPE html>
<html ng-app="myApp">
<head>
<meta charset="UTF-8" />
<title>AngularJS</title>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.0/angular.min.js"></script>
<script src="http.js"></script>
</head>
<body ng-controller="MyController">

<form name="myForm" ng-submit="onsubmit()" novalidate>
    <label for="name">name:</label><br />
    <input id="name" name="name" type="text"  ng-model="name" ><br />
    <label for="name">age:</label><br />
    <input id="age" name="age" type="text"  ng-model="age" ><br />
    <label for="name">com:</label><br />
    <input id="acom" name="com" type="text"  ng-model="comment" ><br />
    <input type="submit" value="申込"
      ng-disabled="myForm.$invalid" ng-click="onclick()"/>
</form>
</body>
</html>
http.js

angular.module('myApp', [])
  .controller('MyController', ['$scope','$http', '$q',function($scope, $http, $q) {
    $scope.onclick = function(name,age,comment) {
        var first = $http({
        method: 'POST',
        url: 'post.php',
        data: { name: $scope.name,
                age: $scope.age,
                comment:$scope.comment
              }
      });
        var second = $http({
        method: 'POST',
        url: 'post.php',
        data: { name: $scope.name,
                age: $scope.age,
                comment:$scope.comment
              }
      });
      $q.all([
        first,
        second
      ]);
  };
  }]);
post.php

<?php
$dsn = 'mysql:dbname=*****;host=*****';
$user = '*****';
$pass = '*****';
$pdo = new PDO($dsn, $user, $pass);
switch ($_SERVER['REQUEST_METHOD']) {
case 'POST':
$in = json_decode(file_get_contents('php://input'), true);
$st = $pdo->prepare("INSERT INTO data(name,age,comment) VALUES(:name,:age,:comment)");
$st->execute($in);
break;
}

これだと$q.allの処理を待たずしてリクエスト送信され、データベースに登録されてしまいます(片方にエラーがあった場合でももう片方は登録されている)。

最初に$httpを使わずに変数だけ定義しておいて

$q.all([
        first,
        second
      ])
.then(
 function(){
  return $http(first);
  });


という感じで$q.allメソッド後に$httpを使う方法も試しましたが、こうすると$q.allでエラーの確認ができず、片方にエラーがあってももう一方はリクエスト送信できてしまいます。

どうすれば1つの非同期通信が失敗だった場合もう1つの非同期通信も行われないようにできるのでしょうか?

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

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

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

    クリップを取り消します

  • 良い質問の評価を上げる

    以下のような質問は評価を上げましょう

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

    評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。

    質問の評価を上げたことを取り消します

  • 評価を下げられる数の上限に達しました

    評価を下げることができません

    • 1日5回まで評価を下げられます
    • 1日に1ユーザに対して2回まで評価を下げられます

    質問の評価を下げる

    teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。

    • プログラミングに関係のない質問
    • やってほしいことだけを記載した丸投げの質問
    • 問題・課題が含まれていない質問
    • 意図的に内容が抹消された質問
    • 広告と受け取られるような投稿

    評価が下がると、TOPページの「アクティブ」「注目」タブのフィードに表示されにくくなります。

    質問の評価を下げたことを取り消します

    この機能は開放されていません

    評価を下げる条件を満たしてません

    評価を下げる理由を選択してください

    詳細な説明はこちら

    上記に当てはまらず、質問内容が明確になっていない質問には「情報の追加・修正依頼」機能からコメントをしてください。

    質問の評価を下げる機能の利用条件

    この機能を利用するためには、以下の事項を行う必要があります。

回答 1

checkベストアンサー

0

リクエストを送信せずにステータスを確認るすことはできません。
js側で同期処理を起こしたとしても、1つ目の処理が成功した時点でリクエストはすでに送られるのでキャンセルはできません。

なので、依存関係にある複数のリクエストを一つにまとめて、一回のリクエストで、PHPの中で確認しましょう。

投稿 2017/01/12 09:40

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

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

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

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

  • 2017/01/14 12:45

    回答ありがとうございます。そして返信が遅れて申し訳ございませんでした。

    そういうことなんですね。ためになりました。

    キャンセル

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

ただいまの回答率

91.45%

関連した質問

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

  • AngularJS

    476questions

    AngularJSはオープンソースのJavaScriptフレームワークです。ブラウザ上で動作するウェブアプリケーションの開発にMVCアーキテクチャを取り入れることを目的としています。