Colly (GoLang) Web Scrapper - 403 Forbidden - javascript

I am trying to scrape products from mediamarkt site with Colly. Here is my code:
func WebScraper(allowedDomain string, page string, htmlElement string, htmlTag string) {
/*
Order in which Collector's callbacks are executed in:
1. OnRequest -> Called before a request
2. OnError -> Called if error occured durig the request
3. OnResponse -> Called after response received
4. OnHTML -> Called right after OnResponse if the received content is HTML
5. OnXML -> Called right after OnHTML if the recieved content is HTML or XML
6. Scraped -> Called after OnXML callback
*/
c := colly.NewCollector(
// MaxDepth is 2, so only the links on the scraped page
// and links on those pages are visited
colly.AllowedDomains(allowedDomain),
colly.MaxDepth(2),
colly.Async(true),
)
// Limit the maximum parallelism to 2
// This is necessary if the goroutines are dynamically
// created to control the limit of simultaneous requests.
//
// Parallelism can be controlled also by spawning fixed
// number of go routines.
c.Limit(&colly.LimitRule{DomainGlob: "*", Parallelism: 2})
// Step 2. Perform some logic before REQUEST Is made
c.OnRequest(func(r *colly.Request) {
app.InfoLog.Println("Visiting ", r.URL.String())
})
// Step 2.1. If errror occurred during the request, handle it!
c.OnError(func(r *colly.Response, err error) {
app.ErrorLog.Println("Request URL: ", r.Request.URL, " failed with response: ", r, "\nError: ", err)
})
// On every a element which has href attribute call callback
c.OnHTML(htmlElement, func(e *colly.HTMLElement) {
app.InfoLog.Println(e.ChildText(htmlTag))
})
c.Visit(page)
// Wait until threads are finished
c.Wait()
}
I've already tried scraping Wikipedia and some other sites, and it works. But here, I am getting 403 Forbidden error. Here is HEADER from RESPONSE:
Permissions-Policy : [accelerometer=(),autoplay=(),camera=(),clipboard-read=(),clipboard-write=(),fullscreen=(),geolocation=(),gyroscope=(),hid=(),interest-cohort=(),magnetometer=(),microphone=(),payment=(),publickey-credentials-get=(),screen-wake-lock=(),serial=(),sync-xhr=(),usb=()]
Expires : [Thu, 01 Jan 1970 00:00:01 GMT]
Set-Cookie : [__cf_bm=eEhiHiAsyTUuG7Ra4_rGhBWBHGxP_FWphwxEIl66hW8-1654161057-0-Aef4Vr6ypA0zr8CVP66c2x9X1s+vUcusYPkMqJR3MhpLt/FxMHi+GXMD0+YEcb2L/cLC6RVhgROG9gOvXVTjQMIYUjwyvfi1/hFvAPthwzC/; path=/; expires=Thu, 02-Jun-22 09:40:57 GMT; domain=.mediamarkt.de; HttpOnly; Secure; SameSite=None]
Vary : [Accept-Encoding]
Date : [Thu, 02 Jun 2022 09:10:57 GMT]
Expect-Ct : [max-age=604800, report-uri="https://report-uri.cloudflare.com/cdn-cgi/beacon/expect-ct"]
Content-Type : [text/html; charset=UTF-8]
Cache-Control : [private, max-age=0, no-store, no-cache, must-revalidate, post-check=0, pre-check=0]
Server : [cloudflare]
Cf-Ray : [714f0f0e3b881c23-SOF]
X-Frame-Options : [SAMEORIGIN]
Strict-Transport-Security : [max-age=15897600]
X-We-Are-Hiring : [We appreciate developers that love to explore what goes on under the hood of software. Apply now at https://careers.mediamarktsaturn.com/MediaMarktSaturn!]
And here is the Body of the RESPONSE:
<!DOCTYPE html>
<!--[if lt IE 7]> <html class="no-js ie6 oldie" lang="en-US"> <![endif]-->
<!--[if IE 7]> <html class="no-js ie7 oldie" lang="en-US"> <![endif]-->
<!--[if IE 8]> <html class="no-js ie8 oldie" lang="en-US"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js" lang="en-US"> <!--<![endif]-->
<head>
<title>Please Wait... | Cloudflare</title>
<meta charset="UTF-8" />
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=Edge" />
<meta name="robots" content="noindex, nofollow" />
<meta name="viewport" content="width=device-width,initial-scale=1" />
<link rel="stylesheet" id="cf_styles-css" href="/cdn-cgi/styles/cf.errors.css" />
<!--[if lt IE 9]><link rel="stylesheet" id='cf_styles-ie-css' href="/cdn-cgi/styles/cf.errors.ie.css" /><![endif]-->
<style>body{margin:0;padding:0}</style>
<!--[if gte IE 10]><!-->
<script>
if (!navigator.cookieEnabled) {
window.addEventListener('DOMContentLoaded', function () {
var cookieEl = document.getElementById('cookie-alert');
cookieEl.style.display = 'block';
})
}
</script>
<!--<![endif]-->
<script>
//<![CDATA[
(function(){
window._cf_chl_opt={
cvId: "2",
cType: "managed",
cNounce: "41590",
cRay: "714f0f0e3b881c23",
cHash: "7549f8b7d78a2a4",
cUPMDTk: "\/de\/category\/smartphones-579.html?__cf_chl_tk=PrWxKIbQcP5Dh7keed1nL5yIqzx2FEiIyMvDz_3jTp0-1654161057-0-gaNycGzNBqU",
cFPWv: "g",
cTTimeMs: "1000",
cLt: "n",
cRq: {
ru: "aHR0cHM6Ly93d3cubWVkaWFtYXJrdC5kZS9kZS9jYXRlZ29yeS9zbWFydHBob25lcy01NzkuaHRtbA==",
ra: "Y29sbHkgLSBodHRwczovL2dpdGh1Yi5jb20vZ29jb2xseS9jb2xseQ==",
rm: "R0VU",
d: "vr3pEux85BB4TszTDjAPScZq2oMqIA1GoFOPEjftlymNdbnhggazvYIWsXBQOTzYsqm6B1QxUgRJqK2CNemXc9VqLj70rk1vMXKFsNRn8eSkCfbX1bVvJbp+S3YSI+zdrPmzOiiq4gO2vWm5pOKlKc+7qmux89XYc1J0YnOprUgYdHNeayUheiiXkRqwPQqW/cY1+5C2IsPzqzcU7M7YCnWjenwMn1pjLFjMclUxEi6s/gu5lLTr8HSnalidGwSVexGj4SBqmKekU99FZqEtE5kJutfFoUEiwuEJmmo7QrYuWrXRfB80Fms3xVWa8J6Ga4M9cnJgv3PP9qRucyj01EtAlfkpx7coaUfTJue65CZcHA4SJcB7WqMHdaUVojdSFsc4UoCYGbnstK2lyuX+v6GAC2GGOtK23s8DcfcB/YJsCChlpkURsIfnGbzmfI5cQf5JqWkhnW6p1UG3oKs7bec/dUNKL+XJjRH0rvyvKFkMX6Ca/0FX00zR0a1WcxnXOhU1iZzQOR2U/ZrXvfE0jeFCRQ+OHvCd0Ncfosas5axWsibMU+MeasO+bYbG8hTjHgvG8+tFc0tYII+nbVWFp44k+mWOBIhKh951P8TAoLl1h4HO9+hxKdpjQGAtjeZJ39oc3daC5julK9RJOng8Hw==",
t: "MTY1NDE2MTA1Ni45OTkwMDA=",
m: "cZC1J0+WAKjb0r4I8GxqyYnUTcVqCk2O4D12RYxeP7Q=",
i1: "90OzQhzN+BROMhNBF2EFBw==",
i2: "grkPyoRifg7B+X0FEjpHHQ==",
zh: "q1ZR4e29hYz+cTx2o5UYJG1hFifFh0loDJNTfBOG7gU=",
uh: "DaHp0r0NTdLobcNE2+1UVaN6g6tbXcsPQKHJoB7xdZI=",
hh: "+dgxVyY+fQBum8yrY3Q9pqqEvjydD2WPU3jRaUrPF1o=",
}
};
}());
//]]>
</script>
<style>
#cf-wrapper #spinner {width:69px; margin: auto;}
#cf-wrapper #cf-please-wait{text-align:center}
.attribution {margin-top: 32px;}
.bubbles { background-color: #f58220; width:20px; height: 20px; margin:2px; border-radius:100%; display:inline-block; }
#cf-wrapper #challenge-form { padding-top:25px; padding-bottom:25px; }
#cf-hcaptcha-container { text-align:center;}
#cf-hcaptcha-container iframe { display: inline-block;}
#keyframes fader { 0% {opacity: 0.2;} 50% {opacity: 1.0;} 100% {opacity: 0.2;} }
#cf-wrapper #cf-bubbles { width:69px; }
#-webkit-keyframes fader { 0% {opacity: 0.2;} 50% {opacity: 1.0;} 100% {opacity: 0.2;} }
#cf-bubbles > .bubbles { animation: fader 1.6s infinite;}
#cf-bubbles > .bubbles:nth-child(2) { animation-delay: .2s;}
#cf-bubbles > .bubbles:nth-child(3) { animation-delay: .4s;}
</style>
</head>
<body>
<div id="cf-wrapper">
<div class="cf-alert cf-alert-error cf-cookie-error" id="cookie-alert" data-translate="enable_cookies">Please enable cookies.</div>
<div id="cf-error-details" class="cf-error-details-wrapper">
<div class="cf-wrapper cf-header cf-error-overview">
<h1 data-translate="managed_challenge_headline">Please wait...</h1>
<h2 class="cf-subheadline"><span data-translate="managed_checking_msg">We are checking your browser...</span> www.mediamarkt.de</h2>
</div>
<div class="cf-section cf-highlight cf-captcha-container">
<div class="cf-wrapper">
<div class="cf-columns two">
<div class="cf-column">
<div class="cf-highlight-inverse cf-form-stacked">
<form class="challenge-form managed-form" id="challenge-form" action="/de/category/smartphones-579.html?__cf_chl_f_tk=PrWxKIbQcP5Dh7keed1nL5yIqzx2FEiIyMvDz_3jTp0-1654161057-0-gaNycGzNBqU" method="POST" enctype="application/x-www-form-urlencoded">
<div id='cf-please-wait'>
<div id='spinner'>
<div id="cf-bubbles">
<div class="bubbles"></div>
<div class="bubbles"></div>
<div class="bubbles"></div>
</div>
</div>
<p data-translate="please_wait" id="cf-spinner-please-wait">Please stand by, while we are checking your browser...</p>
<p data-translate="redirecting" id="cf-spinner-redirecting" style="display:none">Redirecting...</p>
</div>
<input type="hidden" name="md" value="u0AdAefiQaOd5cct_8y26o7DHt3en_YcDPYT5F0ABUY-1654161057-0-ATANjzlyezjgr7F1BeHeI_j_uUY38_a79__nKHeOV0Dk2cJOfgMdCTl3WoYsPTD7L25TEyF0Zu27FsSj21OI2aeiNSKmAbPirtvQwqJkPR_knETzvfp75Sv1rnhXV_52btLnozXuVO3Y_z7ElYk1CZDJDEdTw8Eu-MLyEaxyZGJHxx9Tk58hP1NPpWzN98aAcbhY0L1Au8IvJiH8bVmaRlLhK2KDOcXgM7KFONTOuo5-vGZjUjtE4YbUadBFGqk8jIZTRrIXZmwIZNm7TiPlPBwAz8POM7Rw_uoL7THpV4QUctlXigEqRHrY4g-jLcJEW-uZZm2qVMpzbAFOQjJ6UvkY_RC25ZQ5L0MQr1Nnh32-OQZctZIhj8edoK1TZasOXT6u0bT5lOecpx2j82H8mF59qM_zfUbIs4H6wvEx0prqNpEu-4Z7_x1y_agGnVMtW-2OCpKPjcmn9j1-NZnZYdJbrqTzdn2j6qe-wnn3RuRSna8DnN-W7AQTCS4vn7uYc76FWBFERMIwczuHUk-KrOof_TpwA324htdvh4I7URUK8CxdSCZqdG7UfsKbjgdLStciaw_PGDud2rPsE2hQEClxPXFsbcWju8aM6BDmlxQFJm7KJHZcbJTtA8yPMfgha4EvOTTGrEwaBy16B4U18Tmo9JXUlBUJwzbtBXMxfZ0XVQWu709nvxwpWAMZb8kEPND5aXQi2jEiGZZnM3wx_JlXtxPlBiTsxP5mEJ5pf8a71v1aZAzWUcPAaHtRymR8a92yWS4Z57h4a2HSchUf8LlFiuoogFCLBNEi2IoYTuIWFhww1k1UEhjuUZ2h21G4149DN5k-xfRY53H4EyHRs30oYiABowol3n3te3kZcPwB" />
<input type="hidden" name="r" value="919uegZGZgLhriycM0_XCKz1utWQOqsLyAsDF2mLcEY-1654161057-0-AXs4pyKaoppndTN8hJ/khCNIxpye10VI2waeNLb4xYndXBU8rLwkuUXxzAWPTOMPsGwR0KAe5aERtjPvehE5pESDCLcHgGq/H6RUBimtjqQMbxRS8fCyoLrV89WrqAv7Okw3Y+i048El6jKYonunXSU7zzKNR/EL8DIe8/qP47CVRqyOxIDJ2pVHq4GwnfXBtiiWpr4z49jikhah7wbqwOALXPYP4WYlFPrk1kZ1+VgBhEf3RtsybLxsR3E8UagLgTf4K+yNUAt+Uzmi+1qvE2oTq8cVRWZ+gBiXsmRKkWnn3hg6qg9h0DPF8X0U+h8ufqBiTIT3/Lb2M8f1/bB1Sjr6ZBo08ZO5lkGvqdx08L6TRwv5MT4yDWrubtXpZL4Dkpw0yuvLJjonxLMdoF7laSt+xW0VP7ZmAPCNBfY89CXhTqnj/78w0GiLvIFjb9kiNk7cnofy1erkGrI2e/rO6HomogGJT0kGb7V5t6HBOU8mW+4JraBqv1rYLpqv7XmPh4cqjr9DJ8iDDGcqxMciL9VWT4g0nTNlipr0JoVv7L1F36+0Yc+5FuIJwvhvIXN64LlK2vyroKNE/wu3r5O9RWVgAToNI2KlZAbJaHFCBBAhDRdDi7EaVZVoNhmA3Ju+YiNXmGJ5L21MWLwX+N9jQP1KRibF3ixAzObVKTlGmAWUQLdfrc98pHn8oDI1cpCWzrhrsdAQImLLMEO49lJQnmvWpF+lP8iULAiJG4pdsZ5dIelChc7f4W51l0bAUvL/2l/lJg7/qLxFd5PqJp8Jo7nzqbgibEvM8/55/A3wtT9WX0kJp2Da8Kez0UzrgKeAb3VdGVrHwr+k1eJ4o3fI/RBesr/aWkbgjk4EM8itKypPg/c1Ejd9h/Kn89EpeJPtgz7t+vxDyH47kzmR0L9+gWOd5UBvVel/KzwxAxpuO0fw/tNYbEO0vJ2A3NWThWuS2g34K60w+y+Tp/TrNw/yrQH6wVUUsYESQCc2ZLkt8aVRPR30GuKuC9Zjaj8C8g3ywF5EDvFPYm9ZSPjayGyW3magUchBTngl9HJTiAADmSJB8sJfFWWNVJzKP8e7QRYdGbZzy+EiKzEUN61jWlCKlhFKFIwZlCZBIQ+TYL4+ukePHWoUgttIef21cFjy/ydCoznkJDPtceQDPNyCJZHBv2ljXGJ/IpPZ3CcLW9mAVOdjorEitBUY5ObbZTnpgFelrEKo9SVuE4tSawF7ba0TBcUR7yQXKcB6xmrsdlpn0Bp2Ki7rm8XnIGcK34U2+SQ2FrVaBEHTWW3vFWcdyfQmPPoD8BQo/to3Vt3Lz3K2RC8Ugh6bDzzD61z+6d1iWJ2qIyostZIvVQoPwNqdhYrWw9eBF4DF4COCxIoA16S9TLaEqSV+5e+fBfoRVw+jmsi0qRWkYbtBI0imU7f99EEIdP4y6sz+3LeHLUufXvHHWZoT2URjpCZSXJfhnYYg77qSZbIDX5z0RcnBpGBjiISfAwpfUpwp1SPe5fqB0rka6hvGektNSI+YgSPsI8mfH4CNh2dnaxN0OJzj64zaEWKJYrG3Jzhmip7RBJ7v7utJqqLQu6EWIfJ2b8vV314ucEgB9ORIjARY0Zb/Lx7/Jzrt4wvlsuEhySPHb7TylWO1Gyra">
<input type="hidden" name="vc" value="22dd9a5e4ec44559e78aa0e010d110ca">
<noscript id="cf-captcha-bookmark" class="cf-captcha-info">
<h1 data-translate="turn_on_js" style="color:#bd2426;">Please turn JavaScript on and reload the page.</h1>
</noscript>
<div id="no-cookie-warning" class="cookie-warning" data-translate="turn_on_cookies" style="display:none">
<p data-translate="turn_on_cookies" style="color:#bd2426;">Please enable Cookies and reload the page.</p>
</div>
<script>
//<![CDATA[
var a = function() {try{return !!window.addEventListener} catch(e) {return !1} },
b = function(b, c) {a() ? document.addEventListener("DOMContentLoaded", b, c) : document.attachEvent("onreadystatechange", b)};
b(function(){
var cookiesEnabled=(navigator.cookieEnabled)? true : false;
if(!cookiesEnabled){
var q = document.getElementById('no-cookie-warning');q.style.display = 'block';
}
});
//]]>
</script>
<div id="trk_captcha_js" style="background-image:url('/cdn-cgi/images/trace/captcha/nojs/h/transparent.gif?ray=714f0f0e3b881c23')"></div>
</form>
<script>
//<![CDATA[
(function(){
var isIE = /(MSIE|Trident\/|Edge\/)/i.test(window.navigator.userAgent);
var trkjs = isIE ? new Image() : document.createElement('img');
trkjs.setAttribute("src", "/cdn-cgi/images/trace/managed/js/transparent.gif?ray=714f0f0e3b881c23");
trkjs.id = "trk_managed_js";
trkjs.setAttribute("alt", "");
document.body.appendChild(trkjs);
var cpo=document.createElement('script');
cpo.type='text/javascript';
cpo.src="/cdn-cgi/challenge-platform/h/g/orchestrate/managed/v1?ray=714f0f0e3b881c23";
window._cf_chl_opt.cOgUHash = location.hash === '' && location.href.indexOf('#') !== -1 ? '#' : location.hash;
window._cf_chl_opt.cOgUQuery = location.search === '' && location.href.slice(0, -window._cf_chl_opt.cOgUHash.length).indexOf('?') !== -1 ? '?' : location.search;
if (window._cf_chl_opt.cUPMDTk && window.history && window.history.replaceState) {
var ogU = location.pathname + window._cf_chl_opt.cOgUQuery + window._cf_chl_opt.cOgUHash;
history.replaceState(null, null, "\/de\/category\/smartphones-579.html?__cf_chl_rt_tk=PrWxKIbQcP5Dh7keed1nL5yIqzx2FEiIyMvDz_3jTp0-1654161057-0-gaNycGzNBqU" + window._cf_chl_opt.cOgUHash);
cpo.onload = function() {
history.replaceState(null, null, ogU);
};
}
document.getElementsByTagName('head')[0].appendChild(cpo);
}());
//]]>
</script>
</div>
</div>
<div class="cf-column">
<div class="cf-screenshot-container">
<span class="cf-no-screenshot"></span>
</div>
</div>
</div>
</div>
</div>
<div class="cf-section cf-wrapper">
<div class="cf-columns two">
<div class="cf-column">
<h2 data-translate="why_captcha_headline">Why do I have to complete a CAPTCHA?</h2>
<p data-translate="why_captcha_detail">Completing the CAPTCHA proves you are a human and gives you temporary access to the web property.</p>
</div>
<div class="cf-column">
<h2 data-translate="resolve_captcha_headline">What can I do to prevent this in the future?</h2>
<p data-translate="resolve_captcha_antivirus">If you are on a personal connection, like at home, you can run an anti-virus scan on your device to make sure it is not infected with malware.</p>
<p data-translate="resolve_captcha_network">If you are at an office or shared network, you can ask the network administrator to run a scan across the network looking for misconfigured or infected devices.</p>
</div>
</div>
</div>
<div class="cf-error-footer cf-wrapper w-240 lg:w-full py-10 sm:py-4 sm:px-8 mx-auto text-center sm:text-left border-solid border-0 border-t border-gray-300">
<p class="text-13">
<span class="cf-footer-item sm:block sm:mb-1">Cloudflare Ray ID: <strong class="font-semibold">714f0f0e3b881c23</strong></span>
<span class="cf-footer-separator sm:hidden">•</span>
<span class="cf-footer-item sm:block sm:mb-1"><span>Your IP</span>: 178.221.155.142</span>
<span class="cf-footer-separator sm:hidden">•</span>
<span class="cf-footer-item sm:block sm:mb-1"><span>Performance & security by</span> <a rel="noopener noreferrer" href="https://www.cloudflare.com/5xx-error-landing" id="brand_link" target="_blank">Cloudflare</a></span>
</p>
</div><!-- /.error-footer -->
</div>
</div>
<script>
window._cf_translation = {};
</script>
</body>
</html>
It looks like some sort of CAPTCHA or JS issue, but I cannot figure out how to avoid it. Any advice?

Related

Google Apps Script: 403 in simple UrlFetchApp.fetch

I have the following Python code that runs fine from my computer:
>>> from requests import get
>>> response = get("https://fiis.com.br/btal11/")
>>> response
<Response [403]>
>>> response = get("https://fiis.com.br/btal11/", headers={'User-agent': 'Mozilla/5.0'})
>>> response
<Response [200]>
If I simply add a user-agent header, I'm able to get the html page content. However, with the equivalent JS code on google Apps Script that doesn't work:
function GORDON(input) {
var url = "https://fiis.com.br/btal11/";
var options = {
muteHttpExceptions: true,
headers: {"User-agent": "Mozilla/5.0"},
};
var response = UrlFetchApp.fetch(url, options);
console.log(response.getContentText());
//var something = HtmlService.parse(response.getContentText());
}
and the result seems to be a challenge from Cloudflare to be solved:
<!DOCTYPE html>
<html lang="en-US">
<head>
<title>Just a moment...</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=Edge">
<meta name="robots" content="noindex,nofollow">
<meta name="viewport" content="width=device-width,initial-scale=1">
<link href="/cdn-cgi/styles/challenges.css" rel="stylesheet">
</head>
<body class="no-js">
<div class="main-wrapper" role="main">
<div class="main-content">
<h1 class="zone-name-title h1">
<img class="heading-favicon" src="/favicon.ico" alt="Icon for fiis.com.br"
onerror="this.onerror=null;this.parentNode.removeChild(this)">
fiis.com.br
</h1>
<h2 class="h2" id="challenge-running">
Checking if the site connection is secure
</h2>
<noscript>
<div id="challenge-error-title">
<div class="h2">
<span class="icon-wrapper">
<div class="heading-icon warning-icon"></div>
</span>
<span id="challenge-error-text">
Enable JavaScript and cookies to continue
</span>
</div>
</div>
</noscript>
<div id="trk_jschal_js" style="display:none;background-image:url('/cdn-cgi/images/trace/managed/nojs/transparent.gif?ray=79c3f9c65b60e3b6')"></div>
<div id="challenge-body-text" class="core-msg spacer">
fiis.com.br needs to review the security of your connection before proceeding.
</div>
<form id="challenge-form" action="/btal11/?__cf_chl_f_tk=1lWKKYirqW.UmES1h5ANk6aNER4buUV9BvandjshiQU-1676861855-0-gaNycGzNCHs" method="POST" enctype="application/x-www-form-urlencoded">
<input type="hidden" name="md" value="vA5q0MLK_A04uFcQqCyCa20MICLT.o_hZCm87QeOsEc-1676861855-0-Ab6XuJyj-1RtGxhMzcfJQ2E1vrHaAOzs987bM2ZpxqFwZvWYvUEnID4JOSO1iJLQDPqYPPzX-AwcdroRh5CKZ2UP4_o_uqOfOeYMVZJo1S4iqBZ3loTopwRBpVHtAADxvebnNBvP_HyStPDyJH0VkGGHwcBpjJsmv-duU8lhq7z9ex0TS-wNsyNhp4eoM23Uwzi30418XhWvNqoK66sEcrN6vaZW8EJEGFfxW2LDf-R9ZoYUay2xt4Xgcwz17nDgEWeGlR_L-S5RvonpDTBnk5ujbFc_hdwX7Y39NdeIDLTlTCtudzHHEsK0hhbZjHVL7xl4YwkgxKoLaL-URi59VSdHMNcxlHZNt65EWGwS_gXhXG7BFX74CI-EgVo-138F_E9KyWgWz2kL2C4RYG-fcRHEMsYUZznCznaRm4CipklQIGrg1TzLb8GmB25HhjZM-BgKMprLPWJ2jCJ_Yw5KxurVebXuzinZt43H_5klyYd3Of0TwBnTjVMmDbdWsQaQds7PWHi1qq7fXVATS9MzHzZiaY7VmLjdkMWizlMIAmBafYqltGgh8dEZy3sPom6zbj38YGuOxF6gJWrx1tBGm_Kdm15E3gZqgKpmyRuXPDb-a6m0ncJK41sn6XUxUxM-2QuvV1OyAylzTyVderxsqKGH1VJlHcRVUxVyAldAgzMT4SHhH3kcN0CF3cPH9bj1yrw29rXel4ZKowdCYfzRgVJJxdmaz6MTqeEdoj9eXk9h_hfOS1xYImhsCKD1r7SFsmNx2-awD3il9esnD-OR7NwuUg9CruUOBeOnUUgZEg88_l_-B5TYEHARh9Vecg6KVru0XxlaZU2x42gE8vfiKcUKWbNykHFgXFYSwwqwc6zLtF_1UVi76EA0RTX0dITNU-dyXbSRn7HUT8UJojrc5uohnsO5u1smAz9JH7cGJGiZABVaVyKxVIfVQRIPXkbfndrUY_9M5TS0Ms6LLYfozjEGVbC6SegE-FzQEGvJeTHrQz2nA4PM_m3by4L283EJDHk3jnd23_CpM6coZrQxLlyrpAxOzi3lx91cppJONKQd0QMJNaTY6j5URnx2uO8Uto1tbeXZ3lKKheIuYfxBECzuALkPqNqB3pbdm3H6TXPSrpBmqWHPB7yqSowbkQN5qHFePDdg6DBuH40Hm4NgONvkVMmD_D4r8HyJ58-GK4gDF_bmWJjgyLB5pMsxCcGZm50u9bS7f-eHDMyGTYdhlOzU6tnJs3-B54m2ph65RNPgkYqg3TDFDHc1GDM61vhxj2QFAJY_crvxYhd6mAr1C--fk38rs1f_LX42Uqt1rcZCEZXr5eHFivIuAmDlSl-8iz0C8Y2K9M0fUS-fid6dcYuK5BHWb9FTJ5lNWkRfEWIXyV-YhWdWkB85_NbPnPOOgDiNzPlCEzUN-AkzUFjFhEIu1k6goZUQXXujthhQta0NTG0T0B4aD3DB-k5ihYILF_w6vDhAZcAFz-TcR4t_TuvoHkGnlwwC354-1Hcb0IPdcrZIXb_8_PpIKRSHQeCErlzLYJfg0ZUobNbSVC6b6p15uXzITqX5FCoTIGNUWuWqiCYLBvcWcTBbAevpxQDLDrQfM351ZQUrcT5aeET6SeWLZftKhAZeHdiAc8KK_iw6jUpxrB4v2oGZAlU372wBIEZ0eQYQhMwJnm-PMODd3BodqE5HJe0Sc7wnUyjTT3Rxwv06Luv0-8CfswblPIYq7Mwx771ZXXPZmQyrepQ1-bBntEsvFgGI4jyPu8RKHuq8H8kdtLsj_t747dkdRq9zmXGIcCcTh09Vj-sTKHZPIHh396ljgzlVJ7k_nWX8BCHibRj3kUtnDhJarkzlobqb985ZNSybspZKlbG8f3qIWdo1wa1-Bo002tNWyElRcDt_xwXuneDTyP0qQWyX-7kKXlJFIYQ9detREaifPI1hA8fU11U2r2XzEsOLpxao18T9D9DjkvC4cGh6BsE3s8uyW06_Q5QhxvsADyW7HkZ6I72H_l6zObf9N3uKYfEy8CrcdMsS7eLXaLvxbzuNd2WuxbKu3N8AiI9D51lU8CEnSKCQa4SUzRj4f2q62HjhiG9HpT9TYRdyYPMsbb_eXUxvrA">
</form>
</div>
</div>
<script>
(function(){
window._cf_chl_opt={
cvId: '2',
cZone: 'fiis.com.br',
cType: 'managed',
cNounce: '97809',
cRay: '79c3f9c65b60e3b6',
cHash: 'fc3e1644bceb435',
cUPMDTk: "\/btal11\/?__cf_chl_tk=1lWKKYirqW.UmES1h5ANk6aNER4buUV9BvandjshiQU-1676861855-0-gaNycGzNCHs",
cFPWv: 'g',
cTTimeMs: '1000',
cMTimeMs: '0',
cTplV: 4,
cTplB: 'cf',
cRq: {
ru: 'aHR0cHM6Ly9maWlzLmNvbS5ici9idGFsMTEv',
ra: 'TW96aWxsYS81LjAgKGNvbXBhdGlibGU7IEdvb2dsZS1BcHBzLVNjcmlwdDsgYmVhbnNlcnZlcjsgK2h0dHBzOi8vc2NyaXB0Lmdvb2dsZS5jb207IGlkOiBVQUVtZERkOHNNRzFSb0FJWGZTYnlsa2plUGwxdjhTdngwVUkp',
rm: 'R0VU',
d: 'K2hEeoWYs+sA9kntZPKxHqEaDzXqO9jP1DXfNo8U00z/HdqgsrqXN1eO/1L4D71PU/RaZfZMK/nfRS9wUs9n9wMZ7wa2+UCd+Wic1OqU3YV80fLAAQsnSPU7ZuJ5idh4DYvRqokv5w973lQ8O4+o5G9Tbp0TBj/G5oIVqE/HYaiQanIiyLhY6VoYkembTfL7ZFiePykhL/QWb9TRxI33+Iu8NCbRIfz5XQkDBoB0Lc2qftAyKY4kx40y7jiPLq1rOKk3be6zPJqXtYgbm0NE+2KuTRVy2gz9TN8LuBwy7sMi/uXEWXEh/8KDOUydo6rFxZ2ykmOVAhR6DiOj1CUBJvL71x01tHQLf0RBCbvrJ37who7mAkd8vNIQ3bBySUOeNTxVCxSDe1Erkx7EJjPzlmTDC9Ec9dyXddjMFV29k8B/8tTEOGtrNgsUenIOLd862lYHsqQTRdpGgQrdvgPxy/OOIBf93fM5A8CLogbDNLqYnVn8p0K8wvkk9Xjh9zc5mB3yR3KS0G/wz2S4BsLQEUb73vTj4fUDPK/QhxI3t4mWAk6kla2A7taIRA1myCoMbsQamtmqHB1396m+aubITHLeswV50zQ5si/qTqGlGSo+N5FYfBnUt96W/Cidhsxj76xDvYRC2GYaKJanN1h1IZnFb2B2Y4lfP0vkdy/qF6bp7upA1rMZ7ilLOu8LuOjb',
t: 'MTY3Njg2MTg1NS43MzUwMDA=',
m: 'SOz4uar/pXrmGBuSQIbY9tjFx2G6zirpJv2NyzOPmIM=',
i1: 'cIUbIpvI2YsvZRb//Yfdfw==',
i2: 'oC3KkuH26ng8Gt/f/kKHDw==',
zh: 'wcWWf/+obaYUptPh30e4072sXWiLjlPsWQnQS/2QxMI=',
uh: 'bllaG+Wp51WdmfI9k7pslxqw3F1/Neha3nrwdAjxueE=',
hh: '+MXXTc/rARCfTxK8igcq3MtDXAltL4ou2PYE97G16x4=',
}
};
var trkjs = document.createElement('img');
trkjs.setAttribute('src', '/cdn-cgi/images/trace/managed/js/transparent.gif?ray=79c3f9c65b60e3b6');
trkjs.setAttribute('alt', '');
trkjs.setAttribute('style', 'display: none');
document.body.appendChild(trkjs);
var cpo = document.createElement('script');
cpo.src = '/cdn-cgi/challenge-platform/h/g/orchestrate/managed/v1?ray=79c3f9c65b60e3b6';
window._cf_chl_opt.cOgUHash = location.hash === '' && location.href.indexOf('#') !== -1 ? '#' : location.hash;
window._cf_chl_opt.cOgUQuery = location.search === '' && location.href.slice(0, location.href.length - window._cf_chl_opt.cOgUHash.length).indexOf('?') !== -1 ? '?' : location.search;
if (window.history && window.history.replaceState) {
var ogU = location.pathname + window._cf_chl_opt.cOgUQuery + window._cf_chl_opt.cOgUHash;
history.replaceState(null, null, "\/btal11\/?__cf_chl_rt_tk=1lWKKYirqW.UmES1h5ANk6aNER4buUV9BvandjshiQU-1676861855-0-gaNycGzNCHs" + window._cf_chl_opt.cOgUHash);
cpo.onload = function() {
history.replaceState(null, null, ogU);
};
}
document.getElementsByTagName('head')[0].appendChild(cpo);
}());
</script>
<div class="footer" role="contentinfo">
<div class="footer-inner">
<div class="clearfix diagnostic-wrapper">
<div class="ray-id">Ray ID: <code>79c3f9c65b60e3b6</code></div>
</div>
<div class="text-center" id="footer-text">Performance & security by <a rel="noopener noreferrer" href="https://www.cloudflare.com?utm_source=challenge&utm_campaign=m" target="_blank">Cloudflare</a></div>
</div>
</div>
</body>
</html>
What am I missing over here? Is there any way to bypass this challenge?

Got a warning to replace window.web3 by window.ethereum

I am completely new to web3 . I have been trying to build basic project of blockchain .Where I have a app.js file . I was supposed to see "app loading " or a account address at the console . I am assuming I have to change window.web3 to window.ethereum .How to fix this
I have got a waring saying
inpage.js:1 You are accessing the MetaMask window.web3.currentProvider shim. This property is deprecated; use window.ethereum instead. For details, see:
Here is my code below:
App = {
loading: false,
contracts: {},
load: async () => {
await App.loadWeb3()
await App.loadAccount()
await App.loadContract()
await App.render()
},
// https://medium.com/metamask/https-medium-com-metamask-breaking-change-injecting-web3-7722797916a8
loadWeb3: async () => {
if (typeof web3 !== 'undefined') {
App.web3Provider = web3.currentProvider
web3 = new Web3(web3.currentProvider)
} else {
window.alert("Please connect to Metamask.")
}
// Modern dapp browsers...
if (window.ethereum) {
window.web3 = new Web3(ethereum)
try {
// Request account access if needed
await ethereum.enable()
// Acccounts now exposed
web3.eth.sendTransaction({/* ... */})
} catch (error) {
// User denied account access...
}
}
// Legacy dapp browsers...
else if (window.web3) {
App.web3Provider = web3.currentProvider
window.web3 = new Web3(web3.currentProvider)
// Acccounts always exposed
web3.eth.sendTransaction({/* ... */})
}
// Non-dapp browsers...
else {
console.log('Non-Ethereum browser detected. You should consider trying MetaMask!')
}
},
loadAccount: async () => {
// Set the current blockchain account
App.account = web3.eth.accounts[0]
console.log(App.account)
}
}
$(() => {
$(window).load(() => {
App.load()
})
})
here is the html code
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
<title>Dapp University | Todo List</title>
<!-- Bootstrap -->
<link href="vendor/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet">
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
<style>
main {
margin-top: 60px;
}
#content {
display: none;
}
form {
width: 350px;
margin-bottom: 10px;
}
ul {
margin-bottom: 0px;
}
#completedTaskList .content {
color: grey;
text-decoration: line-through;
}
</style>
</head>
<body>
<nav class="navbar navbar-dark fixed-top bg-dark flex-md-nowrap p-0 shadow">
<a class="navbar-brand col-sm-3 col-md-2 mr-0" href="http://www.dappuniversity.com/free-download" target="_blank">Dapp University | Todo List</a>
<ul class="navbar-nav px-3">
<li class="nav-item text-nowrap d-none d-sm-none d-sm-block">
<small><a class="nav-link" href="#"><span id="account"></span></a></small>
</li>
</ul>
</nav>
<div class="container-fluid">
<div class="row">
<main role="main" class="col-lg-12 d-flex justify-content-center">
<div id="loader" class="text-center">
<p class="text-center">Loading...</p>
</div>
<div id="content">
<!-- <form onSubmit="App.createTask(); return false;">
<input id="newTask" type="text" class="form-control" placeholder="Add task..." required>
<input type="submit" hidden="">
</form> -->
<ul id="taskList" class="list-unstyled">
<div class="taskTemplate" class="checkbox" style="display: none">
<label>
<input type="checkbox" />
<span class="content">Task content goes here...</span>
</label>
</div>
</ul>
<ul id="completedTaskList" class="list-unstyled">
</ul>
</div>
</main>
</div>
</div>
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<!-- Include all compiled plugins (below), or include individual files as needed -->
<script src="vendor/bootstrap/dist/js/bootstrap.min.js"></script>
<script src="vendor/truffle-contract/dist/truffle-contract.js"></script>
<script src="app.js"></script>
</body>
</html>
Replace all instances of window.web3.currentProvider with window.ethereum, as the error message says.
Or, in your case, remove these lines:
- if (typeof web3 !== 'undefined') {
- App.web3Provider = web3.currentProvider
- web3 = new Web3(web3.currentProvider)
- } else {
- window.alert("Please connect to Metamask.")
- }

