Privacy prevent page from showing on back button - browser

There will be a computer on display which users will write in their name, phone number, email and other information. We dont want users going back a page and grabbing ppls emails or other information.
How do i make it so when someone hits back the form no longer shows and a "sorry return to the first page" kind of thing. Theres a small chance there may be an agreement screen so hitting back and submitting another form and no seeing the screen may be trouble but i am not worried about that (or can say please put them on the same page).
I know its been asked but i havent seen any with this reason and the solutions i saw did not work (on firefox 3.6.10)

A little web searching found this page: Clear Web Forms After Submit
Basically calls the reset() function on all forms on the <body> tag's onload and unload events.
Code from the link:
<html>
<head>
<title>A Self-Clearing Form</title>
<script>
function clearForms()
{
var i;
for (i = 0; (i < document.forms.length); i++) {
document.forms[i].reset();
}
}
</script>
</head>
<body onLoad="clearForms()" onUnload="clearForms()">
<h1>A Self-Clearing Form</h1>
This form data will self-destruct when you leave the current web page.
<form method="post" action="page2.php" name="test">
<input name="field1"/> Field One
<p>
<input name="field2" type="radio" value="One"/>One
<input name="field2" type="radio" value="Two"/>Two
<input name="field2" type="radio" value="Three"/>Three
<input name="field2" type="radio" value="Four"/>Four
<p>
<input type="submit" value="Submit Form Data"/>
</form>
</body>
</html>

When the users enter information, save it and then send a redirect (through headers) to the page where users can enter their info.

Could have the form displayed as a result of a POST call, meaning the browser won't cache it. Then, if another user hits back, the browser will ask if they want to resend the request, but even if they do, you display them a blank page.

Related

Node.js Getting values from html and using req.body.<name>

I am trying to retrieve multiple values from HTML and make use of it using req.body..
I am able to do this via message: req.body.message
<form id="message-form" class="input-group input-group-lg" style="">
<input type="text" name="message" class="form-control" aria-label="Large" aria-describedby="inputGroup-sizing-sm">
<div class="input-group-prepend">
<button class="btn btn-primary">Send</button>
</div>
</form>
However, I would like to retrieve the values from elements that are not inside the e.g <span id="item" style="font-weight:bold"> </span>
The reason is that when I load the page, it renders these values dynamically (retrieved from database). When I want to do a POST, I would like to make use of these values that have been rendered previously.
Is there a way to do this?
Many thanks.
Forms don't submit data that does not appear inside a form control.
So you can either:
Store the data somewhere in the server (such as in a session) where you can read it back on a subsequent request (watch out for race conditions!) or
Put the data in a form control instead of or as well as in the span. (Possibly using a hidden input).

Example of silently submitting a POST FORM (CSRF)

I'm interested in knowing how it is possible to silently submit a POST form for CSRF, without the user having any notice (the document location being redirected to the POSTed URL is not silent).
Example:
<form method='POST' action='http://vulnerablesite.com/form.php'>
<input type='hidden' name='criticaltoggle' value='true'
<input type='submit' value='submit'>
</form>
On an external site, what would I need to do to trigger this form automatically and silently?
One solution would be to open the form’s action in a frame like an iframe:
<iframe style="display:none" name="csrf-frame"></iframe>
<form method='POST' action='http://vulnerablesite.com/form.php' target="csrf-frame" id="csrf-form">
<input type='hidden' name='criticaltoggle' value='true'>
<input type='submit' value='submit'>
</form>
<script>document.getElementById("csrf-form").submit()</script>
When testing CSRF locally you may have to overcome several security measures.
For Blocked loading mixed active content errors, ensure the protocol (http/https) of the attacker site and target site are the same, or use "//" as protocol for attacker site. Example attack on localhost:
<iframe style="display:none" id="csrf-frame-invisible" name="csrf-frame-invisible"></iframe>
<form style="display:none" method='POST' action='//localhost:4000' target="csrf-frame-invisible" name="csrf-form-invisible" id="csrf-form-invisible">
<input type='hidden' name='boo' value='true'>
<input type='submit' value='Submit'>
</form>
Alternatively set Firefox security.mixed_content.block_active_content to false.
If using Angular, security options prevent you using inline javascript, so you'll need to move the submit to code-behind on the attacker site:
ngOnInit() {
const myForm: HTMLFormElement = document.getElementById('csrf-form-invisible') as HTMLFormElement;
myForm.submit();
}
Finally the attacker site's header 'x-frame-options' must not be set.

How can I submit a form to a new tab in my chrome extension

I am working on a Google chrome extension. the idea is that I enter my username and password, click submit and have a new tab open with my website, which will then pick up the submitted form and log me in.
I have managed to open my website in a new tab, but can not get it to pick up the form.
You can use OnClick event in submit button:
<input type="submit" value="submit" onclick="this.form.target='_blank';return true;">
You can create an HTML form in your popup.html as follows:
<form name="input" action="http://example.com/login.php" method="get">
Username: <input type="text" name="user">
Password: <input type="password" name="password">
<input type="submit" value="Submit"></form>
And in the script of your website you can check if the parameters and have been passed, and if correct then create redirect them to the DashBoard on your site, otherwise show them the login page to enter the correct credentials
Since you've got your website loaded, try using jquery to select the textbox and enter a value.
The following selects the where the input is, then finds the input I want, then finally sets the value inside of that box.
$("td[data-key='sku']").find("input.tb-input").val('some text here')
In the jquery code above, the html would look something like this:
<td data-key='sku'>
<input class=tb-input/>
</td>

Add a form with POST method on a SharePoint 2010 page?

The HTML I got asked to add to a page is:
<div>
<div> Click below to enter</div>
<form id="formID" method=POST action="http://www.someWebsite.com">
<input type="submit" name="do_login" value="Log in" />
<input type="hidden" name="username" value="someUsername" />
<input type="hidden" name="password" value="somePassword" />
</form>
</div>
I know I can't add a form like that because there is already on that SharePoint created, I had a look at http://www.sharepointboris.net/2008/09/making-post-and-get-forms-from-sharepoints-pages/ but when I follow the example and save SharePoint still strips out most of the code so how can I achieve what I want in another way?
Thanks in advance.
For our SharePoint 2007 installation, I created a quiz web part. Basically, it pulls questions and answers from a list, but the actual questions are presented and submitted using a form with POST variables. It's probably much more complex and in-depth than you're looking to go, but I made a custom web part to present the form, read the post variables, and execute associated functions. The big plus to using a custom web part is that you're able to put in nearly any content you want, since you're coding it in ASP.NET.
What I did was to create a custom .aspx page (not through the sharepoint gui) with the code I posted in my question, uploaded the page to a library and then linked to it via a page viewer web part
You can get the form to work as normal if you remove the tags and place the form control inside a div like so:
<div>
<div> Click below to enter</div>
<div id="formID" method=POST action="http://www.someWebsite.com">
<input type="submit" name="do_login" value="Log in" />
<input type="hidden" name="username" value="someUsername" />
<input type="hidden" name="password" value="somePassword" />
</div>
</div>
This way sharepoint will accept everything inside the div tags. In a asp.net when you create a page in sharepoint, the whole page is containied withing a form that why sharepoint does not allow you to use another form within it.
Hope this helps

Disable browser 'Save Password' functionality

One of the joys of working for a government healthcare agency is having to deal with all of the paranoia around dealing with PHI (Protected Health Information). Don't get me wrong, I'm all for doing everything possible to protect people's personal information (health, financial, surfing habits, etc.), but sometimes people get a little too jumpy.
Case in point: One of our state customers recently found out that the browser provides the handy feature to save your password. We all know that it has been there for a while and is completely optional and is up to the end user to decide whether or not it is a smart decision to use or not. However, there is a bit of an uproar at the moment and we are being demanded to find a way to disable that functionality for our site.
Question: Is there a way for a site to tell the browser not to offer to remember passwords? I've been around web development a long time but don't know that I have come across that before.
Any help is appreciated.
I'm not sure if it'll work in all browsers but you should try setting autocomplete="off" on the form.
<form id="loginForm" action="login.cgi" method="post" autocomplete="off">
The easiest and simplest way to disable Form and Password storage prompts and prevent form data from being cached in session history is to use the autocomplete form element attribute with value "off".
From https://developer.mozilla.org/en-US/docs/Web/Security/Securing_your_site/Turning_off_form_autocompletion
Some minor research shows that this works in IE to but I'll leave no guarantees ;)
#Joseph: If it's a strict requirement to pass XHTML validation with the actual markup (don't know why it would be though) you could theoretically add this attribute with javascript afterwards but then users with js disabled (probably a neglectable amount of your userbase or zero if your site requires js) will still have their passwords saved.
Example with jQuery:
$('#loginForm').attr('autocomplete', 'off');
In addition to
autocomplete="off"
Use
readonly onfocus="this.removeAttribute('readonly');"
for the inputs that you do not want them to remember form data (username, password, etc.) as shown below:
<input type="text" name="UserName" autocomplete="off" readonly
onfocus="this.removeAttribute('readonly');" >
<input type="password" name="Password" autocomplete="off" readonly
onfocus="this.removeAttribute('readonly');" >
Tested on the latest versions of the major browsers i.e. Google Chrome, Mozilla Firefox, Microsoft Edge, etc. and works like a charm.
I had been struggling with this problem a while, with a unique twist to the problem. Privileged users couldn't have the saved passwords work for them, but normal users needed it. This meant privileged users had to log in twice, the second time enforcing no saved passwords.
With this requirement, the standard autocomplete="off" method doesn't work across all browsers, because the password may have been saved from the first login. A colleague found a solution to replace the password field when it was focused with a new password field, and then focus on the new password field (then hook up the same event handler). This worked (except it caused an infinite loop in IE6). Maybe there was a way around that, but it was causing me a migraine.
Finally, I tried to just have the username and password outside of the form. To my surprise, this worked! It worked on IE6, and current versions of Firefox and Chrome on Linux. I haven't tested it further, but I suspect it works in most if not all browsers (but it wouldn't surprise me if there was a browser out there that didn't care if there was no form).
Here is some sample code, along with some jQuery to get it to work:
<input type="text" id="username" name="username"/>
<input type="password" id="password" name="password"/>
<form id="theForm" action="/your/login" method="post">
<input type="hidden" id="hiddenUsername" name="username"/>
<input type="hidden" id="hiddenPassword" name="password"/>
<input type="submit" value="Login"/>
</form>
<script type="text/javascript" language="JavaScript">
$("#theForm").submit(function() {
$("#hiddenUsername").val($("#username").val());
$("#hiddenPassword").val($("#password").val());
});
$("#username,#password").keypress(function(e) {
if (e.which == 13) {
$("#theForm").submit();
}
});
</script>
Well, its a very old post, but still I will give my solution, which my team had been trying to achieve for long. We just added a new input type="password" field inside the form and wrapped it in div and made the div hidden. Made sure that this div is before the actual password input.
This worked for us and it didn't gave any Save Password option
Plunk - http://plnkr.co/edit/xmBR31NQMUgUhYHBiZSg?p=preview
HTML:
<form method="post" action="yoururl">
<div class="hidden">
<input type="password"/>
</div>
<input type="text" name="username" placeholder="username"/>
<input type="password" name="password" placeholder="password"/>
</form>
CSS:
.hidden {display:none;}
You can prevent the browser from matching the forms up by randomizing the name used for the password field on each show. Then the browser sees a password for the same the url, but can't be sure it's the same password. Maybe it's controlling something else.
Update: note that this should be in addition to using autocomplete or other tactics, not a replacement for them, for the reasons indicated by others.
Also note that this will only prevent the browser from auto-completing the password. It won't prevent it from storing the password in whatever level of arbitrary security the browser chooses to use.
The cleanest way is to use autocomplete="off" tag attribute but
Firefox does not properly obey it when you switch fields with Tab.
The only way you could stop this is to add a fake hidden password field which tricks the browser to populate the password there.
<input type="text" id="username" name="username"/>
<input type="password" id="prevent_autofill" autocomplete="off" style="display:none" tabindex="-1" />
<input type="password" id="password" autocomplete="off" name="password"/>
It is an ugly hack, because you change the browser behavior, which should be considered bad practice. Use it only if you really need it.
Note: this will effectively stop password autofill, because FF will "save" the value of #prevent_autofill (which is empty) and will try to populate any saved passwords there, as it always uses the first type="password" input it finds in DOM after the respective "username" input.
Use real two-factor authentication to avoid the sole dependency on passwords which might be stored in many more places than the user's browser cache.
I have tested that adding autocomplete="off" in form tag in all major browsers. In fact, Most of the peoples in US using IE8 so far.
IE8, IE9, IE10, Firefox, Safari are works fine.
Browser not asking "save password".
Also, previously saved username & password not populated.
Chrome & IE 11 not supporting the autocomplete="off" feature
FF supporting the autocomplete="off". but sometimes existing saved
credentials are populated.
Updated on June 11, 2014
Finally, below is a cross browser solution using javascript and it is working fine in all browsers.
Need to remove "form" tag in login form. After client side validation, put that credentials in hidden form and submit it.
Also, add two methods. one for validation "validateLogin()" and another for listening enter event while click enter in textbox/password/button "checkAndSubmit()". because now login form does not have a form tag, so enter event not working here.
HTML
<form id="HiddenLoginForm" action="" method="post">
<input type="hidden" name="username" id="hidden_username" />
<input type="hidden" name="password" id="hidden_password" />
</form>
Username: <input type="text" name="username" id="username" onKeyPress="return checkAndSubmit(event);" />
Password: <input type="text" name="password" id="password" onKeyPress="return checkAndSubmit(event);" />
<input type="button" value="submit" onClick="return validateAndLogin();" onKeyPress="return checkAndSubmit(event);" />
Javascript
//For validation- you can modify as you like
function validateAndLogin(){
var username = document.getElementById("username");
var password = document.getElementById("password");
if(username && username.value == ''){
alert("Please enter username!");
return false;
}
if(password && password.value == ''){
alert("Please enter password!");
return false;
}
document.getElementById("hidden_username").value = username.value;
document.getElementById("hidden_password").value = password.value;
document.getElementById("HiddenLoginForm").submit();
}
//For enter event
function checkAndSubmit(e) {
if (e.keyCode == 13) {
validateAndLogin();
}
}
Good luck!!!
Not really - the only thing you could realistically do is offer advice on the site; maybe, before their first time signing in, you could show them a form with information indicating that it is not recommended that they allow the browser to store the password.
Then the user will immediately follow the advice, write down the password on a post-it note and tape it to their monitor.
What I have been doing is a combination of autocomplete="off" and clearing password fields using a javascript / jQuery.
jQuery Example:
$(function() {
$('#PasswordEdit').attr("autocomplete", "off");
setTimeout('$("#PasswordEdit").val("");', 50);
});
By using setTimeout() you can wait for the browser to complete the field before you clear it, otherwise the browser will always autocomplete after you've clear the field.
if autocomplete="off" is not working...remove the form tag and use a div tag instead, then pass the form values using jquery to the server. This worked for me.
Because autocomplete="off" does not work for password fields, one must rely on javascript. Here's a simple solution based on answers found here.
Add the attribute data-password-autocomplete="off" to your password field:
<input type="password" data-password-autocomplete="off">
Include the following JS:
$(function(){
$('[data-password-autocomplete="off"]').each(function() {
$(this).prop('type', 'text');
$('<input type="password"/>').hide().insertBefore(this);
$(this).focus(function() {
$(this).prop('type', 'password');
});
});
});
This solution works for both Chrome and FF.
This is my html code for solution. It works for Chrome-Safari-Internet Explorer. I created new font which all characters seem as "●". Then I use this font for my password text. Note: My font name is "passwordsecretregular".
<style type="text/css">
#login_parola {
font-family: 'passwordsecretregular' !important;
-webkit-text-security: disc !important;
font-size: 22px !important;
}
</style>
<input type="text" class="w205 has-keyboard-alpha" name="login_parola" id="login_parola" onkeyup="checkCapsWarning(event)"
onfocus="checkCapsWarning(event)" onblur="removeCapsWarning()" onpaste="return false;" maxlength="32"/>
Just so people realise - the 'autocomplete' attribute works most of the time, but power users can get around it using a bookmarklet.
Having a browser save your passwords actually increases protection against keylogging, so possibly the safest option is to save passwords in the browser but protect them with a master password (at least in Firefox).
I have a work around, which may help.
You could make a custom font hack. So, make a custom font, with all the characters as a dot / circle / star for example. Use this as a custom font for your website. Check how to do this in inkscape: how to make your own font
Then on your log in form use:
<form autocomplete='off' ...>
<input type="text" name="email" ...>
<input type="text" name="password" class="password" autocomplete='off' ...>
<input type=submit>
</form>
Then add your css:
#font-face {
font-family: 'myCustomfont';
src: url('myCustomfont.eot');
src: url('myCustomfont?#iefix') format('embedded-opentype'),
url('myCustomfont.woff') format('woff'),
url('myCustomfont.ttf') format('truetype'),
url('myCustomfont.svg#myCustomfont') format('svg');
font-weight: normal;
font-style: normal;
}
.password {
font-family:'myCustomfont';
}
Pretty cross browser compatible. I have tried IE6+, FF, Safari and Chrome. Just make sure that the oet font that you convert does not get corrupted. Hope it helps?
The simplest way to solve this problem is to place INPUT fields outside the FORM tag and add two hidden fields inside the FORM tag. Then in a submit event listener before the form data gets submitted to server copy values from visible input to the invisible ones.
Here's an example (you can't run it here, since the form action is not set to a real login script):
<!doctype html>
<html>
<head>
<title>Login & Save password test</title>
<meta charset="utf-8">
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
</head>
<body>
<!-- the following fields will show on page, but are not part of the form -->
<input class="username" type="text" placeholder="Username" />
<input class="password" type="password" placeholder="Password" />
<form id="loginForm" action="login.aspx" method="post">
<!-- thw following two fields are part of the form, but are not visible -->
<input name="username" id="username" type="hidden" />
<input name="password" id="password" type="hidden" />
<!-- standard submit button -->
<button type="submit">Login</button>
</form>
<script>
// attache a event listener which will get called just before the form data is sent to server
$('form').submit(function(ev) {
console.log('xxx');
// read the value from the visible INPUT and save it to invisible one
// ... so that it gets sent to the server
$('#username').val($('.username').val());
$('#password').val($('.password').val());
});
</script>
</body>
</html>
My js (jquery) workaround is to change password input type to text on form submit. The password could become visible for a second, so I also hide the input just before that. I would rather not use this for login forms, but it is useful (together with autocomplete="off") for example inside administration part of the website.
Try putting this inside a console (with jquery), before you submit the form.
$('form').submit(function(event) {
$(this).find('input[type=password]').css('visibility', 'hidden').attr('type', 'text');
});
Tested on Chrome 44.0.2403.157 (64-bit).
I tested lots of solutions. Dynamic password field name, multiple password fields (invisible for fake ones), changing input type from "text" to "password", autocomplete="off", autocomplete="new-password",... but nothing solved it with recent browser.
To get rid of password remember, I finally treated the password as input field, and "blur" the text typed.
It is less "safe" than a native password field since selecting the typed text would show it as clear text, but password is not remembered. It also depends on having Javascript activated.
You will have estimate the risk of using below proposal vs password remember option from navigator.
While password remember can be managed (disbaled per site) by the user, it's fine for a personal computer, not for a "public" or shared computer.
I my case it's for a ERP running on shared computers, so I'll give it a try to my solution below.
<input style="background-color: rgb(239, 179, 196); color: black; text-shadow: none;" name="password" size="10" maxlength="30" onfocus="this.value='';this.style.color='black'; this.style.textShadow='none';" onkeypress="this.style.color='transparent'; this.style.textShadow='1px 1px 6px green';" autocomplete="off" type="text">
Markus raised a great point. I decided to look up the autocomplete attribute and got the following:
The only downside to using this
attribute is that it is not standard
(it works in IE and Mozilla browsers),
and would cause XHTML validation to
fail. I think this is a case where
it's reasonable to break validation
however. (source)
So I would have to say that although it doesn't work 100% across the board it is handled in the major browsers so its a great solution.
The real problem is much deeper than just adding attributes to your HTML - this is common security concern, that's why people invented hardware keys and other crazy things for security.
Imagine you have autocomplete="off" perfectly working in all browsers. Would that help with security? Of course, no. Users will write down their passwords in textbooks, on stickers attached to their monitor where every office visitor can see them, save them to text files on the desktop and so on.
Generally, web application and web developer isn't responsible in any way for end-user security. End-users can protect themselves only. Ideally, they MUST keep all passwords in their head and use password reset functionality (or contact administrator) in case they forgot it. Otherwise there always will be a risk that password can be seen and stolen somehow.
So either you have some crazy security policy with hardware keys (like, some banks offer for Internet-banking which basically employs two-factor authentication) or NO SECURITY basically. Well, this is a bit over exaggerated of course. It's important to understand what are you trying to protect against:
Not authorised access. Simplest login form is enough basically. There sometimes additional measures taken like random security questions, CAPTCHAs, password hardening etc.
Credential sniffing. HTTPS is A MUST if people access your web application from public Wi-Fi hotspots etc. Mention that even having HTTPS, your users need to change their passwords regularly.
Insider attack. There are two many examples of such, starting from simple stealing of your passwords from browser or those that you have written down somewhere on the desk (does not require any IT skills) and ending with session forging and intercepting local network traffic (even encrypted) and further accessing web application just like it was another end-user.
In this particular post, I can see inadequate requirements put on developer which he will never be able to resolve due to the nature of the problem - end-user security. My subjective point is that developer should basically say NO and point on requirement problem rather than wasting time on such tasks, honestly. This does not absolutely make your system more secure, it will rather lead to the cases with stickers on monitors. Unfortunately, some bosses hear only what they want to hear. However, if I was you I would try to explain where the actual problem is coming from, and that autocomplete="off" would not resolve it unless it will force users to keep all their passwords exclusively in their head! Developer on his end cannot protect users completely, users need to know how to use system and at the same time do not expose their sensitive/secure information and this goes far beyond authentication.
I tried above autocomplete="off" and yet anything successful. if you are using angular js my recommendation is to go with button and the ng-click.
<button type="button" class="" ng-click="vm.login()" />
This already have a accepted answer im adding this if someone cant solve the problem with the accepted answer he can go with my mechanism.
Thanks for the question and the answers.
One way I know is to use (for instance) JavaScript to copy the value out of the password field before submitting the form.
The main problem with this is that the solution is tied to JavaScript.
Then again, if it can be tied to JavaScript you might as well hash the password on the client-side before sending a request to the server.
Facing the same HIPAA issue and found a relatively easy solution,
Create a hidden password field with the field name as an array.
<input type="password" name="password[]" style="display:none" />
Use the same array for the actual password field.
<input type="password" name="password[]" />
The browser (Chrome) may prompt you to "Save password" but regardless if the user selects save, the next time they login the password will auto-populate the hidden password field, the zero slot in the array, leaving the 1st slot blank.
I tried defining the array, such as "password[part2]" but it still remembered. I think it throws it off if it's an unindexed array because it has no choice but to drop it in the first spot.
Then you use your programming language of choice to access the array, PHP for example,
echo $_POST['password'][1];
Since most of the autocomplete suggestions, including the accepted answer, don't work in today's web browsers (i.e. web browser password managers ignore autocomplete), a more novel solution is to swap between password and text types and make the background color match the text color when the field is a plain text field, which continues to hide the password while being a real password field when the user (or a program like KeePass) is entering a password. Browsers don't ask to save passwords that are stored in plain text fields.
The advantage of this approach is that it allows for progressive enhancement and therefore doesn't require Javascript for a field to function as a normal password field (you could also start with a plain text field instead and apply the same approach but that's not really HIPAA PHI/PII-compliant). Nor does this approach depend on hidden forms/fields which might not necessarily be sent to the server (because they are hidden) and some of those tricks also don't work either in several modern browsers.
jQuery plugin:
https://github.com/cubiclesoft/php-flexforms-modules/blob/master/password-manager/jquery.stoppasswordmanager.js
Relevant source code from the above link:
(function($) {
$.fn.StopPasswordManager = function() {
return this.each(function() {
var $this = $(this);
$this.addClass('no-print');
$this.attr('data-background-color', $this.css('background-color'));
$this.css('background-color', $this.css('color'));
$this.attr('type', 'text');
$this.attr('autocomplete', 'off');
$this.focus(function() {
$this.attr('type', 'password');
$this.css('background-color', $this.attr('data-background-color'));
});
$this.blur(function() {
$this.css('background-color', $this.css('color'));
$this.attr('type', 'text');
$this[0].selectionStart = $this[0].selectionEnd;
});
$this.on('keydown', function(e) {
if (e.keyCode == 13)
{
$this.css('background-color', $this.css('color'));
$this.attr('type', 'text');
$this[0].selectionStart = $this[0].selectionEnd;
}
});
});
}
}(jQuery));
Demo:
https://barebonescms.com/demos/admin_pack/admin.php
Click "Add Entry" in the menu and then scroll to the bottom of the page to "Module: Stop Password Manager".
Disclaimer: While this approach works for sighted individuals, there might be issues with screen reader software. For example, a screen reader might read the user's password out loud because it sees a plain text field. There might also be other unforeseen consequences of using the above plugin. Altering built-in web browser functionality should be done sparingly with testing a wide variety of conditions and edge cases.
<input type="text" id="mPassword" required="required" title="Valid password required" autocomplete="off" list="autocompleteOff" readonly onfocus="this.removeAttribute('readonly');" style="text-security:disc; -webkit-text-security:disc;" oncopy="return false;" onpaste="return false;"/>
Is there a way for a site to tell the browser not to offer to remember passwords?
The website tells the browser that it is a password by using <input type="password">. So if you must do this from a website perspective then you would have to change that. (Obviously I don't recommend this).
The best solution would be to have the user configure their browser so it won't remember passwords.
If you do not want to trust the autocomplete flag, you can make sure that the user types in the box using the onchange event. The code below is a simple HTML form. The hidden form element password_edited starts out set to 0. When the value of password is changed, the JavaScript at the top (pw_edited function) changes the value to 1. When the button is pressed, it checks the valueenter code here before submitting the form. That way, even if the browser ignores you and autocompletes the field, the user cannot pass the login page without typing in the password field. Also, make sure to blank the password field when focus is set. Otherwise, you can add a character at the end, then go back and remove it to trick the system. I recommend adding the autocomplete="off" to password in addition, but this example shows how the backup code works.
<html>
<head>
<script>
function pw_edited() {
document.this_form.password_edited.value = 1;
}
function pw_blank() {
document.this_form.password.value = "";
}
function submitf() {
if(document.this_form.password_edited.value < 1) {
alert("Please Enter Your Password!");
}
else {
document.this_form.submit();
}
}
</script>
</head>
<body>
<form name="this_form" method="post" action="../../cgi-bin/yourscript.cgi?login">
<div style="padding-left:25px;">
<p>
<label>User:</label>
<input name="user_name" type="text" class="input" value="" size="30" maxlength="60">
</p>
<p>
<label>Password:</label>
<input name="password" type="password" class="input" size="20" value="" maxlength="50" onfocus="pw_blank();" onchange="pw_edited();">
</p>
<p>
<span id="error_msg"></span>
</p>
<p>
<input type="hidden" name="password_edited" value="0">
<input name="submitform" type="button" class="button" value="Login" onclick="return submitf();">
</p>
</div>
</form>
</body>
</html>
autocomplete="off" does not work for disabling the password manager in Firefox 31 and most likely not in some earlier versions, too.
Checkout the discussion at mozilla about this issue:
https://bugzilla.mozilla.org/show_bug.cgi?id=956906
We wanted to use a second password field to enter a one-time password generated by a token. Now we are using a text input instead of a password input. :-(
I was given a similar task to disable the auto-filling up of login name and passwords by browser, after lot of trial and errors i found the below solution to be optimal. Just add the below controls before your original controls.
<input type="text" style="display:none">
<input type="text" name="OriginalLoginTextBox">
<input type="password" style="display:none">
<input type="text" name="OriginalPasswordTextBox">
This is working fine for IE11 and Chrome 44.0.2403.107
autocomplete="off" works for most modern browsers, but another method I used that worked successfully with Epiphany (a WebKit-powered browser for GNOME) is to store a randomly generated prefix in session state (or a hidden field, I happened to have a suitable variable in session state already), and use this to alter the name of the fields. Epiphany still wants to save the password, but when going back to the form it won't populate the fields.

Resources