AngularJS $ http导致两次请求？

这里是我JS

var rentalkika = angular.module('rentalkika', ['ngRoute']); 
rentalkika.config(function ($routeProvider) { 
    $routeProvider 
    .when('/', { 
     templateUrl : 'pages/main.html' 
    }) 
    .when('/sewa_mobil', { 
     templateUrl : 'pages/sewa_mobil.html', 
     controller : 'FilterController' 
    }) 
    .when('/contact', { 
     templateUrl : 'pages/contact.html', 
     controller : 'ContactController' 
    }) 
    .when('/register', { 
     templateUrl : 'pages/register.html' 
    }); 

}); 

rentalkika.controller('ContactController', function ($scope, $http) { 
    var config = { 
     headers: { 'X-Parse-Application-Id' : 'secret' }  
    }; 


    $http.get('http://128.199.249.233:1337/parse/classes/vehicle', config).then(function (response){ 
     console.log(response.data.results); 
    }, function (error) { 
     console.log(response); 
    }); 


});

这里是我的contact.html

<div> 
tes about html 
</div>

当我去localhost:3000/#/contact然后检查网络部分镀铬，这表明两次http://128.199.249.233:1337/parse/classes/vehicle第一回200响应和第二恢复请求304。

这里是我的index.html

<!DOCTYPE HTML> 
 
<html> 
 

 
<head> 
 
    <title>Koupon - Index</title> 
 
    <!-- meta info --> 
 
    <meta content="text/html; charset=utf-8" http-equiv="Content-Type"> 
 
    <meta name="keywords" content="Koupon HTML5 Template" /> 
 
    <meta name="description" content="Koupon - Premiun HTML5 Template for Coupons Website"> 
 
    <meta name="author" content="Dark Cyber" > 
 
    <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
 
    <!-- Google fonts --> 
 
    <!-- <link href='http://fonts.googleapis.com/css?family=Open+Sans:400italic,400,600' rel='stylesheet' type='text/css'> --> 
 
    <!-- <link href='http://fonts.googleapis.com/css?family=Lato:400,700' rel='stylesheet' type='text/css'> --> 
 
    <!-- Bootstrap styles --> 
 
    <link rel="stylesheet" href="css/boostrap.css"> 
 
    <link rel="stylesheet" href="css/boostrap_responsive.css"> 
 
    <!-- Font Awesome styles (icons) --> 
 
    <link rel="stylesheet" href="css/font_awesome.css"> 
 
    <!-- Main Template styles --> 
 
    <link rel="stylesheet" href="css/styles.css"> 
 

 
    <!-- IE 8 Fallback --> 
 
    <!--[if lt IE 9]> 
 
\t <link rel="stylesheet" type="text/css" href="css/ie.css" /> 
 
<![endif]--> 
 

 
    <!-- Your custom styles (blank file) --> 
 
    <link rel="stylesheet" href="css/mystyles.css"> 
 
</head> 
 

 
<body ng-app="rentalkika"> 
 

 

 

 

 

 
    <!-- ////////////////////////////////// 
 
//////////////MAIN HEADER///////////// 
 