JQM works on desktop browser not mobile

The following code works as expected on the various desktop browsers, however its target goal is oveasly a smartphone. when accessed from iPhone - content is blank under <ul>?
json is pulled from php page and works as expected.
EDITED: changed getJSON to static json var info for testing - still not rendered on mobile phone? - also tried various version of JQuery and JQuery-Mobile still no change.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, user-scalable=no">
<link href="http://jqmdesigner.appspot.com/gk/lib/jquery.mobile/1.4.2/flatui/jquery.mobile.flatui.css" rel="stylesheet" type="text/css" />
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script src="http://code.jquery.com/mobile/1.4.2/jquery.mobile-1.4.2.min.js"></script>
<title>parse JSON</title>
<script>
var info = [
{
"UID":5665,
"StudentID":"BA1400",
"LastName":"BARNES",
"FirstName":"JOHN",
"Affiliation":"DFRS"},
{"UID":10430,
"StudentID":"BA3700",
"LastName":"Barnyard",
"FirstName":"Ashley",
"Affiliation":"OTHER"},
{"UID":5781,
"StudentID":"BJ9188",
"LastName":"BARCLAY",
"FirstName":"GEOFFREY",
"Affiliation":"DFRS"},
{"UID":14815,
"StudentID":"BT0021",
"LastName":"Barhydt",
"FirstName":"Jimmy",
"Affiliation":"TAKOMA PARK"
}
];
$(document).on("pageinit", "#info-page", function () {
var server_url = "http://myDomain/tt_json.php";
$.getJSON(server_url, function(notUsing){
var li = "";
$.each(info, function (i, name) {
li += '<li>' + name.LastName + ', ' + name.FirstName + '</li>';
});
$("#prof-list").append(li).promise().done(function () {
$(this).on("click", ".info-go", function (e) {
e.preventDefault();
$("#details-page").data("info", info[this.id]);
$.mobile.changePage("#details-page");
});
$(this).listview("refresh");
});
});
});
$(document).on("pagebeforeshow", "#details-page", function () {
var info = $(this).data("info");
var info_view = "";t
for (var key in info) {
info_view += '<div class="ui-grid-a"><div class="ui-block-a"><div class="ui-bar field" style="font-weight : bold; text-align: left;">' + key + '</div></div><div class="ui-block-b"><div class="ui-bar value" style="width : 75%">' + info[key] + '</div></div></div>';
}
$(this).find("[data-role=content]").html(info_view);
});
</script>
</head>
<body>
<!--first page -->
<div data-role="page" id="info-page">
<div data-role="header" data-theme="b">
<h1>GET JSON data</h1>
</div>
<div data-role="content">
<ul data-role="listview" id="prof-list" data-divider-theme="a" data-inset="true">
<li data-role="list-divider" data-theme="b" role="heading">Names</li>
</ul>
</div>
</div>
<!--second page -->
<div data-role="page" id="details-page">
<div data-role="header" data-theme="b">Go back
<h1>User Details</h1>
</div>
<div data-role="content"></div>
</div>
</body>
</html>
Not sure why this resolves the issue since i'm doing a standard json request from same domain but it did fix the issue:
added header:
header("Access-Control-Allow-Origin: *");

