Server is unreachable when uploading wide images

Developer help Self-hosting
1

Whenever I try to upload an image, at least when the image is wide, it would say that the server is unreachable. Is there a way to increase the image upload size?

2

Better contact your hosting support, how to resolve that issue.

3

What’s the exact file size of an image that fails?

On your server, use a tool like htop to monitor the CPU while the uploading happening. Does the server really get so busy it can’t respond?

Check your Nginx error logs (or other web server logs) for the request. What HTTP error code was logged? 500 or something else?

4

I dont think its the server because it contacts the Ghost API locally. That is why I was wondering if there is some sort of limit.

My Ghost installation is through docker.

5

To help you further, it’s useful to know the exact file size of the image that failed and the HTTP error code returned by your web server. Thanks. Are you using Nginx?

Pasting your web server config could also be helpful.

And since you mentioned the width of the image, what’s a file size and width that succeeds vs a file size and width that fails?

6

I got this in the inspect console:

Uncaught TypeError: Cannot read properties of undefined (reading ‘url’)
at vendor-fadbf85ad92c591dc4bd3755312b6ddf.js:12192:55
at e.value (vendor-fadbf85ad92c591dc4bd3755312b6ddf.js:5971:7)
at E.updateSrc (vendor-fadbf85ad92c591dc4bd3755312b6ddf.js:12192:13)
at B._join (vendor-fadbf85ad92c591dc4bd3755312b6ddf.js:3658:275)
at B.join (vendor-fadbf85ad92c591dc4bd3755312b6ddf.js:3624:13)
at c (vendor-fadbf85ad92c591dc4bd3755312b6ddf.js:2431:23)
at vendor-fadbf85ad92c591dc4bd3755312b6ddf.js:802:75
at a (vendor-fadbf85ad92c591dc4bd3755312b6ddf.js:2352:139)
at vendor-fadbf85ad92c591dc4bd3755312b6ddf.js:802:30
at e.onComplete (vendor-fadbf85ad92c591dc4bd3755312b6ddf.js:952:77)

The wide picture is 1902 x 505>
A picture that works is 1000 x 1000, but not 1200 x 1200.

I tried rescaling the wide image down to 600 x 277, but it still does not work.

7

You may be running into your web servers max file upload size, but you haven’t confirmed which web server you are using, nor confirmed the HTTP response code issued by the server nor pasted your web server configuration.

Without knowing more details about your environment, it’s difficult to be of much more help.

When Ghost is installed through the CLI, it sets up a reasonable max file upload size for Nginx, but you said you are using Docker, so unless you tuned Nginx yourself, you are probably getting Nginx’s default value for client_max_body_size, which is only one megabyte.

That is size is so small that’s quite possible that a small photo would be small enough to work while a “wide” photo would have a large enough file size to trip the limit.

But you didn’t provide the file sizes, so it’s hard to know for sure.

https://nginx.org/en/docs/http/ngx_http_core_module.html#client_max_body_size

8

All of the files are are less than 1MB. The wide image is 116KB while the square image is 141 KB.

There arent any errors from the container itself as far as I am aware.

The entire setup is isolated in a container. This is the docker-compose file that I used:

version: '3.2'

services:

  ghost:
    image: ghost:latest
    container_name: ghost
    restart: always
    ports:
      - 8080:2368

    volumes:
      - /root/vol/backup/web:/var/lib/ghost/content

    environment:
      # see https://ghost.org/docs/config/#configuration-options

      

      database__client: mysql
      database__connection__host: db
      database__connection__user: root
      database__connection__password: pass
      database__connection__database: ghost

      NODE_ENV: production

      
      # this url value is just an example, and is likely wrong for your environment!
      url: http://website.org
      # contrary to the default mentioned in the linked documentation, this image defaults to NODE_ENV=production (so development mode needs to be explicitly specified if desired)
      #NODE_ENV: development
      
  db:
    image: mysql:8.0
    restart: always
    environment:
      MYSQL_ROOT_PASSWORD: password
    volumes:
      - type: bind
        source: /root/vol/backup/config.production.json
        target: /var/lib/ghost/config.production.json

All of this is hosted on a VPS server on Ubuntu. I am using a reverse proxy with Nginx Proxy Manager and I have Websockets, Block Common Exploits, Force SSL, HTTP/2 Support, HSTS Enabled, HSTS Subdomains enabled. I have a Let’s Encrypt SSL certificate on my domain.

9

You need to look at your Nginx access logs to see the HTTP response code returned when the image fails to upload.