Admin view css breaking behind an amazon load balancer

  • Resolved typeless

    (@jbalyo)


    5 years, 11 months ago

    I’m trying to move a client off Defender and on to Wordfence but ran into a snag. They have one staging server and two (or more) production servers behind a load balancer. They are using Amazon’s Elastic Beanstalk service to handle this.

    The workflow I am using has me uploading code first to the staging server and then rolling out the exact same code to production. The only thing which might differ slightly is with settings that get saved to the database. However, this is a brand new install of Wordfence, so there shouldn’t be much difference there either.

    So basically, it worked perfect on staging, but when I rolled it out to the production servers, the admin side looks broken. The dashboard and other settings pages show HUGE icons and there is no formatting of anything at all. The “All Options” page is a loong list with no cohesion. The one save link at the top I could find doesn’t even work… almost looks like no plugin CSS was loaded at all.

    Please let me know if you can think of anything that might cause something like this to happen. It seems bizarre since the files deployed on either server are identical. Is this a known issue when putting Wordfence behind a load balancer?

Viewing 3 replies - 1 through 3 (of 3 total)
  • Thread Starter typeless

    (@jbalyo)

    Environment (all servers):
    PHP 7.2 running on 64bit Amazon Linux/2.8.5
    Wordpress 5.0.2
    Wordfence 7.1.18

    Thread Starter typeless

    (@jbalyo)

    Thinking that maybe it really was a plugin CSS issue I started poking around in the page source on the admin side and found this interesting difference:

    on staging:
    /wp-content/plugins/wordfence/css/wf-roboto-font.1543941426.css – points to a real css file which loads fine in a browser tab

    Loading the same file on production produces an XML error:

    <Error>
<Code>NoSuchKey</Code>
<Message>The specified key does not exist.</Message>
<Key>
wp-content/plugins/wordfence/css/wf-roboto-font.1543941426.css
</Key>
<RequestId>OMITTED</RequestId>
<HostId>
OMITTED
</HostId>
</Error>

    However, when I check the file tree – that file does exist on each of the production servers, with the exact same ownership and permissions as on the staging server. CTRL+F5? Nope. Twilight zone.

    Thread Starter typeless

    (@jbalyo)

    Turns out this was caused by a DNS-level Cloudfront route that I wasn’t aware of caching files that were already cached by another plugin (W3TC). Once that route was removed, Wordfence is working great.

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Admin view css breaking behind an amazon load balancer’ is closed to new replies.