Preface!
Recently, my project needs to deploy to heroku to test as well as make use of many of heroku’s benefits. Actually, this is a quite big challenge for me because before I only used heroku for small and simple projects, now deploying a project running with many typical laravel services such as Queue, Laravel Echo , Schedule …. v … v …. And today I would like to talk about my own experience.
Content
Ok, before starting the content of this article if you have not read my previous article, please come here to read offline. And if you’ve read it, let’s continue to solve the problem.
Problem :
The problems solved in the previous article:
1. Set up a normal web server to run the web (Use nginx)
2. Setup to run the queue (Send mail, run notification)
3. Setup schedule to run daily jobs
The problems solved in this article:
4. Setup server laravel echo to run socket (For realtime notification … v … v … v ….)
5. Setup custom domain for the site
6. Setup https for the site
7. Extend limit upload file
Ok, let us continue with each part of the problem!
To handle :
4. Setup server laravel echo to run socket (For realtime notification … v … v … v ….)
Like other environments, users need to connect to the socket via a link. And our job is to use that link to connect to the laravel-echo server. Here we will use nginx to proxy from url to laravel-echo We need to go to the file nginx_app.conf and fix that file as follows:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 | location / { # try to serve file directly, fallback to rewrite try_files $uri @rewriteapp; } location /socket.io/ { proxy_pass http://127.0.0.1:3000; proxy_http_version 1.1; proxy_set_header Upgrade $http_upgrade; proxy_set_header Connection "upgrade"; proxy_redirect off; proxy_buffers 8 32k; proxy_buffer_size 64k; proxy_set_header X-Real-IP $remote_addr; proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; proxy_set_header Host $http_host; proxy_set_header X-NginX-Proxy true; } location @rewriteapp { # rewrite all to index.php rewrite ^(.*)$ /index.php/$1 last; } location ~ ^/(app|app_dev|config).php(/|$) { try_files @heroku-fcgi @heroku-fcgi; internal; } |
With the above setup, the url domain.com/socket.io/ will be proxyed into the server’s 3000 port. The next is to run the server echo through port 3000. The start server is also simple, surely you are no stranger to running server echo by creating a file laravel-echo-server.json and then running it with the command :
1 2 | laravel-echo start |
Note: Remember to set up port 3000 to run. because above I have configured nginx as port 3000 already
Using the laravel-echo-server.json file is ok, but for servers like heroku it’s quite inconvenient. Why, because every time a server is deployed, heroku will deploy to a completely new node and has nothing to do with the old code and if so, you need to fix the file laravel-echo-server.json or push the code into the file. then deploy and just deploy. With method 1, you will be extremely tired every time deploy and method 2 will lead to laravel-echo server security issues that need sensitive information like redis .
For me, I suggest you do the following. Create an echo-server.js file. With the following content :
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 | require("dotenv").config(); var Echo = require("laravel-echo-server"); /** * The Laravel Echo Server options. */ var options = { "appKey": process.env.ECHO_KEY, "authHost": process.env.ECHO_AUTH_HOST, "authEndpoint": process.env.ECHO_AUTH_ENDPOINT, "database": process.env.ECHO_DATABASE, "databaseConfig": { "redis": process.env.REDIS_URL, }, "devMode": process.env.ECHO_DEV_MODE, "host": process.env.ECHO_HOST, "protocol": process.env.ECHO_PROTOCOL, "port": process.env.ECHO_PORT, "referrers": [], "socketio": {}, "sslCertPath": process.env.ECHO_SSL_CERT_PATH, "sslKeyPath": process.env.ECHO_SSL_KEY_PATH, "verifyAuthPath": true, "verifyAuthServer": true }; /** * Run the Laravel Echo Server. */ Echo.run(options); |
With the above method, all your information will be read by the above file in the .env file. You only need to have it setup on the env and every time the deploy runs
1 2 | node echo-server.js |
The server is ready to work. Deploying work also becomes much easier. 
The following is the one that has made me extremely time-consuming to think. That I can not do how to laravel and laravel -echo connect to each other. From the beginning, running the socket ( laravel-echo ) the server can use the supervisor to run the server, but the supervisor and nginx are on 2 different dynos. And I almost found all ways to solve this connection and as a result, I did not find but found another way.
I chose to run laravel-echo and nginx on the same dynos. Nginx will run in public and laravel-echo will run in the laravel-echo . To do this, we need to go to Procfile and edit the following:
1 2 3 | web: vendor/bin/heroku-php-nginx -C nginx_app.conf public/ & (cd /app/ && node echo-server.js) & wait -n worker: supervisord -c /app/supervisor.conf -n |
Ok, done Mission complete.
5. Setup custom domain for the site
Actually with the setup of this custom domain, I probably do not need to say anything lengthy. You can follow these steps:
- You can buy and manage domains via heroku’s add-on
point-DNS - Use that add-on to create subdomains appropriate for your site
- You need to go to your app settings.
- Fill out the subdomain information in the
Domainssection - Also, don’t forget to remember to set up the route for your subdomain.
A point of interest in using subdomains from one page is that you call the api of another page. This will result in cors error. This is a mechanism that webrowsers need to follow to avoid leaking information. You need to fix it = nginx or your own project.
For me, I chose to use lirary barryvdh/laravel-cors via composer. To config or understand more about the library. You can come here to watch it.
Good luck !
6. Setup https for the site
HTTPS of course. Basically, heroku has support for providing SSL certificates for your custom domain (Support with paid apps.) Or manually add your SSL certificates when you don’t want to use heroku’s SSL certificates.
In this article, I will show you how to use SSL certificates by heroku. You need to follow these steps:
- Go to settings app and scroll to
SSL certificates - Click the
Configure SSLbutton - Then a dialog box opens and you select
Automatically ....and pressContinue - Now
herokuauto generate SSL certificates for each domain you use. It may take a few minutes to update. Please wait a bit - After a few minutes or less, go back to the settings app and scroll down to the
Domainstab. Now, the DNS generated for each custom domain corresponding. - You go to the add-on
point-DNSinto each of your custom domails and fill theDNSthe app settings field into theHostnamefield. - By this time, you can use
httpsfor your server (remember to setup https in laravel) - However, there is still a problem that you can still access the page via
http. To fix this I went back to using nginx automatically switches over to https when the request ishttp. You just need to add this code to the beginning ofnginx_app.conffile is ok.
1 2 3 4 5 | if ($http_x_forwarded_proto != "https") { return 301 https://$host$request_uri; } |
7. Extend limit upload file
This is a fairly common request of customers. (By default, php and nginx only allow max upload of 5MB to the server, I will fix it to upload the 25MB file). To fix this problem. You need to do the following:
- Increasing the limit of nginx you need to add this code to the beginning of the file
nginx_app.confis ok.
1 2 | client_max_body_size 30M; |
- Increasing the file handling limit for php, you need to create the file
.user.iniin.user.inipublicdirectory. The specific file contents are:
1 2 3 4 | post_max_size = 30M upload_max_filesize = 25M memory_limit = 100M |
Ok, I will end the post today! This will be my last post about heroku ! Thank you for reading!
References
https://devcenter.heroku.com/articles/custom-php-settings#default-behavior
https://devcenter.heroku.com/articles/custom-php-settings
https://dannyism.com/running-supervisor-with-laravel-workers-on-heroku/
https://devcenter.heroku.com/articles/custom-domains
https://elements.heroku.com/buttons/gregburek/heroku-tls-auth-nginx-sample