Website Displays fine on Chrome/Firefox/IE 9+ but White Page on IE 8

I'm working on a page and I can't seem to figure out why it's not displaying on IE 8. If I right click and view source the page code is being loaded but the whole page just displays blank and white.
I can't seem to figure it out because it displays fine in Firefox, Chrome, and IE 9 and above. Anyone had this happen / can see what's wrong in my code?
Page: http://kozyheat.com
Code:
<!DOCTYPE html>
<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
<!--[if IE 7]> <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 8]> <html class="no-js lt-ie9"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js"> <!--<![endif]-->
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>Kozy Heat Fireplaces</title>
<meta name="description" content="For over 35 years, our commitment to quality and customer satisfaction remain the same. We offer a complete line of gas & wood fireplaces, unique cabinets and stylish accessories to complement any decor.">
<meta property="og:site_name" content="Kozy Heat Fireplaces"/>
<meta property="og:title" content="Kozy Heat Fireplaces"/>
<meta property="og:description" content="For over 35 years, our commitment to quality and customer satisfaction remain the same. We offer a complete line of gas & wood fireplaces, unique cabinets and stylish accessories to complement any decor."/>
<meta property="og:image" content="http://kozyheat.com/img/desktop/facebooklogo.png">
<meta name="viewport" content="width=device-width">
<script src="/scripts/js/desktop/jquery-1.10.2.min.js"></script>
<script src="/scripts/js/desktop/bootstrap.min.js"></script>
<script src="/scripts/js/desktop/modernizr-2.6.2.min.js"></script>
<script src="/scripts/js/desktop/selectivizr-min.js"></script>
<link rel="stylesheet" href="/css/desktop/bootstrap.min.css">
<link rel="stylesheet" href="/css/desktop/bootstrap-responsive.min.css">
<link rel="stylesheet" href="/css/desktop/font-awesome.min.css">
<link rel="stylesheet" href="/css/desktop/main.css">
<link rel="shortcut icon" href="/img/favicon/favicon.png">
<!--[if lte IE 9]>
<link rel="stylesheet" href="/css/desktop/main_ie8.css"/>
<![endif]-->
<script>
var backgroundInfo = [
{"imgURL": "/media/13631/dassel1.jpg", "URL": "product/dassel", "Name": "Dassel", "Description": "Keep the home fires burning with the Dassel gas fireplace. Numerous customizing options to fit any décor."},
{"imgURL": "/media/13660/northernfirelights2.jpg", "URL": "product/northern_firelights_patio_fireplace_table", "Name": "Northern Firelights Patio Fireplace Table", "Description": "What could be better than relaxing by, dining around or simply just enjoying the beauty of a patio fireplace table."},
{"imgURL": "/media/13624/bayport3.jpg", "URL": "product/bayport-l", "Name": "Bayport-L", "Description": "Our most popular 42” fireplace is now available in a Clean Face version. The Bayport-L offers a large and impressive viewing area with our most realistic logs and burner system yet. This fireplace is ordered in either the Log Set model or the Glass Media model."},
{"imgURL": "/media/13654/minnetonka3.jpg", "URL": "product/minnetonka", "Name": "Minnetonka", "Description": "The Minnetonka fireplace offers you a deeper firebox and an exterior-controlled "heat-dump" feature."}
];
$(window).load(function() {
updateBackground(1);
});
</script>
<script src="/scripts/js/desktop/main.js"></script>
<script>function detectMobile() {
var e = navigator.userAgent.toLowerCase();
var t = mobiles;
var n = false;
for (var r = 0; r < t.length; r += 1) {
if (e.indexOf(t[r]) != -1) {
n = t[r]
}
}
return n
}
$(function() {
if (detectMobile()) {
window.location.href = "http://kozyheat.com/mobile/"
}
});
var mobiles = ["midp", "240x320", "blackberry", "netfront", "nokia", "panasonic", "portalmmm", "sharp", "sie-", "sonyericsson", "symbian", "windows ce", "benq", "mda", "mot-", "opera mini", "philips", "pocket pc", "sagem", "samsung", "sda", "sgh-", "vodafone", "xda", "palm", "iphone", "ipod", "ipad", "android"]</script>
</head>
<body class="container-fluid">
<script type="text/javascript">
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-8302527-1']);
_gaq.push(['_trackPageview']);
(function() {
var ga = document.createElement('script');
ga.type = 'text/javascript';
ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(ga, s);
})();
</script>
<div class="row-fluid">
<aside class="span3">
<img id="logo" src="/img/desktop/logo.png" alt="Kozy Heat Fireplaces">
<div class="fluid-row">
<div class="span10 offset1">
<h3>Our Story</h3>
<p>For over 35 years, our commitment to quality and customer satisfaction remain the same. We offer a complete line of gas & wood fireplaces, unique cabinets and stylish accessories to complement any decor.</p>
Read More
</div>
</div>
<div class="fluid-row">
<div class="span10 offset1">
<h3>Upgrade Today</h3>
<p>Ask us about our ways to upgrade your fireplace today with a SIT Proflame Remote control.</p>
Get Started
</div>
</div>
</aside>
<div class="span9 clearMargin">
<nav class="row-fluid">
About Us
Products
Find A Dealer
Support
Architects & Builders
Contact Us
</nav>
<section class="main clearfix">
<div class="box">
<div class="row-fluid" style="height:100%">
<section class="column">
<div id="imageRotator" class="row-fluid">
<span class="imgRotArrowLeft" onClick="updateBackgroundPrev();">‹</span>
<h2 id="imgRotName" class="clearMargin"></h2>
<p id="imgRotDesc"></p>
Learn More
<span class="imgRotArrowRight" onClick="updateBackgroundNext();">›</span>
</div>
</section>
</div>
</div>
</section>
<footer class="row-fluid">
<div class="span3">
<a class="nostyleW margR20" href="https://twitter.com/kozyheatfire" target="_blank"><i class="icon-twitter icon-3x"></i></a>
<a class="nostyleW margR20" href="https://www.facebook.com/KozyHeatFireplaces" target="_blank"><i class="icon-facebook icon-3x"></i></a>
<a class="nostyleW margR20" href="http://www.linkedin.com/company/2624342" target="_blank"><i class="icon-linkedin icon-3x"></i></a>
<a class="nostyleW margR20" href="http://www.youtube.com/user/KozyHeatFireplaces" target="_blank"><i class="icon-youtube icon-3x"></i></a>
</div>
<div class="span8">
<div class="row-fluid clearPadding" style="padding-bottom:5px;">
<a class="W" href="about_us">About Us</a> |
<a class="W" href="products">Products</a> |
<a class="W" href="find_a_dealer">Find a Dealer</a> |
<a class="W" href="support">Support</a> |
<a class="W" href="architects_builders">Architects & Builders</a> |
<a class="W" href="contact_us">Contact Us</a> |
<a class="W" href="dealers_login">Dealers Secured Area</a>
</div>
<div class="row-fluid clearPadding">
<strong>© 2013 Hussong MFG — 204 Industrial Park Drive / Lakefield, MN 56150 / <a class="W" href="tel:1-800-253-4904">800-253-4904</a></strong>
</div>
</div>
</footer>
</div>
</div>
</body>
</html>
Update:
I've made sure there's no caching (reset manually, set to reset on exit, and ran CCleaner). I've also reset all IE 8 settings via this Fixit: http://windows.microsoft.com/en-us/windows-vista/reset-internet-explorer-8-settings
Here's a screenshot of my issue:
Okay I finally figured out the solution. Selectivizr was causing conflicts with font-face in IE 8 as detailed here:
Why is selectivizr.js causing "white screen of death" in IE8?
So solution is to only give selectivzr to browsers that aren't IE 8...which is kind of counter-intuitive but it works for now.
Code:
<!--[if !IE 8]><!-->
<script src="/scripts/js/desktop/selectivizr-min.js"></script>
<!--<![endif]-->
Change doctype to html 4
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
Cache is a big factor when updating a website and refreshing a lot to see if your updates worked. A lot of time you might be viewing old cache, which seems to be what the issue is here.
Clear your cache and delete all data. Close IE. Open again. Now it should work. Check here for instructions: http://kb.wisc.edu/page.php?id=12314
Make sure to regularly clear your cache when changing website code, otherwise you always run the risk where you thought you fixed something (or thought you didn't) but really you were only viewing old cache. This can cause problems so make sure to clear your cache frequently when updating your website.
p.s. your website looks really good. Kudos to you! :)

