diff --git a/lib/pact_broker/app.rb b/lib/pact_broker/app.rb
index 4d03a2a01..d38120d72 100644
--- a/lib/pact_broker/app.rb
+++ b/lib/pact_broker/app.rb
@@ -92,11 +92,13 @@ def configure_database_connection
     def prepare_app
       configure_middleware
 
+      # need this first so UI login logic is performed before API login logic
+      @cascade_apps << build_ui
+
       if configuration.enable_diagnostic_endpoints
         @cascade_apps << build_diagnostic
       end
 
-      @cascade_apps << build_ui
       @cascade_apps << build_api
     end
 
diff --git a/spec/lib/pact_broker/app_spec.rb b/spec/lib/pact_broker/app_spec.rb
index b6edc16cf..63ff8f3b9 100644
--- a/spec/lib/pact_broker/app_spec.rb
+++ b/spec/lib/pact_broker/app_spec.rb
@@ -107,6 +107,31 @@ def call(env)
           expect(last_response.headers["WWW-Authenticate"]).to eq "Basic realm=\"Protected\""
         end
       end
+
+      context "ordering of calls" do
+        class TestAuth1
+          def initialize app; end
+          def call env; end
+        end
+
+        class TestAuth2 < TestAuth1; end
+
+        before do
+          allow(TestAuth1).to receive(:new).and_return(test_auth_1)
+          allow(TestAuth2).to receive(:new).and_return(test_auth_2)
+        end
+
+        let(:test_auth_1) { instance_double('TestAuth1', call: [404, {}, []]) }
+        let(:test_auth_2) { instance_double('TestAuth2', call: [404, {}, []]) }
+
+        it "calls the UI auth before the API auth" do
+          expect(test_auth_1).to receive(:call).ordered
+          expect(test_auth_2).to receive(:call).ordered
+          app.use_ui_auth TestAuth1
+          app.use_api_auth TestAuth2
+          get "/", nil, {'HTTP_ACCEPT' => 'text/html'}
+        end
+      end
     end
 
     describe "authenticate" do