web-dev-qa-db-ja.com

リソースの読み込みに失敗しました：サーバーはステータス404（見つかりません）で応答しましたangular js + ionic

enter image description here

これは、Google DevtToolsから発生したエラーです。誰かが問題を知っていますか？ app.jsファイルのファイル構造とstateProvider（そのためのコントローラーなし）を含めて何度も変更しようとしましたが、問題ではないようです。 （スクリプトは正しいファイル名とディレクトリでapp.jsに含まれています）

さらに、ログアウトボタンとsubmitPostボタンも機能しません。


newpost.html

<div class="modal slide-in-up" ng-controller="NavCtrl">
 <!-- Modal header bar -->
   <header class="bar bar-header bar-secondary">
      <button class="button button-clear button-primary" ng-click="close()">Cancel</button>
      <h1 class="title">New Shout</h1>
      <button class="button button-positive" ng-click="submitPost()">Done</button>
   </header>

<!-- Modal content area --> 
   <ion-content class="padding has-header">
       <form class ng-submit="submitPost()" ng-show="signedIn()"> 
            <div class="form-group">
                <input type="text" class="form-control" placeholder="Title" ng-model="post.title">
            </div>
            <div class="form-group">
                <input type="text" class="form-control" placeholder="Link" ng-model="post.url">
            </div>
            <button type="submit" class="btn btn-default">Submit</button>
        </form>
    </ion-content>
</div>


controller.jsファイル

app.controller('NavCtrl', function ($scope, $firebase, $location, Post, Auth, $ionicModal) {
    $scope.post = {url: 'http://', title: ''};

    // Create and load the Modal
    $ionicModal.fromTemplateUrl('newpost.html', function(modal) {
      $scope.taskModal = modal;
    }, {
      scope: $scope,
      animation: 'slide-in-up'
    });
    // Open our new task modal
    $scope.submitPost = function () {
      Post.create($scope.post).then(function (postId) {   
        $scope.post = {url: 'http://', title: ''};  
        $location.path('/posts/' + postId);              
        $scope.taskModal.show();  
      });
    };
    $scope.close = function() {
      $scope.taskModal.hide();
    };
    $scope.logout = function () {
        Auth.logout();
    };
});


アイテムのリストページ、post.html

<ion-header-bar class="bar-positive" ng-controller="NavCtrl">
   <button class="button button-clear" ng-click="submitPost()">New</button>
   <h1 class="title"><b><a class="navbar-brand" href="#/posts">MyApp</a></b></h1>
   <button class="button button-clear" ng-click="logout()">Logout</button>
</ion-header-bar>
javascripthtmlangularjsangular-ui-routerionic-framework
4
Thinkerer

404文字通り、ファイルが見つからなかったことを意味します。 そのように簡単です。 URLが正しいかどうか、および変更が行われていないかどうかを確認します（フィドラーを使用）。おそらく、プロトコルはhttp：//ではなくhttps：//である必要がありますか？おそらく、URLに "www"が必要ですか？

Chromeで指定されたURLをクリックして、ファイルが存在するかどうかを確認します。

6
Erti-Chris Eelmaa

誰かが興味を持っているかどうかはわかりませんが、ここでFirebaseストレージにアップロードしようとしたときに同様の問題が発生したのは、私がそれを解決した方法です。 アップロードが503で失敗し、75％の進行後に400で失敗するエラースクリーンショット

アップロードに使用するコードセグメントは

 //Event: data.Event,
       // Date: data.Date,
      // Time: data.Time
var data = getData();
data.filename=uploadfile.name;
var metadata = {
    customMetadata: {
       data
    }
}

var storageRef = firebase.storage().ref().child("features");

console.log("Filenames to upload :" + uploadfile.name);

var fileRef = storageRef.child(uploadfile.name);

var uploadTask = fileRef.put(uploadfile,metadata);

問題はカスタムメタデータにありました。これをこのように変更すると、

  var metadata = {
    customMetadata: {
        Event: data.Event,
        Date: data.Date,
        Time: data.Time
    }
}

アップロードが機能し始めました。そのため、カスタムメタデータの設定でエラーが発生した場合、firebaseエラーが発生し、可能性としてはそれが理由として提供されません。

ここでの作業のスクリーンショット カスタムメタデータが修正されたらアップロードに成功

0
Kameswaran Subbaraman

変化する <base href="/">から<base href="./">index.htmlから

0
Vikram Sapate