0

I'm launching a Docker container for WordPress following this tutorial. I'm running this on a machine that is at my desk, I have complete access. It is running Ubuntu 20.04.

Here is my docker-compose.yml for reference.

version: '3.3'

services:
   db:
     image: mysql:5.7
     volumes:
       - db_data:/var/lib/mysql
     restart: always
     environment:
       MYSQL_ROOT_PASSWORD: rootpassword
       MYSQL_DATABASE: wordpress
       MYSQL_USER: wordpress
       MYSQL_PASSWORD: dbpassword


wordpress:
     depends_on:
       - db
     image: wordpress:latest
     ports:
       - "12130:80"
     restart: always
     environment:
       WORDPRESS_DB_HOST: db:3306
       WORDPRESS_DB_USER: wordpress
       WORDPRESS_DB_PASSWORD: dbpassword
       WORDPRESS_DB_NAME: wordpress
volumes:
    db_data: {}

(Passwords replaced)

When I run docker-compose up -d, the container comes up, the server is available at 127.0.0.1:12130, and I can configure and install WordPress. Everything works fine from the machine hosting the application.

When I try to access the site from a different device, the blog loads, but there are no styles. I expect that this is because the "Site Address" is configured as http://127.0.0.1:12130, so when the browser tries to fetch the stylesheet, it's going there, which 404s.

I believe the solution here is to configure nginx to give the application a public address and change the "Site Address" and "WordPress Address" to that address. Once I do that, the entire service is completely inaccessible by any means. I have to destroy the data with docker-compose down --volumes and install from scratch.

For reference, here is my complete /etc/nginx/conf.d/default.conf, I stripped everything else out. I also stopped all of my other web services, so just WordPress is running.

ssl_certificate /path/to/fullchain.pem;
ssl_certificate_key /path/to/privkey.pem;

server {
    listen 443 ssl;
    server_name sub.mydomain.org;


location / {
    proxy_pass http://127.0.0.1:12130;
}



}

If I try to access https://sub.mydomain.org using Firefox, it redirects me to 127.0.0.1 (no port) and gives me the standard "Unable to connect" page. If I curl https://sub.mydomain.org, it exits with no output and no errors. I get the same error using 127.0.0.1:12130 and localhost:12130 directly, they both just redirect me to 127.0.0.1, no port, and fail to connect or return empty.

At this point, if I wait a few minutes, accessing 127.0.0.1:12130 or https://sub.mydomain.org in Firefox causes the page to infinitely reload. This is repeatable, I have done this process several times in making sure I have my information straight. For the first few minutes it just redirects to 127.0.0.1 and dies, then it starts infinitely reloading without me changing any config files or restarting any services.

One final note. If I turn on nginx before changing the "Site Address" setting, I can access the server from outside my network just fine, but as before, the styles don't load. So nginx is doing something. And it's been working fine for the other servers I'm hosting.

What's going on here?

Why can I not access the server after I change "Site Address" and "WordPress Address"?

  • Am I going down the complete wrong path by trying to modify the "Site Address" and "WordPress Address" settings?
  • If I should modify those, why is the server behaving like this?
    • Is my nginx configuration wrong?
    • Is my WordPress configuration wrong?
    • Is something else wrong?
  • Or is it something completely different?

I'm very new to self hosting, I apologize if there is an an obvious solution that I'm not seeing. Thank you for your patience.

TechnoSam
  • 131

2 Answers2

0

It turns out that I needed to set some headers in my nginx config. This post helped me discover that.

Now my config looks like this.

server {
    listen 443 ssl;
    server_name sub.domain.org;

location / {
    proxy_pass http://127.0.0.1:12130;
    proxy_set_header    Host                $host;
    proxy_set_header    X-Forwarded-For     $proxy_add_x_forwarded_for;
    proxy_set_header    X-Forwarded-Proto   $scheme;
    proxy_set_header    Accept-Encoding     "";
    proxy_set_header    Proxy               "";
}



}

After setting the "Site Address" and "WordPress Address", everything seems to be working.

I would like to do some more research to understand exactly what's happening here and why it's necessary. If anyone wants to explain in the comments I'd be grateful.

TechnoSam
  • 131
0

I had a similar problem. Thanks to your post I found a solution which seems easier - at least for me. If you don't want to use nginx at all you can also just configure your local IP address as "Site Address" in wordpress.

In my case:

Wordpress Address: http://192.168.178.21:12130

Site Address http://192.168.178.21:12130

That already solves the problem, meaning you will be able to access your wordpress website using e.g 192.168.178.21:12130 in a browser on all machines in the network - The site will load correctly - no 404.

But yes, if your IP changes you have to adapt that address. In that case your approach might be more suitable.

Community
  • 1
Hendric
  • 1