[GH-ISSUE #137] White screen when using a docker container with nginx proxy #94

Closed
opened 2026-03-15 12:31:19 +03:00 by kerem · 12 comments
Owner

Originally created by @gbalatckii on GitHub (Jun 30, 2023).
Original GitHub issue: https://github.com/axllent/mailpit/issues/137

Hi all,
I would like to use Mailpit on our dev environment and for this I use a docker container and I set up a nginx proxy. When I navigate to Mailpit I see a white screen. Can anyone tell me what the problem could be? Thank you!

Best regards,
Georgii

Bildschirmfoto 2023-06-30 um 15 50 08
Bildschirmfoto 2023-06-30 um 15 50 18
Bildschirmfoto 2023-06-30 um 15 50 41

Originally created by @gbalatckii on GitHub (Jun 30, 2023). Original GitHub issue: https://github.com/axllent/mailpit/issues/137 Hi all, I would like to use Mailpit on our dev environment and for this I use a docker container and I set up a nginx proxy. When I navigate to Mailpit I see a white screen. Can anyone tell me what the problem could be? Thank you! Best regards, Georgii ![Bildschirmfoto 2023-06-30 um 15 50 08](https://github.com/axllent/mailpit/assets/57895385/6ff2ca88-542a-4bd7-b9a7-1452de8bbfae) ![Bildschirmfoto 2023-06-30 um 15 50 18](https://github.com/axllent/mailpit/assets/57895385/2cb2fb2d-6ac3-4b9a-927b-47c3dc899e66) <img width="838" alt="Bildschirmfoto 2023-06-30 um 15 50 41" src="https://github.com/axllent/mailpit/assets/57895385/1df63a40-e920-47a0-aae2-bf828f94a858">
kerem closed this issue 2026-03-15 12:31:24 +03:00
Author
Owner

@axllent commented on GitHub (Jun 30, 2023):

What does the response for the app css and app.js return?

<!-- gh-comment-id:1615125593 --> @axllent commented on GitHub (Jun 30, 2023): What does the response for the app css and app.js return?
Author
Owner

@gbalatckii commented on GitHub (Jun 30, 2023):

@axllent

CSS

<!DOCTYPE html><html lang="en"><head> <meta charset="utf-8"> <title>LenoClient</title> <base href="/"> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="icon" type="image/x-icon" href="favicon.ico"> <style>html,body {
    margin: 0;
    padding: 0
}

html {
    box-sizing: border-box
}

*,*:before,*:after {
    box-sizing: inherit
}

html {
    background-color: #fff;
    font-size: 16px;
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    min-width: 300px;
    overflow-x: hidden;
    overflow-y: scroll;
    text-rendering: optimizeLegibility;
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%
}

body {
    font-family: BlinkMacSystemFont,-apple-system,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,Helvetica,Arial,sans-serif
}

body {
    color: #4a4a4a;
    font-size: 1em;
    font-weight: 400;
    line-height: 1.5
}

html,body {
    width: 100vw;
    height: 100vh;
    background-color: #eff1fa
}

</style><link rel="stylesheet" href="styles.dd426706f04b972c.css" media="print" onload="this.media='all'"><noscript><link rel="stylesheet" href="styles.dd426706f04b972c.css"></noscript></head> <body> <app-root></app-root> <script src="runtime.b87219bda1547c35.js" type="module"></script><script src="polyfills.e4381df6a608e04b.js" type="module"></script><script src="main.61db170c05832fbc.js" type="module"></script> </body></html>

JS

<!DOCTYPE html><html lang="en"><head>
  <meta charset="utf-8">
  <title>LenoClient</title>
  <base href="/">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="icon" type="image/x-icon" href="favicon.ico">
<style>html,body{margin:0;padding:0}html{box-sizing:border-box}*,*:before,*:after{box-sizing:inherit}html{background-color:#fff;font-size:16px;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;min-width:300px;overflow-x:hidden;overflow-y:scroll;text-rendering:optimizeLegibility;-webkit-text-size-adjust:100%;text-size-adjust:100%}body{font-family:BlinkMacSystemFont,-apple-system,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,Helvetica,Arial,sans-serif}body{color:#4a4a4a;font-size:1em;font-weight:400;line-height:1.5}html,body{width:100vw;height:100vh;background-color:#eff1fa}</style><link rel="stylesheet" href="styles.dd426706f04b972c.css" media="print" onload="this.media='all'"><noscript><link rel="stylesheet" href="styles.dd426706f04b972c.css"></noscript></head>
<body>
  <app-root></app-root>
<script src="runtime.b87219bda1547c35.js" type="module"></script><script src="polyfills.e4381df6a608e04b.js" type="module"></script><script src="main.61db170c05832fbc.js" type="module"></script>

</body></html>
<!-- gh-comment-id:1615136110 --> @gbalatckii commented on GitHub (Jun 30, 2023): @axllent # CSS ```css <!DOCTYPE html><html lang="en"><head> <meta charset="utf-8"> <title>LenoClient</title> <base href="/"> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="icon" type="image/x-icon" href="favicon.ico"> <style>html,body { margin: 0; padding: 0 } html { box-sizing: border-box } *,*:before,*:after { box-sizing: inherit } html { background-color: #fff; font-size: 16px; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; min-width: 300px; overflow-x: hidden; overflow-y: scroll; text-rendering: optimizeLegibility; -webkit-text-size-adjust: 100%; text-size-adjust: 100% } body { font-family: BlinkMacSystemFont,-apple-system,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,Helvetica,Arial,sans-serif } body { color: #4a4a4a; font-size: 1em; font-weight: 400; line-height: 1.5 } html,body { width: 100vw; height: 100vh; background-color: #eff1fa } </style><link rel="stylesheet" href="styles.dd426706f04b972c.css" media="print" onload="this.media='all'"><noscript><link rel="stylesheet" href="styles.dd426706f04b972c.css"></noscript></head> <body> <app-root></app-root> <script src="runtime.b87219bda1547c35.js" type="module"></script><script src="polyfills.e4381df6a608e04b.js" type="module"></script><script src="main.61db170c05832fbc.js" type="module"></script> </body></html> ``` # JS ```HTML <!DOCTYPE html><html lang="en"><head> <meta charset="utf-8"> <title>LenoClient</title> <base href="/"> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="icon" type="image/x-icon" href="favicon.ico"> <style>html,body{margin:0;padding:0}html{box-sizing:border-box}*,*:before,*:after{box-sizing:inherit}html{background-color:#fff;font-size:16px;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;min-width:300px;overflow-x:hidden;overflow-y:scroll;text-rendering:optimizeLegibility;-webkit-text-size-adjust:100%;text-size-adjust:100%}body{font-family:BlinkMacSystemFont,-apple-system,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,Helvetica,Arial,sans-serif}body{color:#4a4a4a;font-size:1em;font-weight:400;line-height:1.5}html,body{width:100vw;height:100vh;background-color:#eff1fa}</style><link rel="stylesheet" href="styles.dd426706f04b972c.css" media="print" onload="this.media='all'"><noscript><link rel="stylesheet" href="styles.dd426706f04b972c.css"></noscript></head> <body> <app-root></app-root> <script src="runtime.b87219bda1547c35.js" type="module"></script><script src="polyfills.e4381df6a608e04b.js" type="module"></script><script src="main.61db170c05832fbc.js" type="module"></script> </body></html> ```
Author
Owner

@axllent commented on GitHub (Jun 30, 2023):

Yeah, both of those have nothing to do with Mailpit, and must be coming from your default app (that nginx is serving, LenoClient?). Your configuration isn't complete either as it does not account for the websocket connection either. I'm not on my computer right now but I'll have a look later today to see if I can dig up anything.

<!-- gh-comment-id:1615150863 --> @axllent commented on GitHub (Jun 30, 2023): Yeah, both of those have nothing to do with Mailpit, and must be coming from your default app (that nginx is serving, LenoClient?). Your configuration isn't complete either as it does not account for the websocket connection either. I'm not on my computer right now but I'll have a look later today to see if I can dig up anything.
Author
Owner

@gbalatckii commented on GitHub (Jun 30, 2023):

Okay, thank you. Locally everything works fine (there is no nginx so no proxy), so I left the docker config as it is.
Will be glad to hear from you

<!-- gh-comment-id:1615154840 --> @gbalatckii commented on GitHub (Jun 30, 2023): Okay, thank you. Locally everything works fine (there is no nginx so no proxy), so I left the docker config as it is. Will be glad to hear from you
Author
Owner

@axllent commented on GitHub (Jun 30, 2023):

Does the url you are accessing have a training slash? http://domain/mailpit/

<!-- gh-comment-id:1615161180 --> @axllent commented on GitHub (Jun 30, 2023): Does the url you are accessing have a training slash? http://domain/mailpit/
Author
Owner

@gbalatckii commented on GitHub (Jun 30, 2023):

Nope, just /mailpit

<!-- gh-comment-id:1615176856 --> @gbalatckii commented on GitHub (Jun 30, 2023): Nope, just `/mailpit`
Author
Owner

@axllent commented on GitHub (Jun 30, 2023):

You'll need to change that for starters, adding both a trailing slash to your proxy as well as the url you are loading. I suspect it will work after that, well the basic web UI anyway, but without websocket support for "live updates". There is a bit of info in the wiki about that.

<!-- gh-comment-id:1615183317 --> @axllent commented on GitHub (Jun 30, 2023): You'll need to change that for starters, adding both a trailing slash to your proxy as well as the url you are loading. I suspect it will work after that, well the basic web UI anyway, but without websocket support for "live updates". There is a bit of info in the wiki about that.
Author
Owner

@axllent commented on GitHub (Jun 30, 2023):

In addition to that, you'll also need to tell Mailpit that you are accessing it under a different webroot, to in your docker compose file you'll need to add/set the environment:

    environment:
      MP_WEBROOT: /mailpit/
<!-- gh-comment-id:1615190080 --> @axllent commented on GitHub (Jun 30, 2023): In addition to that, you'll also need to tell Mailpit that you are accessing it under a different webroot, to in your docker compose file you'll need to add/set the environment: ```yaml environment: MP_WEBROOT: /mailpit/ ```
Author
Owner

@gbalatckii commented on GitHub (Jul 3, 2023):

Thanks @axllent I will try it out today and let you know

<!-- gh-comment-id:1617572836 --> @gbalatckii commented on GitHub (Jul 3, 2023): Thanks @axllent I will try it out today and let you know
Author
Owner

@gbalatckii commented on GitHub (Jul 3, 2023):

Hi @axllent
the routing with trailing slashes works and I can see the default UI, thank you!
Unfortunately I don't see any emails. Do you have a tipp for me, how can I configure a Mailpit as a SMTP server on our environment?

SPRING_MAIL_HOST: ?
SPRING_MAIL_PORT: 1025
SPRING_MAIL_USERNAME: ...
SPRING_MAIL_PASSWORD: ...
APP_NOTIFICATION_PUBLIC_URL: https://...
SPRING_MAIL_PROPERTIES_MAIL_SMTP_AUTH: "true"
SPRING_MAIL_PROPERTIES_MAIL_SMTP_STARTTLS_ENABLE: "true"
SPRING_MAIL_PROPERTIES_MAIL_SMTP_STARTTLS_REQUIRED: "true"

<!-- gh-comment-id:1618227550 --> @gbalatckii commented on GitHub (Jul 3, 2023): Hi @axllent the routing with trailing slashes works and I can see the default UI, thank you! Unfortunately I don't see any emails. Do you have a tipp for me, how can I configure a Mailpit as a SMTP server on our environment? SPRING_MAIL_HOST: ? SPRING_MAIL_PORT: 1025 SPRING_MAIL_USERNAME: ... SPRING_MAIL_PASSWORD: ... APP_NOTIFICATION_PUBLIC_URL: https://... SPRING_MAIL_PROPERTIES_MAIL_SMTP_AUTH: "true" SPRING_MAIL_PROPERTIES_MAIL_SMTP_STARTTLS_ENABLE: "true" SPRING_MAIL_PROPERTIES_MAIL_SMTP_STARTTLS_REQUIRED: "true"
Author
Owner

@axllent commented on GitHub (Jul 4, 2023):

@gbalatckii I don't know anything about Spring mail (?), nor have any clue with what options you started mailpit with, so I cannot tell based on the info you have provided so far. By default Mailpit will start without any authentication requirement, and no STARTTLS support (unless you have specifically enabled those). So I'd guess:

SPRING_MAIL_HOST: ?
SPRING_MAIL_PORT: 1025
SPRING_MAIL_PROPERTIES_MAIL_SMTP_AUTH: "false"
SPRING_MAIL_PROPERTIES_MAIL_SMTP_STARTTLS_ENABLE: "false"
<!-- gh-comment-id:1619512782 --> @axllent commented on GitHub (Jul 4, 2023): @gbalatckii I don't know anything about Spring mail (?), nor have any clue with what options you started mailpit with, so I cannot tell based on the info you have provided so far. By default Mailpit will start without any authentication requirement, and no STARTTLS support (unless you have specifically enabled those). So I'd guess: ``` SPRING_MAIL_HOST: ? SPRING_MAIL_PORT: 1025 SPRING_MAIL_PROPERTIES_MAIL_SMTP_AUTH: "false" SPRING_MAIL_PROPERTIES_MAIL_SMTP_STARTTLS_ENABLE: "false" ```
Author
Owner

@gbalatckii commented on GitHub (Jul 5, 2023):

@axllent okay thank you for your quick support, I think this is not your problem anymore 🙂 Issue is closed

<!-- gh-comment-id:1621457878 --> @gbalatckii commented on GitHub (Jul 5, 2023): @axllent okay thank you for your quick support, I think this is not your problem anymore 🙂 Issue is closed
Sign in to join this conversation.
No milestone
No project
No assignees
1 participant
Notifications
Due date
The due date is invalid or out of range. Please use the format "yyyy-mm-dd".

No due date set.

Dependencies

No dependencies set.

Reference
starred/mailpit#94
No description provided.