////////////////////////////////////--> 
 
    <header class="main"> 
 
     <div class="container"> 
 
      <div class="row"> 
 
       <div class="span2"> 
 
        <a href="index.html"> 
 
         <img src="img/logo-small.png" alt="logo" title="logo" class="logo"> 
 
        </a> 
 
       </div> 
 
       <div class="span8"> 
 
        <!-- MAIN NAVIGATION --> 
 
        <div class="flexnav-menu-button" id="flexnav-menu-button">Menu</div> 
 
        <nav> 
 
         <ul class="nav nav-pills flexnav" id="flexnav" data-breakpoint="800"> 
 
          <li class="active"><a href="index.html">Home</a> 
 
          </li> 
 
          <li><a href="#">Layanan</a> 
 
           <ul> 
 
            <li><a href="#sewa_mobil">Sewa Mobil</a> 
 
            </li> 
 
            <li><a href="#">Shuttle</a> 
 
            </li> 
 
           </ul> 
 
          </li> 
 
          <li><a href="features-typography.html">Paket Wisata</a> 
 
          </li> 
 
          <li><a href="blog-sidebar-right.html">Blog</a> 
 
          </li> 
 
    \t \t \t \t \t \t \t \t <li><a href="#">FAQ</a> 
 
          </li> 
 
          <li><a href="#">Tertarik menjadi mitra kami?</a></li> 
 
          <li><a href="#contact">Contact</a> 
 
          </li> 
 
         </ul> 
 
        </nav> 
 
        <!-- END MAIN NAVIGATION --> 
 
       </div> 
 
       <div class="span2"> 
 
        <!-- LOGIN REGISTER LINKS --> 
 
        <ul class="login-register"> 
 
         <li><a class="popup-text" href="#login-dialog" data-effect="mfp-move-from-top"><i class="icon-signin"></i>Sign in</a> 
 
         </li> 
 
         <li><a href="#register"><i class="icon-edit"></i>Sign up</a> 
 
         </li> 
 
        </ul> 
 
       </div> 
 
      </div> 
 
     </div> 
 
    </header> 
 

 
    <!-- LOGIN REGISTER LINKS CONTENT --> 
 
    <div id="login-dialog" class="mfp-with-anim mfp-hide mfp-dialog clearfix"> 
 
     <i class="icon-signin dialog-icon"></i> 
 
     <h3>Member Login</h3> 
 
     <h5>Welcome back, friend. Login to get started</h5> 
 
     <div class="row-fluid"> 
 
      <form class="dialog-form"> 
 
       <label>E-mail</label> 
 
       <input type="text" placeholder="[email protected]" class="span12"> 
 
       <label>Password</label> 
 
       <input type="password" placeholder="My secret password" class="span12"> 
 
       <label class="checkbox"> 
 
        <input type="checkbox">Remember me 
 
       </label> 
 
       <input type="submit" value="Sign in" class="btn btn-primary"> 
 
      </form> 
 
     </div> 
 
     <ul class="dialog-alt-links"> 
 
      <li><a class="popup-text" href="#register-dialog" data-effect="mfp-zoom-out">Not member yet</a> 
 
      </li> 
 
      <li><a class="popup-text" href="#password-recover-dialog" data-effect="mfp-zoom-out">Forgot password</a> 
 
      </li> 
 
     </ul> 
 
    </div> 
 

 
    <div id="password-recover-dialog" class="mfp-with-anim mfp-hide mfp-dialog clearfix"> 
 
     <i class="icon-retweet dialog-icon"></i> 
 
     <h3>Password Recovery</h3> 
 
     <h5>Fortgot your password? Don't worry we can deal with it</h5> 
 
     <div class="row-fluid"> 
 
      <form class="dialog-form"> 
 
       <label>E-mail</label> 
 
       <input type="text" placeholder="[email protected]" class="span12"> 
 
       <input type="submit" value="Request new password" class="btn btn-primary"> 
 
      </form> 
 
     </div> 
 
    </div> 
 
    <!-- END LOGIN REGISTER LINKS CONTENT --> 
 
    
 
    <!-- ////////////////////////////////// 
 
//////////////END MAIN HEADER////////// 
 
////////////////////////////////////--> 
 

 

 
<!-- //// START PAGE CONTENT --> 
 

 
\t <div ng-view> 
 
    
 
    </div> 
 

 
<!-- END PAGE CONTENT /// --> 
 

 

 

 
    <!-- ////////////////////////////////// 
 
//////////////MAIN FOOTER////////////// 
 
