Clever Geek Handbook

Why Plunker gives 404 errors with AngularJS?

This code works great when I run it locally, but when I put it in this Plunker ( http://plnkr.co/edit/RCMbxv7Peb83tRKWTMJM ) I get the following 404 error loop:

Failed to load resource: the server responded with a status of 404 (Not Found) http://run.plnkr.co/main.html
GET http://run.plnkr.co/main.html 404 (Not Found) angular.js:8521

What am I missing?

+3


source to share


3 answers


If you disable HTML5 mode it will work fine.

Your app.js file:



// html5Mode is default to false so you could comment out or manually set it
//$locationProvider.html5Mode(true);

html5Mode

server side configuration is required, so I believe this is a conflict.

+1


source


The accepted answer is only partially correct.

In general, URL routing will work on Plunker in exactly the same way as if your code were in a subdirectory (ie: not in the root directory). This is important if you are using $locationProvider.html5Mode(true)

it as it can lead to unexpected behavior if you want to use absolute URLs (ex:) /partials/template.html

.

If you are using one of Angular's built-in templates, you will notice that I added a bit of a hack to get around the fact that previews are not hosted on subdomains:



<script>document.write('<base href="' + document.location + '" />');</script>

This takes advantage of the way Angular.js' $locationProvider

handles tags <base href="">

by inserting a dynamic base tag before Angular.js bootstraps. See section on relative links: https://docs.angularjs.org/guide/ $ location

+4


source


Experienced problem. I changed the version of my added angular script to data-semver = "1.3.0-beta.5" and is sorted.

0


source






More articles:


All Articles