I have a facebook app that is basically an iframe of my website.
My website runs on HTTPS and has a form that has a POST action to /list-items
. On the server, it renders a page that on the jQuery's $(document).ready()
make an AJAX call to populate a list of items - everything the good'ol JSP (Java server pages), so basically the shell is a document shell.jsp
and the ajax call returns a list.jsp
.
Using the website directly from the browser it acts correctly, maintaining the HTTPS url, but when I use it inside facebook, on its iframe version, what happens is that I cannot submit the form, since facebook says it is trying to post to a HTTP page, giving the user this error:
Mixed Content: The page at 'https://www.facebook.com/xxxx/app/77777/' was loaded over HTTPS, but requested an insecure form action 'http://www.example.com/77777'. This request has been blocked; the content must be served over HTTPS.
How can I solve this problem without putting the absolute path with //example.com/list-item
or https://example.com/list-item
?