Need Help Switching Header Image using JAVASCRIPT

I'm working on a dynamic layout for a tumblr page. So far I have successfully been able to do a time-sensitive switch for the css stylesheets but now I want to switch out the banner also.
I whipped up some code (javascript) to do this, but keep getting an error and don't know why. I'm also unsure about where to place the code exactly. Since this is a tumblr layout, the header is placed just below the opening tag. So i'm not sure if I should place the javascript there or should I place it just below the tag
Here is the code I come up with. It's giving me a syntax error in DW, but since i'm a newbie I have no clue what the problem is.
<script type="text/JavaScript">
<!--
function getHeader() {
if (7 <= currentTime&&currentTime < 18) {
document.write("<h1><img src="http://itsnotch.com/tumblr/images/NotchTheGuru_VCbanner.jpg" border "0" /></h1>");
}
else {
document.write(" <h1><img src="http://itsnotch.com/tumblr/images/NotchTheGuru_Banner.jpg" border "0" /></h1>");
}
}
getHeader();
-->
</script>
it gives me a error on the 'document.write' lines.
Here is the entire source code for the page to give you guys a better look at what i'm doing
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta name="description" content="Big Notch, Notch the Guru, Notch Blog, Notch's Blog, Word of Notch" />
<!-- DEFAULT SETTINGS -->
<meta name="font:Title" content="Arial" />
<meta name="font:Body" content="Lucida Sans" />
<meta name="text:Disqus Shortname" content="" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>{block:SearchPage}Search results for "{SearchQuery}" - {/block:SearchPage}{block:PostSummary}{PostSummary} - {/block:PostSummary}{Title}</title>
<link rel="icon" href="{Favicon}"/>
<link rel="alternate" type="application/rss+xml" title="RSS" href="{RSS}"/>
<meta name="viewport" content="width=850"/> <!-- iPhone -->
<!--[if lt IE 7]>
<style type="text/css">
.post div.labels {
right: 450px;
}
</style>
<![endif]-->
<!--Google Tracker Code--->
<script type="text/javascript">
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-19744657-4']);
_gaq.push(['_trackPageview']);
(function() {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();
</script>
</head>
<body>
<!--SCM Music Player by Adrian Shum - http://scmplayer.asweb.info-->
<script type='text/javascript'><!--
document.write(unescape('%3C%73%63%72%69%70%74%20%74%79%70%65%3D%22%74%65%78%74%2F%6A%61%76%61%73%63%72%69%70%74%22%20%73%72%63%3D%22%68%74%74%70%3A%2F%2F%73%63%6D%70%6C%61%79%65%72%2E%61%73%77%65%62%2E%69%6E%66%6F%2F%73%63%72%69%70%74%2E%6A%73%22%20%3E%3C%2F%73%63%72%69%70%74%3E'));
//--></script>
<script type="text/javascript"><!--
SCMMusicPlayer.init("{'skin':'skins/cyber/skin.css','playback':{'autostart':'true','shuffle':'true','volume':'70'},'playlist':[{'title':'BattleCat Instrumental Loop','url':'http://itsnotch.com/music/BattleCat%20Instrumental(loop).mp3'},{'title':'Curren$y - Skybourne','url':'http://itsnotch.com/music/skybourne.mp3'},{'title':'Dam-Funk','url':'http://itsnotch.com/music/10_west.mp3'},{'title':'Curren$y - Flight Briefing','url':'http://itsnotch.com/music/FlightBriefing.mp3'},{'title':'B-Ducey - Let Me Be (prod.by Big Notch)','url':'http://itsnotch.com/music/Let%20me%20be.mp3'},{'title':'Vado - Council Music (looped by Big Notch)','url':'http://itsnotch.com/music/Council%20Music%20(Instrumental).mp3'},{'title':'Snoop Dogg - No Bitch','url':'http://itsnotch.com/music/No_Bitch.mp3'},{'title':'Little Brother - That Aint No Love','url':'http://itsnotch.com/music/LittleBrother.mp3'}],'placement':'bottom','showplaylist':'false'}");
//--></script>
<!--End of SCM Music Player script-->
<div id="content">
<div id="description">
<div>
<div id="search">
<form action="/search" method="get">
<input type="text" name="q" value="{SearchQuery}"/>
<input type="submit" value="Search"/>
</form>
</div>
{Description}
<p id="nav_container">
Archive
<span class="dim">/</span>
RSS
</p>
</div>
</div>
{block:SearchPage}
<div id="searchresultcount">
<p>Your search for <span class="query">{SearchQuery}</span> returned {SearchResultCount} result(s).</p>
</div>
{/block:SearchPage}
{block:Posts}
<div class="post">
<div class="labels">
{block:NewDayDate}
<div class="date">{Month} {DayOfMonth}</div>
{/block:NewDayDate}
{block:SameDayDate}
<div class="date"></div>
{/block:SameDayDate}
</div>
{block:Regular}
<div class="regular">
{block:Title}<h2>{Title}</h2>{/block:Title}
{Body}
</div>
<div id="separator"></div>
{/block:Regular}
{block:Photo}
<div class="photo">
{LinkOpenTag}<img src="{PhotoURL-400}" alt="{PhotoAlt}"/>{LinkCloseTag}
{block:Caption}
<div class="caption">{Caption}</div>
{/block:Caption}
</div>
<div id="separator"></div>
{/block:Photo}
{block:Quote}
<div class="quote">
<span class="quote">
<big class="quote">“</big> {Quote}
</span>
{block:Source}<span class="source">{Source}</span>{/block:Source}
</div>
<div id="separator"></div>
{/block:Quote}
{block:Link}
<div class="link">
<a href="{URL}" class="link" {Target}>{Name}</a>
{block:Description}
<span class="description">{Description}</span>
{/block:Description}
</div>
<div id="separator"></div>
{/block:Link}
{block:Conversation}
<div class="conversation">
{block:Title}<h2>{Title}</h2>{/block:Title}
<ul>
{block:Lines}
<li>
{block:Label}<span class="label">{Label}</span>{/block:Label}
{Line}
</li>
{/block:Lines}
</ul>
</div>
<div id="separator"></div>
{/block:Conversation}
{block:Audio}
<div class="audio">
{AudioPlayerGrey}
{block:Caption}
<div class="caption">{Caption}</div>
{/block:Caption}
</div>
<div id="separator"></div>
{/block:Audio}
{block:Video}
<div class="video">
{Video-400}
{block:Caption}
<div class="caption">{Caption}</div>
{/block:Caption}
</div>
<div id="separator"></div>
{/block:Video}
</div>
{block:IfDisqusShortname}
{block:Permalink}
<div id="disqus_thread"></div>
<script type="text/javascript" src="http://disqus.com/forums/{text:Disqus Shortname}/embed.js"></script>
<noscript>View the discussion thread.</noscript>
<div style="text-align: right; margin-top: 5px">
blog comments powered by <span class="logo-disqus">Disqus</span>
</div>
{/block:Permalink}
{/block:IfDisqusShortname}
{/block:Posts}
<div id="footer">
{block:PreviousPage}
« Previous
{/block:PreviousPage}
{block:NextPage}
Next »
{/block:NextPage}
</div>
</div>
{block:IfDisqusShortname}
<script type="text/javascript">
//<![CDATA[
(function() {
var links = document.getElementsByTagName('a');
var query = '?';
for(var i = 0; i < links.length; i++) {
if(links[i].href.indexOf('#disqus_thread') >= 0) {
query += 'url' + i + '=' + encodeURIComponent(links[i].href) + '&';
}
}
document.write('<script charset="utf-8" type="text/javascript" src="http://disqus.com/forums/{text:Disqus Shortname}/get_num_replies.js' + query + '"></' + 'script>');
})();
//]]>
</script>
{/block:IfDisqusShortname}
<script type="text/JavaScript">
<!--
function getStylesheet() {
var currentTime = new Date().getHours();
if (22 <= currentTime&&currentTime < 7) {
document.write("<link rel='stylesheet' href='http://itsnotch.com/tumblr/files/nighttime.css' type='text/css'>");
}
if (7 <= currentTime&&currentTime < 18) {
document.write("<link rel='stylesheet' href='http://itsnotch.com/tumblr/files/vice.css' type='text/css'>");
}
if (18 <= currentTime&&currentTime < 20) {
document.write("<link rel='stylesheet' href='http://itsnotch.com/tumblr/files/evening.css' type='text/css'>");
}
if (20 <= currentTime&&currentTime < 22) {
document.write("<link rel='stylesheet' href='http://itsnotch.com/tumblr/files/dusk.css' type='text/css'>");
}
}
getStylesheet();
-->
</script>
<noscript><<link rel="stylesheet" type="text/css" href="http://itsnotch.com/tumblr/files/dusk.css" /></noscript>
<script type="text/JavaScript">
<!--
function getHeader() {
if (7 <= currentTime&&currentTime < 18) {
document.write("<h1><img src="http://itsnotch.com/tumblr/images/NotchTheGuru_VCbanner.jpg" border "0" /></h1>");
}
else {
document.write(" <h1><img src="http://itsnotch.com/tumblr/images/NotchTheGuru_Banner.jpg" border "0" /></h1>");
}
}
getHeader();
-->
</script>
</body>
</html>
the header was originally posted below the '' tag
do not nest double quotes
comment out the end comment // -->
currenttime needs to be a global var
Here is some code
<script type="text/javascript">
var currentTime = new Date().getHours();
function getStylesheet() {
var css = "dusk.css"; // default
if (22 <= currentTime&&currentTime < 7) css = "nighttime.css";
else if (7 <= currentTime&&currentTime < 18) css = "vice.css";
else if (18 <= currentTime&&currentTime < 20) css = "evening.css";
document.write('<link rel="stylesheet" href="http://itsnotch.com/tumblr/files/'+css+'" type="text/css">');
}
getStylesheet();
function getHeader() {
var img = "http://itsnotch.com/tumblr/images/";
img += (7 <= currentTime && currentTime < 18) ? "NotchTheGuru_VCbanner.jpg" : "NotchTheGuru_Banner.jpg";
document.write('<h1><img src="'+img+'" border "0" /></h1>');
}
getHeader();
</script>
<noscript>
<link rel="stylesheet" type="text/css" href="http://itsnotch.com/tumblr/files/dusk.css" />
<h1><img src="http://itsnotch.com/tumblr/images/NotchTheGuru_Banner.jpg" border "0" />
</noscript>

Categories