I am currently having an Issue with a Clients Intranet.
We used to have a start-site where some js checks, wether the user is online or not, and if so that he is redirected to the home-page of our Intranet.
Now I am testing the compatibility with the new Microsoft EDGE and found out that the automatic redirect isn´t working anymore.
Do you have any ideas of how to check if the user has a valid internet connection and then redirect?
Current solution is:
var myImg = new Image();
myImg.src = "https://URL_of_our_intranet/images/blank.gif";
myImg.onload = myImgOnLoadHandler;
function myImgOnLoadHandler(e) {
window.location = "redirect-URL";
}
The whole Code is on each Users Local System and there is no JQuery-Solution possible as there is no JQ-Library available.
I would love to hear an easy and on EDGE working solution.
If there is an easy way to do so, please let me know - I am not a pro in Javascript..
Thanks!
Sam
The above comments are worth considering. This is a kludge, and is always going to be fragile. As mentioned in the comments, a major pitfall here is caching. That can be circumvented by appending a cache-busting string to the URL. I don't think this is the case, but it's also possible that some browsers won't load an image that isn't a member of a DOM, so it might be necessary to insert it into the DOM. The below snippet demonstrates both:
function myImgOnLoadHandler(e) {
console.log('Connected! redirecting...');
}
function maybeRedirect() {
var myImg = new Image();
myImg.onload = myImgOnLoadHandler;
myImg.src = '//i.imgur.com/Jz49oEp.gif?' + new Date().getTime();
myImg.style.display = 'none';
document.body.appendChild(myImg);
}
document.querySelector('button').addEventListener('click', maybeRedirect);
<button type="button">Click me</button>
The solution that perfectly worked for me, as we only use Internet Explorer (at least some use firefox, but Opera is not available on any client):
if (navigator.onLine) {
window.location.replace("https://www.google.de");
}
Thanks for your quick help!
Related
We are working on a Digital Audio Workstation kind of thing in the browser. We need to work with multiple audio files in a tab. We use new Audio(audioUrl) to be able to play the audio in our own audio mixer. It has been working for us up to now.
With the latest version of Chrome (92), we have the problem where the above code snippet causes the following error:
[Intervention] Blocked attempt to create a WebMediaPlayer as there are too many WebMediaPlayers already in existence. See crbug.com/1144736#c27
I cannot access the bug link provided, it says permission denied. And is there a suggested workaround to handle this?
UPDATE:
I moved away from using HTMLAudioElement to AudioBufferSourceNode. Seems like the only straightforward solution as Chrome team is discussing to limit them anyway. Note: We may need more than 1000 audio clips to be played back. This is in reference to the chromium discussion thread where they are going to increase the number of webmediaplayers to 1000 on the next release for August 5 2021.
Chrome 92 has introduced a limit on number of audio and video tags that can be allocated in a particular tab.
75 for desktop browsers and 40 for mobile browsers.
For now the only solution is to limit the number of audio and video tags created in the page. Try reusing the already allocated audio / video elements.
The number can only be increased by passing the following flag when starting up chrome, for example --max-web-media-player-count=5000
(Of course we cannot expect the end user to do this)
Related Source code here:
https://chromium-review.googlesource.com/c/chromium/src/+/2816118
Edit:
Before deallocating the audio/video elements setting the following seems to force clean up of the element.
mediaElement.remove();
mediaElement.srcObject = null;
const MaxWebMediaPlayerCount = 75;
class VideoProducer {
static #documentForVideo
static createVideo() {
if (!this.#documentForVideo || this.#documentForVideo.videoCount === MaxWebMediaPlayerCount) {
const iframeForVideo = document.body.appendChild(document.createElement('iframe'));
iframeForVideo.style.display = 'none';
iframeForVideo.contentDocument.videoCount = 0;
this.#documentForVideo = iframeForVideo.contentDocument;
}
this.#documentForVideo.videoCount++;
const video = this.#documentForVideo.createElement('video');
return video;
}
foo() {
const video = VideoProducer.createVideo();
// ...
}
Yeah me too it broke my game,
This is what I found as a workaround, hope this helps in the mean time:
function playSound( ) {
var jump_sound = new Audio("./jump.mp3");
jump_sound.play();
jump_sound.onended = function(){
this.currentSrc = null;
this.src = "";
this.srcObject = null;
this.remove();
};
}
Note: it still blocks if there's too many concurrent sound but with this code in place the blocking is temporary.
Chrome version 92.0.4515.131 seems to resolve the issue
I work for a hire company, and I decided paperwork was a pain and have started putting it online instead. I'm building a service/repair database to store records and information on machines on our fleet. We have a desktop pc in the workshop, connected to the internet, but we have had an ongoing issue with our phone lines dropping in and out for the last few years and despite us calling out engineers, they can't explain it. Anyway, long story short, I've made a 'backup' copy of the website and database on localhost using xampp. I made a simple script to detect if we were online or not and added it to an onclick event.
function conchecklink(link) {
var online = navigator.onLine;
var livelink = "http://www.example.com/workshop/" + link;
var locallink = "http://localhost/workshop/" + link;
if (online == true) {
window.location(livelink);
}
if (online == false) {
window.location(locallink);
}
}
For each href on the website I am using this:
<a onclick=\"conchecklink('service.php')\" href=\"#\"> Service</a>
<a onclick=\"conchecklink('repair.php')\" href=\"#\"> Repairs</a>
Now this works absolutely fine on desktop, when internet drops out, it redirects to localhost, and visa versa. But when viewing on my mobile, the onclick event doesn't fire. From googling this, I understand I should be using ontouch for mobile, I tried a few things I found in my search, but alas I am only a mechanic, not a professional coder and I can't get the links working on mobile. Any help would be much appreciated.
You have an error: window.location is not a function. On your mobile, the browser should throw an error and stops the script. Your desktop browser seems to be more conciliant.
You also could use else instead of using two if statements.
function conchecklink(link) {
var online = navigator.onLine;
var livelink = "http://www.example.com/workshop/" + link;
var locallink = "http://localhost/workshop/" + link;
if (online) window.location.href = livelink;
else window.location.href = locallink;
}
The way you have used window.location is wrong, it is not a function hence do not accept arguments.
you can use it like this window.location = URL;
I have been trying to get my webpage to play up what it says in a text box when the user click on a link, but so far I haven't manage. I have tried with
function listen(){
var sound = new Audio();
sound.src = "http://translate.google.com/translate_tts?ie=UTF-8&tl=sv&q=Testar";
sound.play();
alert(":D");
return false;
}
and
function listen(){
var sound = document.createElement("audio");
sound.setAttribute("src","http://translate.google.com/translate_tts?tl=sv&q=Testar");
sound.load();
sound.play();
alert(":D");
return false;
}
I have tried adding ie=UTF-8 to the link, and tried both with and without sound.play(); but nothing have worked. I get smiley face from the alert so I know the function runs. Can someone please help me get this to work.
EDIT: I did a work around by using and iframe which I hide by using display: none; and then simply using javascript to change the src, not the best solution but it works... for now.
This is an easy way to do it :
var sound = new Audio("http://translate.google.com/translate_tts?tl=sv&q=Testar");
sound.play();
Now it's a bit more complicated, but still possible:
you need set up an user-agent string like a common browser and, more difficult, you also must provide a token into the GET request.
Some people managed to extract the token algorithm from the js code of the page, but it's quite a long work and at any time the algorithm changes you need to start again the reverse engineering of the cryptic code.
So it's much easier access to a particular url from the same site that generates an XHR that shows the token you need.
A simple script with phantomjs and grep will do the job for you, details here:
https://stackoverflow.com/a/37221340/6332793
I understand this question has been asked and either answered or rejected before, but i promise i have a reasonably legit reason for asking. I am doing a Uni course and one of the requirements for the web app we are making is to have a certain page (daily sales report) open once the user presses X on the browser, this is a local file only ans aside from using window.onbeforeunload = window.open("dailyreport.html"); , which opens the page every time I do anything (click links etc) I have hit a brick wall.
Also i forgot to mention we are not allowd to use JSON or jquery at all... sucks but thats what the bosses want
Thanks guys
Steve
You are looking for the windown.onclose event.
As from here
However, note that this is not supported by all browsers. If it is for a uni project you might be able to get away with it though if your requirements don't specify across-the-board browser compatibility.
Try this JSFIDDLE
window.onload = function(){
var as = document.getElementsByTagName("a");
var linkClicked = false;
for(i=0;i<as.length; i++){
as[i].onclick = function(){
linkClicked= true;
}
}
window.onbeforeunload = function(){!linkClicked && window.open("dailyreport.html");}
}
Okay, so I don't exactly even know how to word this question properly as you can probably tell. Hence I couldn't find any solution on Google, so I came here.
Basically, the process unfolds like this:
1.) The user logs into my site.
2.) The user uses my site, then leaves the browser and does whatever else, without killing the browser.
3.) The user opens up the browser again to check my site again.
When 3.) triggers, I want my site to detect that and forward the browser to some other page.
Does this make any sense? If you need clarification, just let me know. I believe there has to be a way to do this with jQuery or maybe just plain JS.
Thanks!
function onBlur() {
document.body.className = 'blurred';
};
function onFocus(){
document.body.className = 'focused';
};
if (/*#cc_on!#*/false) { // check for Internet Explorer
document.onfocusin = onFocus;
document.onfocusout = onBlur;
} else {
window.onfocus = onFocus;
window.onblur = onBlur;
}
Reference: Is there a way to detect if a browser window is not currently active?