Logo

dev-resources.site

for different kinds of informations.

Cheat Sheet: Enabling HTTPS on a Fresh Laravel Sail App with MacOS

Published at
10/24/2024
Categories
laravel
docker
oauth2
webdev
Author
substrsensei
Categories
4 categories in total
laravel
open
docker
open
oauth2
open
webdev
open
Author
12 person written this
substrsensei
open
Cheat Sheet: Enabling HTTPS on a Fresh Laravel Sail App with MacOS

When developing Laravel applications locally using Sail and Docker, you might need to enable HTTPS to integrate with third-party services like Google, Dropbox, or other OAuth2 providers. These services often require secure HTTPS callbacks for authentication and API interactions. Enabling HTTPS in your local development environment ensures you can test these integrations effectively and securely.

This guide will show you how to set up HTTPS in your Laravel Sail environment by configuring Nginx as a reverse proxy and forcing HTTPS within your application.

Table of Contents

  1. Create a Fresh Laravel Sail Application
  2. Update the .env File
  3. Add Custom Domain to /etc/hosts
  4. Configure Docker for HTTPS
  5. Create an Nginx Configuration
  6. Modify AppServiceProvider to Force HTTPS
  7. Rebuild and Restart Sail
  8. Clear Laravel Cache
  9. Test HTTPS Setup
  10. Done!

1. Create a Fresh Laravel Sail Application

curl -s "https://laravel.build/my-app" | bash
cd my-app
./vendor/bin/sail up
Enter fullscreen mode Exit fullscreen mode

This creates a fresh Laravel app with Sail and brings up the Docker containers.

2. Update the .env File

Edit your .env file to set the APP_URL to your custom domain with https://:

APP_URL=https://my-app.test
Enter fullscreen mode Exit fullscreen mode

This ensures Laravel generates URLs using HTTPS instead of HTTP.

3. Add Custom Domain to /etc/hosts

Map your custom domain to 127.0.0.1 in /etc/hosts:

sudo nano /etc/hosts
Enter fullscreen mode Exit fullscreen mode

Add the following line:

127.0.0.1 my-app.test
Enter fullscreen mode Exit fullscreen mode

This allows your machine to resolve my-app.test to localhost.

4. Configure Docker for HTTPS

Edit the docker-compose.yml file to expose both 80 (HTTP) and 443 (HTTPS) ports for Nginx:

services:
  laravel.test:
    ports:
      - '80:80'
      - '443:443'  # HTTPS port

  nginx:
    image: nginx:alpine
    ports:
      - '80:80'
      - '443:443'  # Expose HTTPS port for Nginx
    volumes:
      - .:/var/www/html
      - ./docker/nginx/nginx.conf:/etc/nginx/nginx.conf  # Nginx configuration
      - ./docker/nginx/ssl:/etc/nginx/ssl  # SSL certificate
    networks:
      - sail
Enter fullscreen mode Exit fullscreen mode

This config ensures that both the Laravel application and Nginx are set up to handle HTTP and HTTPS traffic. Exposing port 443 allows Nginx to listen for HTTPS requests which it will then proxy to your Laravel application.

5. Create an Nginx Configuration

In this step we'll set up Nginx as a reverse proxy to handle the HTTPS requests and forward them to our Laravel application running in Docker. We'll generate a self-signed SSL certificate for local development purposes.

Create a directory for Nginx configuration:

mkdir -p docker/nginx/ssl
Enter fullscreen mode Exit fullscreen mode

Generate a self-signed SSL certificate:

openssl req -newkey rsa:2048 -nodes -keyout docker/nginx/ssl/my-app.key -x509 -days 365 -out docker/nginx/ssl/my-app.crt
Enter fullscreen mode Exit fullscreen mode

This creates a self-signed SSL certificate for local HTTPS support.

Create a new Nginx config file in docker/nginx/nginx.conf:

