How to securely send content from non-secure page to a secure URL?

Question

I have a JavaScript snippet that is aimed to be embedded into any webpage. This snippet loads a form into the page it's embedded in. The snippet then sends the form data to a secure URL. Here is the problem, the page where the snippet loads the form may not be secure, but I need the form data to be securely transferred to a secure external URL. How can I implement this if possible?

Answer 1

The JavaScript loaded on the HTTP page would be replaced by an attacker who is modifying your traffic. The modified JavaScript can simply post the data to the public somewhere. Thus it's not possible to securely transfer data from the HTTP page to an HTTPS page. Unless you have some other definition of "secure" that I'm missing?

Answer 2

If a form's ACTION attribute directs it to an HTTPS destination, then the content is encrypted and transmitted securely to the destination, regardless of how the form HTML itself was originally transmitted: when the user submits the form, the browser starts a new connection and issues a POST request (I'm assuming your form's METHOD is POST, not GET) against the destination, not the current browser location. In this case, that POST occurs over HTTPS because the destination is "https://...".

That says nothing about the inherent security risks of XSS or whatnot that could be embedded on the insecure page, or MITM attacks against the form HTML while it is being transmitted over HTTP via your JavaScript... you'll have to decide if those considerations are worthwhile for your project. Perhaps your JavaScript can embed an IFRAME with the form in it (using HTTPS for the IFRAME's SRC) instead of the FORM itself; this is what Facebook and others do to prevent other scripts running on the insecure page from accessing the form and its data - the browser will block such attempts from other scripts based on its same-origin policy (every popular modern browser can be relied upon to do this), and the form is transmitted over HTTPS when the IFRAME requests it. This is the preferred way to deliver a form to an arbitrary site when its contents need to be secure and you cannot control where the form is embedded.

Answer 3

It's the action URL that matters when you submit a form, so if your form uses an https:// URL, it will make the POST request to that URL whether the form itself is hosted on an http:// or https:// page.

However, you should also serve the form page via https://. See the first rule of the WASP TLS cheat sheet (this principle not only applies to login pages but to any similar form).

The problem is that, without serving the form's page via https:// on an address the user can see an verify, the user can't trust that a MITM attacker hasn't altered this form. For example, such an attacker could replace the action attribute transparently to redirect to another site, or inject some JavaScript that logs every key entered into that form, supposed to gather sensitive data.