In my project I need to use close event in browser through web, server and database deal with the information when user log out.
I do not know how to catch the event and distinguish close and refresh event.
I tried these code:
window.onbeforeunload = function() {
var n = window.event.screenX - window.screenLeft;
var b = n > document.documentElement.scrollWidth-20;
if(b && window.event.clientY < 0 || window.event.altKey) {
alert("close event");
}else{
alert("refresh event");
}
}
But it only catches the refresh event.
Is there a better way to solve the problem?
Besides,I have read the How to differentiate browser close and refresh events in Chrome?,but it doesn't give me the answer.
An idea: Judge by cookie to get the information if it is log in.
And the browser usually doesn't disable cookies.
If the cookie is disable, you may ask user to enable it.
Here is an example for cookie:
function setCookie(name, value) //cookies setting
{
var argv = setCookie.arguments;
var argc = setCookie.arguments.length;
var expires = (argc > 2) ? argv[2] : null;
if(expires!=null)
{
var LargeExpDate = new Date ();
LargeExpDate.setTime(LargeExpDate.getTime() + (expires*1000*3600*24));
}
document.cookie = name +value }
//In Js
setCookie("a","34234523542");
//read cookie:
function WM_readCookie(name)
{
//if there is no cookie,return false;or get value and return value
if(document.cookie == '')
return false;
else
return
unescape(WM_getCookieValue(name));
}
function WM_getCookieValue(name)
{
// Declare variables.
var firstChar,lastChar;
// Get the entire cookie string.
// (This may have other
name=value pairs in it.)
var theBigCookie = document.cookie;
// Grab
just this cookie from theBigCookie string.
// Find the start of
'name'.
firstChar = theBigCookie.indexOf(name);
// If you found it,
if(firstChar != -1)
{
// skip 'name' and '='.
firstChar +=
name.length + 1;
// Find the end of the value string (i.e. the next
';').
lastChar = theBigCookie.indexOf(';', firstChar);
if(lastChar == -1) lastChar = theBigCookie.length;
// Return the
value.
return theBigCookie.substring(firstChar, lastChar);
} else
{
// If there was no cookie, return false.
return false;
}
}
Related
I want to remove my scripts file after it executes. It should be removed from all session. I linked file in functions.php for child theme:
function tutsplus_enqueue_custom_js() {
wp_enqueue_script('custom', get_stylesheet_directory_uri().'/scripts/redirect.js');
}
As I said - it should be executed only once in whole session, not page. I know that it should be done with unlink but I don't know how to write a condition that will remove this file from whole session only when it was executed . Can you help me?
new script:
let executed = window.sessionStorage.getItem("sessionCodeExecuted")
console.log(executed)
if (executed != 1) {
let uri = window.location;
let lang = window.navigator.language;
if( uri.href.indexOf('lang') < 0) {
if ((lang != 'ru-RU') && (lang != 'ru')){
eng = window.location.href.includes('https://www.site/en/');
if (eng == false){
let re = "https://www.site/";
let url = window.location.href;
let newstr = url.replace(re, 'https://www.site/en/');
newstr += "?currency=USD";
window.location.href = newstr;
}
}
}
window.sessionStorage.setItem("sessionCodeExecuted", 1);
}
You can use sessionStorage to check if the script has been executed and store this info there. Then, do a check if the value exists. If it does, prevent the code from executing on next page reload. Please note that when you close and reopen the browser, the code will execute again (it seems this is exactly what you need).
(function(){
let executed = window.sessionStorage.getItem("sessionCodeExecuted");
if (!sessionStorage.getItem('sessionCodeExecuted')) {
sessionStorage.setItem('sessionCodeExecuted', 'yes');
}
if (executed) return;
/* below script will execute only once during the current browser session. */
let uri = window.location;
let lang = window.navigator.language;
if (uri.href.indexOf('lang') < 0) {
if ((lang != 'ru-RU') && (lang != 'ru')) {
eng = window.location.href.includes('https://www.site/en/');
if (eng == false) {
let re = "https://www.site/";
let url = window.location.href;
let newstr = url.replace(re, 'https://www.site/en/');
newstr += "?currency=USD";
window.location.href = newstr;
}
}
}
})();
In order to prevent malicious html/scripts from being entered in input fields and saved in our application, we are inspecting the user input for html and if found, we don't submit.
We do this using the following function
/**
* Parse for HTML elements to avoid cross-site scripting
* #param str
*/
function isHTML() {
var str = $("#AttributeInstance").val();
var htmltempElement = document.createElement('div');
htmltempElement.innerHTML = str;
for (var c = htmltempElement.childNodes, i = c.length; i--;) {
if (c[i].nodeType == 1) {
htmltempElement = null;
str = null;
return true;
}
}
return false;
}
The function is working great. For instance, if on our form, the user enters the following
<img src=a onerror=alert(1)>
The function returns true and we don't save the value.
Here is how we call this function
if (isHTML()) {
alert("Found HTML! Stop!");
instance = "";
$("#AttributeInstance").val(""); //clear the input field
}
else {
alert("No HTML! Continue");
alert(instance);
addKpi(group, name, instance, instanceSelection);
}
alert("Finished");
Now here is the issue. This code results in an alert of "Found HTML! Stop!" and then "Finished" being displayed.
But then we also get an alert of "1" which is from the original input value that contains the script. By this point, that field has been cleared and we are not storing the malicious script value anywhere, however, it pops it up as a message even though it was clearly detected and we stop processing.
Any ideas? Or any suggestion how to better detect cross site scripting values in an input field?
If we remove the following from the function
htmltempElement.innerHTML = str;
for (var c = htmltempElement.childNodes, i = c.length; i--;) {
if (c[i].nodeType == 1) {
htmltempElement = null;
str = null;
return true;
}
}
Then the script does not pop up the "1" There's something about checking for a script this way that ends up processing the script it seems.
I have this code in my index.html
if((navigator.userAgent.match(/iPhone/i)) ) {
if (document.cookie.indexOf('iphone_redirect=false') == -1) {
if (confirm('for your device exist iphone app')) {
window.location = 'https://itunes.apple.com/us/app/....';
}
}
}
var ua = navigator.userAgent.toLowerCase();
var isAndroid = ua.indexOf('android') > -1;
if(isAndroid) {
if (confirm('for your device exist iphone app')) {
window.location = 'https://play.google.com/store/apps/details?id=...';
}
}
But i don't know how to make cookie to remember my answer. If user click "cancel" or "OK" to remember "cancel" or "OK" until user clean cache.
Do you have idea how to make cookie to remember answer?
Using localStorage (phrase it so the default is falsey)
// save a flag
window.localStorage.setItem('iphone_no_redirect', 'true'); // any truthy string
// check a flag
if (window.localStorage.getItem('iphone_no_redirect')) {
// this has a truthy value
} else {
// this has a falsey value ("" or null)
}
// remove a flag
window.localStorage.removeItem('iphone_no_redirect');
// make flag falsy without removing it, set to ""
window.localStorage.setItem('iphone_no_redirect', '');
You can check against null if you want to know if a flag is set and falsey
// flag set but falsey
var x = window.localStorage.getItem('iphone_no_redirect');
if (!x && x !== null) { // x is falsey, x is not null
// ...
}
Combining this with a confirm,
function ask(question, key, overwrite) {
var response;
if (!overwrite) { // if not overwriting, check first
response = window.localStorage.getItem(key);
if (response !== null) { // has been asked before
if (['', 'false', 'no', '0', 'null', 'undefined'].indexOf(response) !== -1)
return false; // negative answers
return true; // anything else is a positive answer
}
}
if (overwrite === 2) { // easy cleanup
window.localStorage.removeItem(key);
return; // die
}
// not been asked before or we are overwriting previous answer
response = confirm(question);
window.localStorage.setItem(key, response.toString()); // "true" or "false"
return response;
}
In action
console.log(ask('Are you human?', 'is_human')); // this causes confirm dialog
console.log(ask('Are you human?', 'is_human')); // this doesn't need to ask
// changing a previous answer
console.log(ask('Are you human?', 'is_human', 1)); // this causes confirm dialog again
// cleanup
ask(null, 'is_human', 2); // (don't need question for this)
the problem here is it never goes into the else statement; I already tried creating a flag to check when it goes into the if and changing but it didn't work
var oUser = {};
// This is to add Name to JS
if (!oUser.name) {
oUser.name = prompt("Enter Name: ") // This is to add Name to JS
localStorage.name = oUser.name
// Now the time
oUser.date = new Date().toUTCString();
localStorage.date = oUser.date;
} else {
var msgDis = document.getElementById('msgDisplay');
msgDis.innerHTML = "Hi " + localStorage.name + " Welcome back!" + " -->Date: " + localStorage.date;
}
oUser.name is undefined, so !oUser.name will always pass. You're creating oUser as an empty Object (var oUser = {};), then checking a data member you never defined.
You should be checking if the localStorage is set:
// Declare oUser in the global scope, as an empty object
var oUser = {};
// check for browser support of localStorage
if(typeof(localStorage) == 'undefined') {
// Check failed, alert user
alert('Your browser does not support the localStorage method!');
} else {
// wrapping this in a try...catch block, incase cookies are disabled
try {
// Attempt to pull oUser (by key) from localStorage, failure results
// in oUser being an empty object.
oUser = JSON.parse(localStorage.getItem('oUser'))||{};
// Now check if oUser.name is NOT set
if(!oUser.name) {
// prompt user for a name
oUser.name = prompt("Enter Name: ");
// insert current date
oUser.date = (new Date()).toUTCString();
// save oUser in localStorage, stringified
localStorage.setItem('oUser',JSON.stringify(oUser));
} else {
// oUser.name was set, welcome them back
var msgDis = document.getElementById("msgDisplay");
msgDisplay.innerHTML = "Hi " + oUser.name + " Welcome back! -->Date: " + oUser.date;
}
} catch(e) {
// Cookies are disabled, which threw an error, alert the user
alert('To use localStorage, you need to enable cookies.');
}
}
Just a neat example I came up with:
LocalStorage the fun way:
LIVE DEMO
LocalStorage Script:
var LS = {
get : function(id) {
var item=localStorage.getItem(id);
return item?(item.charAt(0)=='{'?JSON.parse(item):item):{};
},
set : function(id, key) {
var k=typeof key=="object"?JSON.stringify(key):key;
return localStorage.setItem(id,k);
},
del : function(id){
return localStorage.removeItem(id);
}
};
Basic usage:
LS.set('SomeItemID', "String"||Object ); // Store a String or even an Object!
LS.get('SomeItemID'); // Get your String or your Object;
LS.del('SomeItemID'); // Deletes that LocalStorage item
In your case you can use this script like:
var oU = LS.get('oUser');
// if oUser exists as a LocalStorage key name, "oU" should now look like:
// oU = {name:"somename", date:"somedate"};
if(!oU.name){
oU.name = prompt("Enter Name: ");
oU.date = new Date().toUTCString();
LS.set('oUser', oU); // Store back the whole object
}else{
var msgDis = document.getElementById('msgDisplay');
msgDis.innerHTML = "Hi " + oU.name + " Welcome back!" + " Date: " + oU.date;
}
if you want to delete that item from your localStorage than just do:
LS.del('oUser');
If you want to add more features / fixes,
here's the script reverse-engeenered:
var LS = {
get : function(id) {
var item=localStorage.getItem(id); // Read LocalStorage(id)
if(item){
if(item.charAt(0)=='{'){ // If is String has "{" (is an JSON)
return JSON.parse(item); // Parse to get the Object
}else{
return item; // else return that string
}
}else{
return {}; // return an empty object
}
},
set : function(id, key) {
var k;
if(typeof key=="object"){ // If we're about to store an Object
k = JSON.stringify(key); // transform it to String
}else{
k = key; // else store whatever is key
}
return localStorage.setItem(id,k); // Send to LocalStorage
},
del : function(id){
return localStorage.removeItem(id);// Delete LocalStorage(id)
}
};
I'm trying to make a page out of javascript. I'm pretty new to all this, so bear with me.
I have a form, and when you press submit I have the following bit to see if the fields are left blank:
function calculatePrice()
{
var GasPrice = document.getElementById("number1").value;
var Distance = document.getElementById("number2").value;
var Mileage = document.getElementById("number3").value;
var norepeat = false;
if (norepeat==false && (GasPrice =="" || Distance =="" || Mileage ==""))
{
var para=document.createElement("p");
para.setAttribute("class", "error");
var node=document.createTextNode("All fields must be completed");
para.appendChild(node);
var element=document.getElementById("content");
element.appendChild(para);
var norepeat = true;
}
I created the error as a paragraph tag that appears. The problem is that when I press submit more than once, it writes the error message every time. I tried the norepeat variable thing, but it doesn't seem to be working. Any help?
Though I'm not completely sure your intentions, it'd have to look something more like:
var norepeat = false;
function calculatePrice() {
if(!norepeat && (/* other conditions here */)) {
norepeat = true;
}
return !(/* other conditions above */);
}
Where norepeat is defined in a global scope. Also, remember to use === as opposed to ==. And trimming the string before testing it wouldn't be a horrible idea...
But, wouldn't you want the errors to still persist if the user hasn't corrected them - isn't that the point of validation?
I think what you are trying to do is this. This assumes you add a new div "myError" that holds your error message. You'll also need to consider not submitting the form too if validation doesn't pass.
function calculatePrice() {
var GasPrice = document.getElementById("number1").value;
var Distance = document.getElementById("number2").value;
var Mileage = document.getElementById("number3").value;
var error = document.getElementById("myError");
if (GasPrice == "" || Distance == "" || Mileage == "") {
error.style.display = "block";
return false;
}
else {
error.style.display = "none";
return true;
}
}