Techiio-author
Started by Bruce MccullamSep 30, 2021

Open
How to Upload and Deploy angular and Laravel to the server

1 VIEWES 0 LIKES 0 DISLIKES SHARE
0 LIKES 0 DISLIKES 1 VIEWES SHARE

I want to build and deploy angular 10 with laravel backend to the server, in which folder I should upload the angular and which folder should I upload the laravel?

1 Replies

Techiio-commentatorShuvhojit Deb replied 5 months ago0 likes0 dislikes

1. You should rewrite the welcome.blade.php view in the resource/view directory to be like your index.html angular file from the dist folder.

2. in the public folder you also need file .htaccess, where you should place this code:

<IfModule mod_rewrite.c>
    <IfModule mod_negotiation.c>
        Options -MultiViews -Indexes
    </IfModule>
    RewriteEngine On
    # Handle Authorization Header
    RewriteCond %{HTTP:Authorization} .
    RewriteRule .* - [E=HTTP_AUTHORIZATION:%{HTTP:Authorization}]
    # Redirect Trailing Slashes If Not A Folder...
    RewriteCond %{REQUEST_FILENAME} !-d
    RewriteCond %{REQUEST_URI} (.+)/$
    RewriteRule ^ %1 [L,R=301]
    # Handle Front Controller...
    RewriteCond %{REQUEST_FILENAME} !-d
    RewriteCond %{REQUEST_FILENAME} !-f
    RewriteRule ^ index.php [L]
</IfModule>

this is required for your API calls from an angular app in order to be processed by laravel routing (without this .htaccess file in response to all my angular API calls I got 404 - Object not found)

3. And finally you need to have one more .htaccess file in your root directory with the content described in the article above.

After these settings, all should work as expected.

And one more thing, maybe not so important as described above. In order to prevent angular and laravel routing conflicts in the angular app, I set the HashLocationStratagy provider in order to get /#/ in angular routes.

You must be Logged in to reply
Trending Technologies
15
Software91
DevOps48
Frontend Development24
Backend Development20
Server Administration17
Linux Administration28
Data Center24
Sentry24
Terraform23
Ansible83
Docker70
Penetration Testing16
Kubernetes21
NGINX20
JenkinsX17
Techiio-logo

Techiio is on the journey to build an ocean of technical knowledge, scouring the emerging stars in process and proffering them to the corporate world.

Follow us on:

Subscribe to get latest updates

You can unsubscribe anytime from getting updates from us
Developed and maintained by Wikiance
Developed and maintained by Wikiance