WCF service behind a reverse proxy generates the incorrect URL for JavaScript

Question

I have an ASP.NET application running in IIS that is behind a reverse proxy. The application exposes a WCF service that is consumed from JavaScript

When accessing this service via JavaScript, a JavaScript proxy is automatically created, but it is pointing to the local server (behind the proxy), instead of to the public URL.

From everything I can find, the solution is to add the useRequestHeadersForMetadataAddress element to the behavior element of endpointBehaviors. However, when we do this, The following exception is thrown:

System.ServiceModel.ServiceActivationException: The service '/Web/Services/ServiceBroker.svc' cannot be activated due to an exception during compilation. The exception message is: Cannot add the 'useRequestHeadersForMetadataAddress' behavior extension to 'WcfAjaxEndpointBehavior' endpoint behavior because the underlying behavior type does not implement the IEndpointBehavior interface.

I have also tried manually specifying the baseAddress, to no effect.

From web.config:

<system.serviceModel>
   <behaviors>
      <endpointBehaviors>
         <behavior name="WcfAjaxEndpointBehavior">
            <enableWebScript />
            <useRequestHeadersForMetadataAddress />
         </behavior>
      </endpointBehaviors>
      <serviceBehaviors>
         <behavior name="WcfAjaxServiceBehavior">
            <serviceDebug httpHelpPageEnabled="true" 
                          includeExceptionDetailInFaults="true" />
         </behavior>
      </serviceBehaviors>
   </behaviors>
   <serviceHostingEnvironment aspNetCompatibilityEnabled="true" 
                              multipleSiteBindingsEnabled="true" />
   <services>
      <service name="FoodSafety.WebUI.Services.ServiceBroker" 
               behaviorConfiguration="WcfAjaxServiceBehavior">
         <endpoint address="https://(public url)/Web/Services/ServiceBroker.svc"
                   listenUri="https://(local url)/Web/Services/ServiceBroker.svc"  
                   behaviorConfiguration="WcfAjaxEndpointBehavior" 
                   bindingConfiguration="AjaxServiceBinding" 
                   binding="webHttpBinding" 
                   contract="FoodSafety.WebUI.Services.ServiceBroker" />
          <baseAddresses>
              <add baseAddress="https://(public url)/Web/Services/ServiceBroker.svc" />
          </baseAddresses>
      </service>
   </services>
   <bindings>
      <webHttpBinding>
         <binding name="AjaxServiceBinding">
            <security mode="Transport" />
         </binding>
      </webHttpBinding>
   </bindings>
</system.serviceModel>

I've looked in to implementing IEndpointBehavior, but I don't understand how I would do it in a way that would solve this problem, or even what class should implement it. I can find no examples of it for this functionality.

I have also tried all the solutions from this (unanswered) question, with no luck.

What do I need to do to solve the problem of JavaScript calling the internal URL instead of the external URL?