كيف يمكنك تعطيل الإكمال التلقائي للمتصفح في حقل نموذج الويب/علامة الإدخال؟

Question

كيف يمكنك تعطيل autocomplete في المتصفحات الرئيسية لنوع محدد input (أو form field)?

Answer 1

يتجاهل فايرفوكس 30 autocomplete="off" بالنسبة لكلمات المرور، اختيار مطالبة المستخدم بدلاً من ذلك بما إذا كان يجب تخزين كلمة المرور على العميل.لاحظ ما يلي التعليق من 5 مايو 2014:

• مدير كلمة المرور دائماً يطالبك إذا كان يريد حفظ كلمة المرور.لا يتم حفظ كلمات المرور دون إذن من المستخدم.
• نحن المتصفح الثالث الذي يقوم بتنفيذ هذا التغيير، بعد IE وChrome.

بحسب ال شبكة مطوري موزيلا الوثائق، سمة عنصر النموذج المنطقي autocomplete يمنع تخزين بيانات النموذج مؤقتًا في المتصفحات القديمة.

<input type="text" name="foo" autocomplete="off" />

Answer 2

بالإضافة إلى autocomplete=off, ، يمكنك أيضًا اختيار أسماء حقول النموذج بشكل عشوائي بواسطة الكود الذي ينشئ الصفحة، ربما عن طريق إضافة بعض السلاسل الخاصة بالجلسة إلى نهاية الأسماء.

عند إرسال النموذج، يمكنك إزالة هذا الجزء قبل معالجته على جانب الخادم.وهذا من شأنه أن يمنع متصفح الويب من العثور على سياق لحقلك وقد يساعد أيضًا في منع هجمات XSRF لأن المهاجم لن يتمكن من تخمين أسماء الحقول لإرسال النموذج.

Answer 3

تتجاهل الآن معظم المتصفحات الرئيسية ومديري كلمات المرور (بشكل صحيح، IMHO). autocomplete=off.

لماذا؟تمت إضافة العديد من البنوك والمواقع الأخرى ذات "الأمان العالي". autocomplete=off إلى صفحات تسجيل الدخول الخاصة بهم "لأغراض أمنية" ولكن هذا في الواقع يقلل من الأمان لأنه يتسبب في قيام الأشخاص بتغيير كلمات المرور على هذه المواقع عالية الأمان ليسهل تذكرها (وبالتالي كسرها) نظرًا لتعطل الإكمال التلقائي.

منذ فترة طويلة بدأ معظم مديري كلمات المرور في التجاهل autocomplete=off, والآن بدأت المتصفحات في فعل الشيء نفسه بالنسبة لإدخالات اسم المستخدم/كلمة المرور فقط.

لسوء الحظ، تؤدي الأخطاء في تطبيقات الإكمال التلقائي إلى إدراج معلومات اسم المستخدم و/أو كلمة المرور في حقول نموذج غير مناسبة، مما يتسبب في حدوث أخطاء في التحقق من صحة النموذج، أو الأسوأ من ذلك، إدخال أسماء المستخدمين عن طريق الخطأ في الحقول التي تركها المستخدم فارغة عن عمد.

ما الذي يجب على مطور الويب فعله؟

• إذا كان بإمكانك الاحتفاظ بجميع حقول كلمة المرور على الصفحة بمفردها، فهذه بداية رائعة حيث يبدو أن وجود حقل كلمة المرور هو الدافع الرئيسي لبدء الإكمال التلقائي للمستخدم/المرور.بخلاف ذلك، اقرأ النصائح أدناه.
• سفاري إشعارات بوجود حقلين لكلمة المرور وتعطيل الإكمال التلقائي في هذه الحالة، على افتراض أنه يجب أن يكون نموذج تغيير كلمة المرور، وليس نموذج تسجيل الدخول.لذا تأكد فقط من استخدام حقلين لكلمة المرور (جديد وتأكيد جديد) لأي نماذج تسمح بها

• كروم 34، لسوء الحظ، سيحاول ملء الحقول تلقائيًا بالمستخدم/المرور عندما يرى حقل كلمة المرور.يعد هذا خطأ سيئًا للغاية ونأمل أن يغيروا سلوك Safari.ومع ذلك، يبدو أن إضافة هذا إلى الجزء العلوي من النموذج الخاص بك يؤدي إلى تعطيل الملء التلقائي لكلمة المرور:

  <input type="text" style="display:none">
  <input type="password" style="display:none">
  

لم أقم بعد بالتحقيق في IE أو Firefox بشكل كامل ولكن سيكون من دواعي سروري تحديث الإجابة إذا كان لدى الآخرين معلومات في التعليقات.

Answer 4

أحيانا حتى الإكمال التلقائي = إيقاف كان لا تمنع لملء في بيانات الاعتماد في حقول خاطئة، ولكن ليس حقل المستخدم أو اللقب.

هذا الحل البديل هو بالإضافة إلى منشور apinstein حول سلوك المتصفح.

إصلاح الملء التلقائي للمتصفح في وضع القراءة فقط وتعيين قابل للكتابة عند التركيز (النقر وعلامة التبويب)

 <input type="password" readonly  
     onfocus="this.removeAttribute('readonly');"/>

تحديث:يقوم Mobile Safari بتعيين المؤشر في الحقل، لكنه لا يعرض لوحة المفاتيح الافتراضية.يعمل الإصلاح الجديد كما كان من قبل ولكنه يتعامل مع لوحة المفاتيح الافتراضية:

<input id="email" readonly type="email" onfocus="if (this.hasAttribute('readonly')) {
    this.removeAttribute('readonly');
    // fix for mobile safari to show virtual keyboard
    this.blur();    this.focus();  }" />

عرض حي https://jsfiddle.net/danielsuess/n0scguv6/

// تحديث النهاية

لأن المتصفح يقوم تلقائيًا بملء بيانات الاعتماد في حقل نص خاطئ!؟

لقد لاحظت هذا السلوك الغريب على Chrome وSafari، عندما تكون هناك حقول لكلمة المرور نفس النموذج. أعتقد أن المتصفح يبحث عن حقل كلمة المرور لإدراج بيانات الاعتماد المحفوظة الخاصة بك.ثم يملأ تلقائيًا (فقط التخمين بسبب الملاحظة) أقرب حقل إدخال يشبه النص، والذي يظهر قبل حقل كلمة المرور في DOM.حيث أن المتصفح هو المثيل الأخير ولا يمكنك التحكم فيه،

لقد نجح هذا الإصلاح للقراءة فقط أعلاه بالنسبة لي.

Answer 5

<form name="form1" id="form1" method="post" 
      autocomplete="off" action="http://www.example.com/form.cgi">

سيعمل هذا في Internet Explorer وMozilla FireFox، ولكن الجانب السلبي هو أنه ليس معيار XHTML.

Answer 6

الحل لمتصفح Chrome هو الإضافة autocomplete="new-password" إلى كلمة مرور نوع الإدخال.

مثال:

<form name="myForm"" method="post">
<input name="user" type="text" />
<input name="pass" type="password" autocomplete="new-password" />
<input type="submit">
</form>

يقوم Chrome دائمًا بإكمال البيانات تلقائيًا إذا عثر على مربع أكتب كلمة المرور, ، يكفي فقط للإشارة إلى هذا المربع autocomplete = "new-password".

هذا يعمل جيدا لي.

ملحوظة:تأكد باستخدام F12 من أن تغييراتك سارية المفعول، وفي كثير من الأحيان تقوم المتصفحات بحفظ الصفحة في ذاكرة التخزين المؤقت، وهذا أعطاني انطباعًا سيئًا بأنها لا تعمل، لكن المتصفح لم يقم بالفعل بإحضار التغييرات.

Answer 7

كما قال الآخرون، الجواب هو autocomplete="off"

ومع ذلك، أعتقد أن الأمر يستحق الذكر لماذا إنها فكرة جيدة استخدام هذا في حالات معينة كبعض الإجابات على هذا و ينسخ وقد اقترحت الأسئلة أنه من الأفضل عدم إيقاف تشغيله.

لا ينبغي ترك إيقاف المتصفحات عن تخزين أرقام بطاقات الائتمان للمستخدمين.لن يدرك الكثير من المستخدمين أنها مشكلة.

من المهم بشكل خاص إيقاف تشغيله في حقول رموز أمان بطاقة الائتمان.مثل هذه الصفحة تنص على:

"لا تقم أبدًا بتخزين رمز الأمان ...وتعتمد قيمتها على افتراض أن الطريقة الوحيدة لتزويدها هي قراءتها من بطاقة الائتمان الفعلية، مما يثبت أن الشخص الذي يقدمها يحمل البطاقة بالفعل.

تكمن المشكلة في أنه إذا كان جهاز كمبيوتر عامًا (مقهى إنترنت أو مكتبة وما إلى ذلك) فمن السهل على المستخدمين الآخرين سرقة تفاصيل بطاقتك، وحتى على جهازك الخاص، يمكن أن يقوم موقع ويب ضار سرقة بيانات الإكمال التلقائي.

Answer 8

يجب أن أختلف مع تلك الإجابات التي تقول لتجنب تعطيل الإكمال التلقائي.

أول شيء يجب طرحه هو أن عدم تعطيل الإكمال التلقائي بشكل صريح في حقول نموذج تسجيل الدخول يعد فشلًا في PCI-DSS.بالإضافة إلى ذلك، إذا تم اختراق الجهاز المحلي الخاص بالمستخدم، فيمكن للمهاجم الحصول على أي بيانات إكمال تلقائي بشكل تافه نظرًا لتخزينها بشكل واضح.

من المؤكد أن هناك حجة لصالح سهولة الاستخدام، ولكن هناك توازن دقيق للغاية عندما يتعلق الأمر بحقول النماذج التي يجب تعطيل الإكمال التلقائي وأيها لا ينبغي ذلك.

Answer 9

ثلاثة خيارات:أولاً:

<input type='text' autocomplete='off' />

ثانية:

<form action='' autocomplete='off'>

ثالثا (كود جافا سكريبت):

$('input').attr('autocomplete', 'off');

Answer 10

لقد قمت بحل المعركة التي لا نهاية لها مع Google Chrome باستخدام أحرف عشوائية.عندما تقوم دائمًا بتقديم الإكمال التلقائي بسلسلة عشوائية، فلن يتذكر أي شيء أبدًا.

<input name="name" type="text" autocomplete="rutjfkde">

نأمل أن يساعد الآخرين.

Answer 11

على صلة أو في الواقع، على النقيض تمامًا -

"إذا كنت مستخدم النموذج المذكور أعلاه وترغب في إعادة تمكين وظيفة الإكمال التلقائي ، فاستخدم مرجعية" تذكر كلمة المرور "من هذا صفحة الإشارة المرجعية.يزيل كل شيء autocomplete="off" سمات من جميع النماذج على الصفحة.مواصلة القتال من أجل قضية نبيلة!"

Answer 12

لقد استخدمنا بالفعل ساسبفكرة لموقع واحد.كان عبارة عن تطبيق ويب لبرنامج طبي لتشغيل عيادة الطبيب.ومع ذلك، كان العديد من عملائنا من الجراحين الذين استخدموا الكثير من محطات العمل المختلفة، بما في ذلك المحطات شبه العامة.لذلك، أرادوا التأكد من أن الطبيب الذي لا يفهم الآثار المترتبة على كلمات المرور المحفوظة تلقائيًا أو لا ينتبه، لا يمكنه عن طريق الخطأ ترك معلومات تسجيل الدخول الخاصة به سهلة الوصول إليها.بالطبع، كان هذا قبل ظهور فكرة التصفح الخاص في IE8 وFF3.1 وما إلى ذلك.ومع ذلك، يضطر العديد من الأطباء إلى استخدام متصفحات المدرسة القديمة في المستشفيات المزودة بتكنولوجيا المعلومات التي لن تتغير.

لذلك، جعلنا صفحة تسجيل الدخول تنشئ أسماء حقول عشوائية تعمل فقط مع هذا المنشور.نعم، إنه أقل ملاءمة، ولكنه مجرد صدمة للمستخدم بشأن عدم تخزين معلومات تسجيل الدخول على المحطات العامة.

Answer 13

فقط اضبط autocomplete="off".هناك سبب وجيه جدًا للقيام بذلك:تريد توفير وظيفة الإكمال التلقائي الخاصة بك!

Answer 14

لقد كنت أحاول حلولاً لا نهاية لها، ثم وجدت هذا:

بدلاً من autocomplete="off" مجرد استخدام ببساطة autocomplete="false"

بهذه البساطة، ويعمل مثل السحر في Google Chrome أيضًا!

Answer 15

أظن autocomplete=off مدعوم في HTML 5.

اسأل نفسك عن سبب رغبتك في القيام بذلك - قد يكون ذلك منطقيًا في بعض المواقف، لكن لا تفعل ذلك لمجرد القيام بذلك.

إنها أقل ملاءمة للمستخدمين ولا حتى مشكلة أمنية في OS X (المذكورة بواسطة Soren أدناه).إذا كنت قلقًا بشأن سرقة كلمات المرور الخاصة بالأشخاص عن بُعد - فلا يزال بإمكان أداة تسجيل ضغطات المفاتيح القيام بذلك على الرغم من أن تطبيقك يستخدم autcomplete=off.

كمستخدم يختار أن يتذكر المتصفح (معظم) معلوماتي، سأجد الأمر مزعجًا إذا لم يتذكر موقعك معلوماتي.

Answer 16

لم ينجح أي من الحلول بالنسبة لي في هذه المحادثة.

لقد اكتشفت أخيرًا أ حل HTML خالص يتطلب لا يوجد جافا سكريبت, ، يعمل في المتصفحات الحديثة (باستثناء IE؛كان يجب أن يكون هناك التقاط واحد على الأقل، أليس كذلك؟)، ولا يتطلب منك تعطيل الإكمال التلقائي للنموذج بأكمله.

ما عليك سوى إيقاف تشغيل الإكمال التلقائي على form ثم قم بتشغيله لأي input ترغب في أن تعمل ضمن النموذج.على سبيل المثال:

<form autocomplete="off">
    <!-- these inputs will not allow autocomplete and chrome 
         won't highlight them yellow! -->
    <input name="username"  />
    <input name="password" type="password" />
    <!-- this field will allow autocomplete to work even 
         though we've disabled it on the form -->
    <input name="another_field" autocomplete="on" />
</form>

Answer 17

كانت طريقة غير قياسية للقيام بذلك (أعتقد أن Mozilla وInternet Explorer لا يزالان يدعمانها) ولكن العبث بتوقعات المستخدمين يعد فكرة سيئة.

إذا قام المستخدم بإدخال تفاصيل بطاقته الائتمانية في نموذج ثم سمح لشخص آخر باستخدام هذا المتصفح، فهذا ليس من شأنك.:)

Answer 18

هذا يعمل بالنسبة لي.

<input name="pass" type="password" autocomplete="new-password" />

يمكننا أيضًا استخدام هذه الإستراتيجية في عناصر التحكم الأخرى مثل النص والتحديد وما إلى ذلك

Answer 19

لقد تأخرت قليلاً عن اللعبة...ولكنني واجهت هذه المشكلة وحاولت عدة محاولات فاشلة، ولكن هذه المشكلة تناسبني وجدتها على MDN

في بعض الحالات ، سيستمر المتصفح في اقتراح قيم الإكمال التلقائي حتى لو تم ضبط السمة الإكمال التلقائي على OFF.هذا السلوك غير المتوقع يمكن أن يكون محيرًا للمطورين.الحيلة لإجبار عدم الإكمال حقًا هي تعيين سلسلة عشوائية إلى السمة مثل:

autocomplete="nope"

Answer 20

أفضل حل:

منع الإكمال التلقائي لاسم المستخدم (أو البريد الإلكتروني) وكلمة المرور:

<input type="email" name="email"><!-- Can be type="text" -->
<input type="password" name="password" autocomplete="new-password">

منع الإكمال التلقائي للحقل:

<input type="text" name="field" autocomplete="nope">

توضيح:autocomplete يواصل العمل في <input>, autocomplete="off" لا يعمل، ولكن يمكنك التغيير off إلى سلسلة عشوائية، مثل nope.

يعمل في:

• كروم:49، 50، 51، 52، 53، 54، 55، 56، 57، 58، 59، 60، 61، 62، 63 و 64

• ثعلب النار:44، 45، 46، 47، 48، 49، 50، 51، 52، 53، 54، 55، 56، 57 و 58

Answer 21

إضافة

autocomplete="off"

إلى علامة النموذج سيؤدي إلى تعطيل الإكمال التلقائي للمتصفح (ما تمت كتابته مسبقًا في هذا الحقل) من الكل input الحقول ضمن هذا النموذج معين.

اختبارها على:

• فايرفوكس 3.5، 4 بيتا
• إنترنت إكسبلورر 8
• كروم

Answer 22

حاول أن تضيف

للقراءة فقط عند التركيز = "this.removeAttribute('readonly');"

بالإضافة إلى

الإكمال التلقائي = "إيقاف"

إلى المدخلات (المدخلات) التي لا تريد أن تتذكرها بيانات النموذج (username, password, الخ) كما هو موضح أدناه:

<input type="text" name="UserName" autocomplete="off" readonly 
    onfocus="this.removeAttribute('readonly');" >

<input type="password" name="Password" autocomplete="off" readonly 
    onfocus="this.removeAttribute('readonly');" >

تحديث: فيما يلي المثال الكامل أدناه بناءً على هذا النهج الذي يمنع من السحب والإسقاط, ينسخ, معجون, ، إلخ.

<input type="text" name="UserName" style="text-transform:lowercase;" placeholder="Username" 
    autocomplete="off" readonly onfocus="this.removeAttribute('readonly');" 
    oncopy="return false" ondrag="return false" ondrop="return false" 
    onpaste="return false" oncontextmenu="return false" > 

<input type="password" name="Password" placeholder="Password" autocomplete="off" readonly 
    onfocus="this.removeAttribute('readonly');" oncopy="return false" ondrag="return false" 
    ondrop="return false" onpaste="return false" oncontextmenu="return false" >

تم اختباره على أحدث الإصدارات من المتصفحات الرئيسية، مثل. Google Chrome, Mozilla Firefox, Microsoft Edge, ، إلخ.والعمل دون أي مشكلة.أتمنى أن يساعدك هذا...

Answer 23

استخدم اسمًا ومعرفًا غير قياسيين للحقول، لذا بدلاً من "الاسم" استخدم "name_".لن تراه المتصفحات بعد ذلك على أنه حقل الاسم.أفضل ما في الأمر هو أنه يمكنك القيام بذلك لبعض الحقول وليس كلها، وسيقوم بإكمال بعض الحقول تلقائيًا وليس كلها.

Answer 24

لتجنب XHTML غير الصالح، يمكنك تعيين هذه السمة باستخدام جافا سكريبت.مثال باستخدام jQuery:

<input type="text" class="noAutoComplete" ... />

$(function() {
    $('.noAutoComplete').attr('autocomplete', 'off');
});

تكمن المشكلة في أن المستخدمين الذين ليس لديهم جافا سكريبت سيحصلون على وظيفة الإكمال التلقائي.

Answer 25

إضافة autocomplete="off" لن يقطعها.

تغيير سمة نوع الإدخال إلى type="search".
لا يطبق Google الملء التلقائي على المدخلات ذات نوع البحث.

Answer 26

جرب هذه أيضًا إذا كان الأمر كذلك autocomplete="off" لا يعمل:

autocorrect="off" autocapitalize="off" autocomplete="off"

Answer 27

لا أستطيع أن أصدق أن هذه لا تزال مشكلة بعد فترة طويلة من الإبلاغ عنها.لم تنجح الحلول المذكورة أعلاه بالنسبة لي، حيث يبدو أن Safari يعرف متى لا يتم عرض العنصر أو خارج الشاشة، ولكن ما يلي نجح معي:

<div style="height:0px; overflow:hidden; ">
  Username <input type="text" name="fake_safari_username" >
  Password <input type="password" name="fake_safari_password">
</div>

نأمل أن يكون مفيدا لشخص ما!

Answer 28

هذه مشكلة أمنية تتجاهلها المتصفحات الآن.تقوم المتصفحات بتحديد المحتوى وتخزينه باستخدام أسماء الإدخال، حتى لو اعتبر المطورون أن المعلومات حساسة ويجب عدم تخزينها.سيؤدي جعل اسم الإدخال مختلفًا بين طلبين إلى حل المشكلة (ولكن سيظل محفوظًا في ذاكرة التخزين المؤقت للمتصفح وسيؤدي أيضًا إلى زيادة ذاكرة التخزين المؤقت للمتصفح).إن مطالبة المستخدم بتنشيط أو إلغاء تنشيط الخيارات في إعدادات المتصفح الخاص به ليس حلاً جيدًا.يمكن إصلاح المشكلة في الواجهة الخلفية.

هذا هو الإصلاح الخاص بي.النهج الذي قمت بتنفيذه في إطار العمل الخاص بي.يتم إنشاء جميع عناصر الإكمال التلقائي باستخدام مدخلات مخفية مثل هذا:

<? $r = rmd5(rand().mocrotime(TRUE)); ?>
<form method="POST" action="./">
    <input type="text" name="<? echo $r; ?>" />
    <input type="hidden" name="__autocomplete_fix_<? echo $r; ?>" value="username" />
    <input type="submit" name="submit" value="submit" />
</form>

يقوم الخادم بعد ذلك بمعالجة متغيرات النشر مثل هذا:

foreach ($_POST as $key => $val)
{
    if(preg_match('#^__autocomplete_fix_#', $key) === 1){
        $n = substr($key, 19);
        if(isset($_POST[$n]))$_POST[$val] = $_POST[$n];
    }
}

يمكن الوصول إلى القيمة كالمعتاد

var_dump($_POST['username']);

ولن يتمكن المتصفح من اقتراح معلومات من الطلب السابق أو من المستخدمين السابقين.

كل شيء يعمل مثل السحر، حتى لو تم تحديث المتصفحات، أو تريد تجاهل الإكمال التلقائي أم لا.لقد كانت هذه أفضل طريقة لإصلاح المشكلة بالنسبة لي.

Answer 29

لم تنجح أي من الاختراقات المذكورة هنا في Chrome.وفيه مناقشة للمسألة هنا: https://code.google.com/p/chromium/issues/detail?id=468153#c41

إضافة هذا داخل أ <form> يعمل (على الأقل في الوقت الحالي):

<div style="display: none;">
    <input type="text" id="PreventChromeAutocomplete" name="PreventChromeAutocomplete" autocomplete="address-level4" />
</div>

Answer 30

إذن هذا هو:

function turnOnPasswordStyle() {
  $('#inputpassword').attr('type', "password");
}

<input oninput="turnOnPasswordStyle()" id="inputpassword" type="text">