handle image only when login is clicked, avoiding exra load and mixed content

This commit is contained in:
Emil Lerch 2020-04-25 14:14:29 -07:00
parent 4c19e7136d
commit 1ed8213ebe
Signed by: lobo
GPG Key ID: A7B62D657EF764F8

View File

@ -41,23 +41,34 @@ async function modifyBody(pageContentTextPromise, originalResponse) {
`<div id="pagecontent">
<!--edge side include via cf worker-->
${await pageContentResponse.text()}
<!--invisible image to establish tm cookie. Note that troopmaster redirects this https to
/Website/Home, then redirects again, explicitly to http. Since Troopmaste also
doesn't respect CORS, our only way to establish a cookie for login is with this image
tag that eventually will try to fetch an http resource, but we can't tell the browser
here to avoid redirects (we don't want the "image", only the cookie). as if that's not
enough, javascript on /Website/Home actually checks for http and does a
**CLIENT SIDE REDIRECT BACK TO HTTPS**, resulting in a wild flash that we just
avoid with a simple 302 (first in this worker, then back as a checkbox on the
CloudFlare dashboard. Seriously, people...I don't know whether to laugh or cry -->
<img src="https://tmweb.troopmaster.com/mysite/${TMSITENAME}?Home" height="1" width="1" style="opacity:0" >
<!--end invisible image to establish tm cookie-->
<!--End edge side include via cf worker-->
</div>`);
responseBodyText = responseBodyText.replace(initialloadJs, '');
responseBodyText = responseBodyText.replace(login,
`location.href = 'https://tmweb.troopmaster.com/Login/Index?website'`); // eslint-disable-line no-undef
responseBodyText = responseBodyText.replace(login, `
var image = new Image(1, 1);
image.style.cssText = "opacity:0";
document.body.appendChild(image);
// listen for the image's error event before assigning a source
// We use error here because content policy will block loading an
// http resource. Why is it http? Because troopmaster redirects
// our nice clean https to http (then if this were a real request,
// would happily redirect **BACK** to https via client side JS
image.addEventListener('error', function() {
// this function is invoked in the future,
// when the image load event has been fired (and cookies extablished
location.href = 'https://tmweb.troopmaster.com/Login/Index?website';
});
// in case troopmaster fixes this bizarre behavior, we will set up
// a load function too
image.addEventListener('load', function() {
// this function is invoked in the future,
// when the image load event has been fired (and cookies extablished
location.href = 'https://tmweb.troopmaster.com/Login/Index?website';
});
// Set src and trigger the browser to load
image.src = "https://tmweb.troopmaster.com/mysite/${TMSITENAME}?Home"`); // eslint-disable-line no-undef
extraheaders['X-worker-modification-status'] = 'modified';
extraheaders['X-worker-modification-getcontent-ok'] = 'true';