How to fix http assets call?

[TheZoker]

Hi there,

I'm trying out the new docker image and use a reverse proxy to access my helper instance. The issue now is, that the assets do not seem to be loaded via https but via http, which causes issues:

I already set the APP_URL to match my https url, but that did not change anything.

Would really appriciate some hints :)

Thanks!

[heloufir]

Hello @TheZoker

You are working with the docker image locally or using the Hub image?

If it's the local docker image, did you try to force using https instead of http in your AppServiceProvider?

You can add this to your AppServiceProvider:

// ...
public function boot()
{
        if ($this->app->environment('production')) { // Force using https if the APP_ENV equals to "production"
            \Illuminate\Support\Facades\URL::forceScheme('https');
        }
        // ...
}
// ...

You can change the condition as you need.

[TheZoker]

Hi @heloufir,

I'm using the hub image. I added the \Illuminate\Support\Facades\URL::forceScheme('https'); directly into the AppServiceProvider file (without any conditional wrapper), but it does not seem to change anything.

[heloufir]

@TheZoker I think you can use the ASSET_URL environment variable ('coz all the assets are called by asset() helper, so it will depend on this environment variable) in your docker-compose.yml file, like below:

...
  helper:
    image: eloufirhatim/helper:latest
    container_name: ...
    environment:
      - ...
      - ASSET_URL=https://your_domain.com
...

I just made the same test in my local and here is the results:

[TheZoker]

That seems to help a little. When I access the page on my local network without HTTPS, the filament.*.js get loaded via the ASSET_URL, but /filament/assets/filament-icon-picker-styles.css, /filament/assets/app.js and /filament/assets/echo.js get loaded via HTTP.

Thanks for you help BTW I really appriciate it!

[heloufir]

Hmm, the first file filament.*.js is managed by the helper application (this repo), but the others are used inside packages that this repo depends on:

• /filament/assets/filament-icon-picker-styles.css: guava/filament-icon-picker package
• /filament/assets/app.js and /filament/assets/echo.js: filament/filament package

I will check if there is something to configure to let this work and let you know!

Just to know @TheZoker what web server are you using, nginx or apache or ... ?

[TheZoker]

Thanks!

Good question, whatever the docker container is using as a web server: https://github.com/devaslanphp/project-management/blob/master/Dockerfile#L4

[heloufir]

In nginx for example, you can add a permanent redirect from HTTP to HTTPS, like below:

server {
    listen 80;
    server_name youdomain.com;

    return 301 https://youdomain.com$request_uri;
}

server {
    listen 443 ssl http2;
    server_name youdomain.com;
...
}

More details: https://robindirksen.com/blog/laravel-redirect-to-https-a-middleware-to-force-https#force-https-with-nginx

[heloufir]

In nginx for example, you can add a permanent redirect from HTTP to HTTPS, like below:

server {
    listen 80;
    server_name youdomain.com;

    return 301 https://youdomain.com$request_uri;
}

server {
    listen 443 ssl http2;
    server_name youdomain.com;
...
}

More details: https://robindirksen.com/blog/laravel-redirect-to-https-a-middleware-to-force-https#force-https-with-nginx

@TheZoker Did you test the nginx conf example above?

[TheZoker]

I'm using NGNX Proxy manager to handle the request: https://nginxproxymanager.com/

I'm not sure how to set this up there. But I think the web app should load the schema correctly. If I set the assets url, the assets should be loaded via this URL right?

[heloufir]

@TheZoker Yep, normally the application should load URLs right, I just wanted to know if using the Nginx configuration will change anything.

Anyway, I'm looking for a solution. I will let you know ASAP if I find a solution.

[heloufir]

I think in addition to the env variable ASSET_URL=https://your_domain.com you will need to add the Nginx server block I have said in my previous command.

So I think you are using the Nginx Proxy Manager Docker image, you can use the terminal of your docker image, to access the volume of your container and then search the nginx configuration file and add the following block, to redirect HTTP to HTTPS :

server {
    listen 80;
    server_name youdomain.com;

    return 301 https://youdomain.com$request_uri;
}

Check this in Nginx Proxy Manager docs, for more details about paths: https://nginxproxymanager.com/advanced-config/#custom-nginx-configurations

I've never used this tool before, but using Nginx or Apache, I always add a redirection to HTTPS in my host

FYI, I will add in the next release an env variable to force HTTPS in the AppServiceProvider dynamically.

[TheZoker]

Hmm I think these custom nginx configurations would then apply to all entries in the manager not just this one.

Within a entry there is this option, which I enabled right at the beginning:

This redirects the calls to https and for all other 25+ applications this works without issue, but not for helper for some reason 🤔

[heloufir]

I will need to reproduce this in my environment to check what can cause it, I will let you know after that.

Can you give me your docker-compose.yml file used to configure helper form Docker

@TheZoker did you check if the "Force SSL" worked after clearing your network and browser cache? I had this cache issue with an application deployed by nginx

[TheZoker]

Thanks :)

Here is my compose file:

version: '3.8'
services:
  helper:
    image: eloufirhatim/helper
    container_name: Helper
    restart: always
    ports:
      - 80:8000/tcp
    environment:
      - APP_URL=<secret>
      - ASSET_URL=<secret>
      - APP_NAME="Projects"
      - DB_CONNECTION=mysql
      - DB_HOST=<secret>
      - DB_PORT=3306
      - DB_DATABASE=<secret>
      - DB_USERNAME=<secret>
      - DB_PASSWORD=<secret>
      - MAIL_MAILER=smtp
      - MAIL_HOST=<secret>
      - MAIL_PORT=587
      - MAIL_USERNAME=<secret>
      - MAIL_PASSWORD=<secret>
      - MAIL_ENCRYPTION=tls

I replaced all the sensitive information with <secret>. Let me know if you need anything else. And thanks for taking the time to debug this with me :)

I tried accessing the page on a different network with a different device and it was still there, so no caching issue I guess :/

[gaweng]

As documentation for all: Environment: APP_FORCE_HTTPS must set to true

I also ran into that error and doesn't found a solution in docs or here, but these was already fixed by @heloufir in Version 1.2.3. So only documented the solution here for everyone.

[heloufir]

@gaweng sorry about that, I didn't find the time to add it in docs. So all works fine when you put the env variable to true?

[gaweng]

No worries, thanks for the great work, excecpt the smtp issue. Yes, everything is fine.

Maybe I will get some time for little documentation or considering with laravel and adding some feature ideas.

[TheZoker]

Works for me as well 🎉 Closing this issue, thanks for your support!

[heloufir]

Thanks @gaweng for your help And @TheZoker for confirmation