Failed to load resource: the server responded with a status of 404 (Not Found) angular js + ionic
Solution 1
404 literally means that file was not found. It's simple as that. Check if the URL is right, and there are no rediretions being done(use fiddler). Perhaps the protocol should be https:// istead of http://? Perhaps you need "www" in url?
Click the url given in Chrome and see if the file exists.
Solution 2
Change <base href="/">
to <base href="./">
from index.html
Thinkerer
Im not a programmer or engineer by day, just for fun, laughs and cats. SOreadytohelp
Updated on September 14, 2020Comments
-
Thinkerer over 3 years
This is the error im having from Google Devt Tools. Anyone knows the problem? I tried to change in many times including the file structure and the stateProvider (no controllers for that) in app.js file but it does not seem to be the issue. (script is included in app.js with correct file name and directory)
In addition, my logout and submitPost buttons arent working as well.
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 fileapp.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(); }; });
List of items page, 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>
-
Thinkerer almost 10 yearsThanks @Erti-Chris Eelmaa When I click on the error, it says Cannot GET /newpost.html. I kind of spotted an error that $ionicModal.fromTemplateUrl('newpost.html', function(modal) should be $ionicModal.fromTemplateUrl('templates/newpost.html', function(modal) But now when I run grunt serve, its perpetually loading ... and I cant press F12 to troubleshoot..
-
Erti-Chris Eelmaa almost 10 yearsThat's because you are in infinite recursion. Your newpost.html is creating always new NavCtrl, and NavCtrl is creating always newpost.html, it goes on forever.
-
Thinkerer almost 10 years@Erti-Chria Eelmaa any suggestion how to correct the code? I thought putting nav.ctrl in the html just means it uses that controller. How does the recursion occur?
-
Erti-Chris Eelmaa almost 10 yearsGet rid of ng-controller="NavCtrl" and put it to "body" tag or closer where you don't reload the controller every time.