////////////////////////////////////--> 
 

 
    <footer class="main"> 
 
     <div class="footer-top-area"> 
 
      <div class="container"> 
 
       <div class="row row-wrap"> 
 
        <div class="span3"> 
 
         <a href="index.html"> 
 
          <img src="img/logo.png" alt="logo" title="logo" class="logo"> 
 
         </a> 
 
        </div> 
 
        <div class="span3"> 
 
         <h5>Get it Anywhere</h5> 
 
         <p>Ultrices varius semper laoreet molestie purus euismod fames odio volutpat eleifend turpis nec cras quam litora dignissim curae lacus platea sociis mauris hendrerit sed fringilla dignissim cum mi amet orci</p> 
 
         <ul class="list list-app-download"> 
 
          <li> 
 
           <a href="#" class="icon-windows box-icon" title="Get Windows Phone App" data-toggle="tooltip"></a> 
 
          </li> 
 
          <li> 
 
           <a href="#" class="icon-apple box-icon" title="Get iPhone App" data-toggle="tooltip"></a> 
 
          </li> 
 
          <li> 
 
           <a href="#" class="icon-android box-icon" title="Get Android App" data-toggle="tooltip"></a> 
 
          </li> 
 
         </ul> 
 
        </div> 
 
        <div class="span3"> 
 
         <h5>Koupon on Twitter</h5> 
 
         <!-- START TWITTER --> 
 
         <div class="twitter-ticker" id="twitter-ticker"></div> 
 
         <!-- END TWITTER --> 
 
        </div> 
 
        <div class="span3"> 
 
         <h5>Recent News</h5> 
 
         <ul class="list post-list"> 
 
          <li class="post-thumb"> 
 
           <h5 class="title"><a href="#">Gravida porttitor vulputate</a></h5><small>05 August, 2013</small> 
 
           <p class="post-desciption">Dignissim phasellus magnis mus duis nisl ut lacus vehicula velit</p> 
 
          </li> 
 
          <li class="post-thumb"> 
 
           <h5 class="title"><a href="#">A duis</a></h5><small>29 July, 2013</small> 
 
           <p class="post-desciption">Class augue curae accumsan tempor semper id integer adipiscing mattis</p> 
 
          </li> 
 
         </ul> 
 
        </div> 
 
       </div> 
 
      </div> 
 
     </div> 
 
     <div class="container"> 
 
      <div class="row row-wrap"> 
 
       <div class="span3"> 
 
        <h5>About Koupon</h5> 
 
        <p>Tellus auctor sem sociosqu cras cursus vitae erat aliquam adipiscing iaculis suscipit curabitur hac hac congue netus integer ridiculus volutpat varius suspendisse velit venenatis facilisi velit quis volutpat enim ipsum</p> 
 
       </div> 
 
       <div class="span2"> 
 
        <h5>Company</h5> 
 
        <ul class="list"> 
 
         <li><a href="#">Home</a> 
 
         </li> 
 
         <li><a href="#">Blog</a> 
 
         </li> 
 
         <li><a href="#">Press</a> 
 
         </li> 
 
         <li><a href="#">Jobs</a> 
 
         </li> 
 
         <li><a href="#">Investors</a> 
 
         </li> 
 
        </ul> 
 
       </div> 
 
       <div class="span2"> 
 
        <h5>For Business</h5> 
 
        <ul class="list"> 
 
         <li><a href="#">Advertising</a> 
 
         </li> 
 
         <li><a href="#">Runnig a Deal</a> 
 
         </li> 
 
         <li><a href="#">Accept Payments</a> 
 
         </li> 
 
         <li><a href="#">Referral Program</a> 
 
         </li> 
 
         <li><a href="#">Developers/API</a> 
 
         </li> 
 
         <li><a href="#">Merchant Terms</a> 
 
         </li> 
 
        </ul> 
 
       </div> 
 
       <div class="span2"> 
 
        <h5>Get Help</h5> 
 
        <ul class="list"> 
 
         <li><a href="#">FAQ</a> 
 
         </li> 
 
         <li><a href="#">Customer Support</a> 
 
         </li> 
 
         <li><a href="#">Return Policy</a> 
 
         </li> 
 
         <li><a href="#">Terms Of Use</a> 
 
         </li> 
 
         <li><a href="#">Privacy Statement</a> 
 
         </li> 
 
        </ul> 
 
       </div> 
 
       <div class="span3"> 
 
        <h5>Keep in touch</h5> 
 
        <p>Mauris mus tortor leo augue non sociosqu ridiculus sagittis odio</p> 
 
        <ul class="list list-social"> 
 
         <li> 
 
          <a href="#" class="icon-facebook box-icon" data-toggle="tooltip" title="Facebook"></a> 
 
         </li> 
 
         <li> 
 
          <a href="#" class="icon-twitter box-icon" data-toggle="tooltip" title="Twitter"></a> 
 
         </li> 
 
         <li> 
 
          <a href="#" class="icon-flickr box-icon" data-toggle="tooltip" title="Flickr"></a> 
 
         </li> 
 
         <li> 
 
          <a href="#" class="icon-linkedin box-icon" data-toggle="tooltip" title="Linkedin"></a> 
 
         </li> 
 
         <li> 
 
          <a href="#" class="icon-tumblr box-icon" data-toggle="tooltip" title="Tumblr"></a> 
 
         </li> 
 
        </ul> 
 
       </div> 
 
      </div> 
 
     </div> 
 
    </footer> 
 
    <!-- ////////////////////////////////// 
 
//////////////END MAIN FOOTER///////// 
 
////////////////////////////////////--> 
 

 
    <!-- Scripts queries --> 
 
    <script src="js/jquery.js"></script> 
 
    <script src="js/boostrap.min.js"></script> 
 
    <script src="js/nivo_slider.min.js"></script> 
 
    <script src="js/countdown.min.js"></script> 
 
    <script src="js/flexnav.min.js"></script> 
 
    <script src="js/magnific.min.js"></script> 
 
    <script src="js/tweet.min.js"></script> 
 
\t  
 
\t <!-- 
 
    <script src="http://maps.googleapis.com/maps/api/js?sensor=false"></script> 
 
    --> 
 
    
 
    <script src="js/gmap3.min.js"></script> 
 
    <script src="js/wilto_slider.min.js"></script> 
 
    <script src="js/mediaelement.min.js"></script> 
 
    <script src="js/fitvids.min.js"></script> 
 
    <script src="js/mail.min.js"></script> 
 
\t <script src="js/angular.min.js"></script> 
 
\t <script src="js/angular-route.js"></script> 
 
\t <script src="js/app.js"></script> 
 

 
\t 
 
    <!-- Custom scripts --> 
 
    <script src="js/custom.js"></script> 
 

 
</body> 
 

 
</html>

是错，还是我的代码失踪？

来源

2016-11-16 Dark Cyber

也许是第一个请求选项请求？ OPTIONS请求在CORS正在使用时进行。 – RWAM

你是否得到回应？如果api调用是针对不同的服务器的，那么您将看到带有200响应和GET方法的OPTIONS的两个请求（在这种情况下），这是正常的。 –

返回200意味着成功，304意味着该URL正在被重定向。我建议在你的控制器上面加上一个“调试器”，然后用激活的开发工具打开链接，这会告诉你控制器是否被实例化了两次。 –

第一个请求可能是OPTIONS请求，或者是所谓的Preflighted request，这是在CORS正在使用时产生的。预检请求会检查跨站点请求是否安全。

来源

2016-11-16 11:30:12 RWAM

AngularJS $ http导致两次请求？

回答

相关问题