user nginx;
worker_processes auto;
pid /run/nginx.pid;
include /etc/nginx/modules-enabled/*.conf;

events {
worker_connections 1024;
}

http {
include /etc/nginx/mime.types;
default_type application/octet-stream;

    server {
        listen 80;
        listen 443 ssl;
        server_name my-app.test;

        ssl_certificate /etc/nginx/ssl/my-app.crt;
        ssl_certificate_key /etc/nginx/ssl/my-app.key;

        root /var/www/html/public;
        index index.php index.html;

        location / {
            proxy_pass http://laravel.test:80;
            proxy_set_header Host $host;
            proxy_set_header X-Real-IP $remote_addr;
            proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
            proxy_set_header X-Forwarded-Proto $scheme;
        }
    }

    sendfile on;
    keepalive_timeout 65;
}
Enter fullscreen mode Exit fullscreen mode

This config sets up Nginx as a reverse proxy, forwarding HTTPS requests to Laravel’s built-in web server that's provided by the laravel.test Docker container.

6. Modify AppServiceProvider to Force HTTPS

Edit app/Providers/AppServiceProvider.php and add URL::forceScheme('https'):

use Illuminate\Support\Facades\URL;
use Illuminate\Support\ServiceProvider;

class AppServiceProvider extends ServiceProvider
{
    public function boot(): void
    {
        URL::forceScheme('https');  // Force HTTPS in development
    }
}
Enter fullscreen mode Exit fullscreen mode

This ensures that Laravel generates all URLs with HTTPS.

7. Rebuild and Restart Sail

Rebuild the Docker containers to apply your changes:

sail down
sail build --no-cache
sail up -d
Enter fullscreen mode Exit fullscreen mode

8. Clear Laravel Cache

After making changes to Laravel, clear the cache:

sail php artisan config:clear
sail php artisan route:clear
sail php artisan cache:clear
Enter fullscreen mode Exit fullscreen mode

9. Test HTTPS Setup

Run the following command to test the HTTPS connection:

curl -v https://my-app.test --insecure
Enter fullscreen mode Exit fullscreen mode

A successful result should show:

  • Connected to port 443:
  * Connected to my-app.test (127.0.0.1) port 443
Enter fullscreen mode Exit fullscreen mode
  • Successful SSL handshake:
  * SSL connection using TLSv1.3 / AEAD-CHACHA20-POLY1305-SHA256
Enter fullscreen mode Exit fullscreen mode
  • HTTP 200 OK or 302 Redirect:
  < HTTP/1.1 200 OK
Enter fullscreen mode Exit fullscreen mode

or

  < HTTP/1.1 302 Found
  < Location: https://my-app.test/login
Enter fullscreen mode Exit fullscreen mode

These indicate that HTTPS is working and Laravel is correctly generating secure URLs.

10. Done!

Congratulations πŸŽ‰ You've successfully configured HTTPS for your Laravel Sail app! You can now visit https://my-app.test in your browser. This setup should enable you to:

  • Test integrations with OAuth2 providers that require secure HTTPS callbacks.
  • Develop and debug third-party APIs that require HTTPS.
  • Ensure your local dev environment closely mirrors production in terms of security.
oauth2 Article's
30 articles in total
Favicon
OAuth2 Scopes and Claims: Fine-Grained Access Control
Favicon
Defending OAuth2: Advanced Tactics to Block Replay Attacks
Favicon
Understanding the Differences Between OAuth2 and OpenID Connect (OIDC)
Favicon
Demystifying Social Logins: How OAuth2 Powers Seamless Authentication
Favicon
JWT vs Opaque Tokens: A Comprehensive Guide to Choosing Wisely
Favicon
OAuth2 and PKCE: Enhancing Security for Public Clients
Favicon
OAuth2 Authorization Code Grant Type: A Deep Dive
Favicon
OAuth2 in Action: Real-World Use Cases and Examples
Favicon
Advanced OAuth2: Refresh Tokens and Token Expiration Strategies
Favicon
OAuth2 Grant Types Explained: Which One Should You Use?
Favicon
Implementing OAuth2 for Microservices Authentication
Favicon
OAuth2 Client Credentials Grant Type: When and How to Use It
Favicon
OAuth2 vs. OpenID Connect: Understanding the Differences
Favicon
OAuth2: An In-Depth Overview and How It Works
Favicon
Common OAuth2 Misconceptions: Debunking Myths for a Secure Implementation
Favicon
Access Token or ID Token? Which to Use and Why?
Favicon
RFC 9068: The JWT Profile for OAuth2 Access Tokens β€” A Standard for Seamless Integration
Favicon
OAuth2 Demystified: An Introduction to Secure Authorization
Favicon
Cheat Sheet: Enabling HTTPS on a Fresh Laravel Sail App with MacOS
Favicon
Open Authorization v2.0 OAuth2 mikro servislar xavfsizligi
Favicon
OAuth 2 Token Exchange with Spring Security and Keycloak
Favicon
How to Secure Apache Superset with OAuth2
Favicon
Open Authorization 2.0 (OAuth2.0) - Authorization Code Grant
Favicon
Build a GPT That Talks to Your Database in One Day
Favicon
OpenID Connect Flows: From Implicit to Authorization Code with PKCE & BFF
Favicon
Client assertion in OAuth 2.0 client authentication
Favicon
Python FastAPI: Integrating OAuth2 Security with the Application's Own Authentication Process
Favicon
Call your Azure AD B2C protected API with authenticated HTTP requests from your JetBrains IDE
Favicon
Implementing SSO in React with GitHub OAuth2
Favicon
Securing Azure Functions with OAuth2 Authentication

Featured ones: