1

I'm having troubles referencing my angularJS files in Laravel's "public" folder. My public folder structure looks like this::

public

   -css

   -js

      -services

      -controllers

      -app.js

I have my "index.php" file inside the "app/views" folder.When i go to the home page of my application http://localhost, the browser brings me to the index.php file as expected.

Inside my "index.php" file, i want to reference my javascript files under the "public/js" and I get "GET http://localhost/js/app.js 404 (Not Found)" - in the browser console meaning that those files can't be found. These are some of the options i have tried to include them in the "index.php" file:

 1.   <script src="js/app.js"></script>

and

EDIT:

 <script src="<?php echo asset('/js/app.js'); ?>">
<script src="<?= url('js/app.js') ?>">

and

  1. I have tried to move the js/app.js to folders resources or resources/views .
  2. I have tried to move just the app.js to resources/views

All these options don't find the files under the "public" folder. I don't use BLADE

My files look like :

index.php

<!DOCTYPE html>
<html lang=eng>
<head>
<meta charset="UTF-8">
  <title>Welcome </title>

  <!-- CSS -->
  <link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.0/css/bootstrap.min.css"> <!-- load bootstrap via cdn -->
  <link rel="stylesheet" href="//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.min.css"> <!-- load fontawesome -->
  <style>
    body    { padding-top:30px; }
/*    form    { padding-bottom:20px; }
*/  </style>

  <!-- JS -->
  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>

    <script src="js/app.js">
    </script> <!-- load our application --><!-- load our application -->
</head>


<body   class="container" ng-app="user1App" ng-controller="mainController">

  <div class="user1"  ng-repeat="user1 in user1s">
    <h3> <small>{{ user1.name }} , {{ user1.email }}</small></h3>
    <p>{{ user1.phone_number }}</p>

  </div>

</body>
</html>

app.js

angular.module('user1App', [
]);

angular.module('user1App').controller('mainController', function($scope, $http, User1, $sce) {

$http.get('api/v1/jokes').success(function(data) { 

$scope.user1s = data; 

});
}

My config/view.php looks like :

'paths' => [
    realpath(base_path('resources/views')),
],

For more information about my code look here AngularJS won't display (parse) data that is delivered with $http.get in Laravel5

ERROR in console :

GET http://localhost/js/app.js 404 (Not Found)

.htaccess

<IfModule mod_rewrite.c>
    <IfModule mod_negotiation.c>
        Options -MultiViews
    </IfModule>

    RewriteEngine On

    # Redirect Trailing Slashes If Not A Folder...
    RewriteCond %{REQUEST_FILENAME} !-d
    RewriteRule ^(.*)/$ /$1 [L,R=301]

    # Handle Front Controller...
    RewriteCond %{REQUEST_FILENAME} !-d
    RewriteCond %{REQUEST_FILENAME} !-f
    RewriteRule ^ index.php [L]

    # Handle Authorization Header
    RewriteCond %{HTTP:Authorization} .
    RewriteRule .* - [E=HTTP_AUTHORIZATION:%{HTTP:Authorization}]
</IfModule>

Please help ,I'm realy not seeing the problem and can't google it anywhere.

Thanks

2 Answers 2

0

Leave your files at public/js and retrieve it like:

<script src="<?= url('js/app.js') ?>">

You mentioned doing <script src="{{ asset('/js/app.js') }}">, but it should contain js/app.js instead of /js/app.js and obviously replace {{ }} with php tags if you are not using blade.

Sign up to request clarification or add additional context in comments.

9 Comments

Yes you are right about {{ }} .. But I have tried you suggestion ,but the same is happening. It onlz works if I put all .js files inside script in index.php.
Every time i'm getiing this GET localhost/js/app.js 404 (Not Found) . Maybe the public dir. is not the one where it is searching for.
Can you load the js if viewing directly in the browser?
Not sure what you mean? The only way I can load .js is to put <script>angularjs code</script> in index.php
Type the js location in the address bar of the browser and see what happens.
|
0

If you don't use blade

  <script src="{{ asset('/js/app.js') }}">

Its will not work, because, '{{' is blade's feature, so what you can do is:

  <script src="<?php echo asset('/js/app.js'); ?>">

1 Comment

Ok I have edited the question. Tried <script src="{{ asset('/js/app.js') }}"> but still getting GET localhost/js/app.js 404 (Not Found) .

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.