আমি কীভাবে পাসওয়ার্ড সংরক্ষণের অনুরোধ জানাতে ব্রাউজার পেতে পারি?


149

আরে, আমি এমন একটি ওয়েব অ্যাপে কাজ করছি যেটিতে লগইন সংলাপ রয়েছে যা এই জাতীয়ভাবে কাজ করে:

  1. ব্যবহারকারী "লগইন" ক্লিক করে
  2. লগইন ফর্ম এইচটিএমএল এজেএক্স দিয়ে লোড করা হয় এবং পৃষ্ঠায় ডিআইভিতে প্রদর্শিত হয়
  3. ব্যবহারকারী ক্ষেত্রগুলিতে ব্যবহারকারী / পাস প্রবেশ করে এবং ক্লিকগুলি জমা দেয়। এটি কোনও নয় <form>- এজেএক্সের মাধ্যমে ব্যবহারকারী / পাস জমা দেওয়া হয়েছে
  4. যদি ব্যবহারকারী / পাস ঠিক থাকে তবে ব্যবহারকারীরা লগ ইন থাকা সাথে পৃষ্ঠাটি পুনরায় লোড করে।
  5. যদি ব্যবহারকারী / পাস খারাপ হয় তবে পৃষ্ঠাটি পুনরায় লোড হয় না তবে ত্রুটি বার্তাটি ডিআইভিতে উপস্থিত হয় এবং ব্যবহারকারী আবার চেষ্টা করে।

সমস্যাটি এখানে: ব্রাউজারটি কখনও কখনও "এই পাসওয়ার্ডটি সংরক্ষণ করুন? হ্যাঁ / কখনই না এখনই নয়" প্রম্পট দেয় না যা এটি অন্যান্য সাইটের জন্য করে।

আমি মোড়কে চেষ্টা <div>মধ্যে <form>সঙ্গে "স্বয়ংসম্পূর্ণ = 'উপর'" ট্যাগ কিন্তু কোনো পার্থক্য তৈরি।

ব্রাউজারটি আমার লগইন প্রবাহের কোনও প্রধান পুনরায় কাজ ছাড়াই পাসওয়ার্ডটি সংরক্ষণ করার প্রস্তাব দেওয়া কি সম্ভব?

ধন্যবাদ এরিক

আমার প্রশ্নের সাথে যুক্ত করার জন্য, আমি অবশ্যই পাসওয়ার্ড সংরক্ষণকারী ব্রাউজারগুলির সাথে কাজ করছি এবং আমি কখনও "এই সাইটের জন্য নয়" ক্লিক করেছি ... ব্রাউজারের সাথে এটি প্রযুক্তিগত সমস্যা যা এটি লগইন ফর্মটি সনাক্ত করে না, এটি নয় অপারেটরের ত্রুটি :-)


ভুলে যাবেন না যে সমস্ত ব্রাউজারগুলি পাসওয়ার্ড সংরক্ষণ করতে পারে না।
বুহাকে সিন্ধি

1
ব্রাউজারটি আপনার ব্যবহারকারীর / পাসটি সংরক্ষণ করার প্রস্তাব করেছে এবং আপনি "আর কখনও জিজ্ঞাসা করবেন না!" ?
clyfe

উত্তর:


72

আমি এই প্রশ্নের সম্পূর্ণ সমাধান খুঁজে পেয়েছি। (আমি এটি ক্রোম 27 এবং ফায়ারফক্স 21 এ পরীক্ষা করেছি)।

দুটি জিনিস জানতে হবে:

  1. ট্রিগার 'সেভ পাসওয়ার্ড', এবং
  2. সংরক্ষিত ব্যবহারকারীর নাম / পাসওয়ার্ড পুনরুদ্ধার করুন

1. ট্রিগার 'সংরক্ষণের পাসওয়ার্ড':

জন্য ফায়ারফক্স 21 , 'সংরক্ষণ পাসওয়ার্ড' আলোড়ন সৃষ্টি যখন এটি সনাক্ত একটি ফর্ম ইনপুট টেক্সট ক্ষেত্রের এবং ইনপুট পাসওয়ার্ড ক্ষেত্রের ধারণকারী জমা হয় যে হয়। সুতরাং আমাদের শুধু ব্যবহার করা প্রয়োজন

$('#loginButton').click(someFunctionForLogin);
$('#loginForm').submit(function(event){event.preventDefault();});

someFunctionForLogin()এজ্যাক্স লগইন করে এবং event.preventDefault()ফর্মটি জমা দেওয়ার কারণে আসল পুনঃনির্দেশকে অবরুদ্ধ করে যখন সাইন ইন পৃষ্ঠায় পুনরায় লোড / পুনঃনির্দেশ করে ।

আপনি যদি কেবল ফায়ারফক্সের সাথেই ডিল করেন তবে উপরের সমাধানটি যথেষ্ট তবে এটি ক্রোম ২ in তে কাজ করে না Then তারপরে আপনি ক্রোম ২ 27-এ 'পাসওয়ার্ড সংরক্ষণ করুন' কীভাবে ট্রিগার করবেন তা জিজ্ঞাসা করবেন।

জন্য ক্রোম 27 , 'সংরক্ষণ পাসওয়ার্ড' সূত্রপাত হয় পরে এটি রূপ, যার ইনপুট টেক্সট ক্ষেত্রের রয়েছে জমা দিয়ে পৃষ্ঠা থেকে আপনাকে পুনঃনির্দেশিত করা হয় অ্যাট্রিবিউট নাম = 'ব্যবহারকারী নাম' সঙ্গে এবং ইনপুট পাসওয়ার্ড ক্ষেত্রের অ্যাট্রিবিউট নাম = 'পাসওয়ার্ড' দিয়ে । সুতরাং, ফর্মটি জমা দেওয়ার কারণে আমরা পুনঃনির্দেশটিকে অবরুদ্ধ করতে পারি না তবে এজ্যাক্স লগইন করার পরে আমরা পুনঃনির্দেশটি তৈরি করতে পারি। (আপনি যদি এজাক্স লগইনটি পৃষ্ঠাটি পুনরায় লোড না করে বা কোনও পৃষ্ঠায় পুনর্নির্দেশ না করাতে চান তবে দুর্ভাগ্যক্রমে, আমার সমাধান কাজ করে না)) তারপরে, আমরা ব্যবহার করতে পারি

<form id='loginForm' action='signedIn.xxx' method='post'>
    <input type='text' name='username'>
    <input type='password' name='password'>
    <button id='loginButton' type='button'>Login</button>
</form>
<script>
    $('#loginButton').click(someFunctionForLogin);
    function someFunctionForLogin(){
        if(/*ajax login success*/) {
            $('#loginForm').submit();
        }
        else {
            //do something to show login fail(e.g. display fail messages)
        }
    }
</script>

টাইপ = 'বাটন' সহ বোতামটি বোতামটি ক্লিক করা হলে ফর্মটি জমা দেওয়া হবে না। তারপরে, আজাক্স লগইনের জন্য বোতামটিতে একটি ফাংশন বাঁধাই। অবশেষে, $('#loginForm').submit();সাইন ইন থাকা পৃষ্ঠাতে পুনঃনির্দেশগুলি কল করা । সাইন ইন থাকা পৃষ্ঠাটি যদি বর্তমান পৃষ্ঠা হয় তবে আপনি 'রিফ্রেশ' করতে বর্তমান পৃষ্ঠায় 'SignIn.xxx' প্রতিস্থাপন করতে পারেন।

এখন, আপনি দেখতে পাবেন যে ক্রোম 27 এর পদ্ধতিটি ফায়ারফক্স 21-এও কাজ করে So সুতরাং এটি ব্যবহার করা ভাল।

২. সংরক্ষিত ব্যবহারকারীর নাম / পাসওয়ার্ড পুনরুদ্ধার করুন:

আপনার যদি ইতিমধ্যে এইচটিএমএল হিসাবে হার্ড-কোডড লগইনফর্ম থাকে তবে লগইনফোর্মে সংরক্ষিত পাসওয়ার্ডটি পুনরুদ্ধার করতে কোনও সমস্যা পাবেন না।
যাইহোক, সংরক্ষিত ব্যবহারকারীর নাম / পাসওয়ার্ডটি লগইনফর্মটিকে গতিশীলভাবে তৈরি করতে আপনি js / jquery ব্যবহার করলে লগইনফর্মের সাথে আবদ্ধ হবে না, কারণ সংরক্ষিত ব্যবহারকারীর নাম / পাসওয়ার্ড তখনই দস্তাবেজ লোড হয়।
অতএব, আপনাকে লগইনফর্মটিকে এইচটিএমএল হিসাবে হার্ড-কোড করা এবং লগইনফর্মটিকে গতিশীলভাবে সরিয়ে / প্রদর্শন / আড়াল করতে js / jquery ব্যবহার করতে হবে।


মন্তব্য: আপনি যদি আজাক্স লগইন করেন তবে autocomplete='off'ট্যাগ ফর্মটিতে যুক্ত করবেন না

<form id='loginForm' action='signedIn.xxx' autocomplete='off'>

autocomplete='off' লগইন-এ পুনরুদ্ধারকারী ব্যবহারকারীর নাম / পাসওয়ার্ড তৈরি করবে ফর্ম ব্যর্থ কারণ আপনি এটি ব্যবহারকারীর নাম / পাসওয়ার্ডকে 'স্বতঃপূরণ' মঞ্জুর করেন না।


2
ক্রোমে 'ইভেন্ট.প্রিভেন্টডাফল্ট ()' দেখানো "পাসওয়ার্ড সংরক্ষণ করুন" প্রম্পটটি প্রতিরোধ করে, এই বাগটিটি
এম্কুরজ

অন্য যে কেউ এরজন্য হোঁচট খায়, আমি মনে করি তারা এটির জন্য একটি সমাধান প্রকাশ করছে: কোড. google.com/p/chromium/issues/detail?id=357696

2
প্রচুর ব্যবহারকারী ENTERফর্মটি জমা দেওয়ার জন্য কী ব্যবহার করছেন , যেহেতু আপনি prevented defaultযখন ব্যবহারকারী ফর্মটি জমা দিয়েছেন তখন কিছুই হবে না, এটি খারাপ ইউএক্স। keycodeজমা দেওয়ার সময় আপনি প্রবেশ কীটি পরীক্ষা করতে পারেন , তবে আপনি আবার ভিক্ষাবৃত্তিতে ফিরে পাবেন ...
ডেভিড রেইনবার্গার

2
ক্রোম 46 এর ভুল আচরণটি স্থির করেছে - আর কোনও কাজের ঘরের দরকার নেই। দেখুন stackoverflow.com/a/33113374/810109
mkurz

1
নির্ভরযোগ্যভাবে কাজ করে না, কিছু ব্রাউজার আপনি জাভাস্ক্রিপ্ট থেকে জমা দিলে "মনে রাখবেন" বৈশিষ্ট্যটি ট্রিগার করে না।
জাস্টামার্টিন

44

লগইন করতে একটি বোতাম ব্যবহার :

যদি আপনি ব্যবহার করে লগইন করতে type="button"কোনও onclickহ্যান্ডলারের সাথে ব্যবহার করেন ajaxতবে ব্রাউজারটি পাসওয়ার্ডটি সংরক্ষণ করার প্রস্তাব দিবে না

<form id="loginform">
 <input name="username" type="text" />
 <input name="password" type="password" />
 <input name="doLogin"  type="button" value="Login" onclick="login(this.form);" />
</form>

যেহেতু এই ফর্মটিতে জমা দেওয়ার বোতাম নেই এবং এতে কোনও ক্রিয়া ক্ষেত্র নেই, তাই ব্রাউজারটি পাসওয়ার্ডটি সংরক্ষণ করার প্রস্তাব দিবে না।


লগইনে জমা দেওয়ার বোতামটি ব্যবহার করে :

তবে আপনি যদি বোতামটি পরিবর্তন করে type="submit"জমা দেন এবং পরিচালনা করেন তবে ব্রাউজারটি পাসওয়ার্ডটি সংরক্ষণ করার প্রস্তাব দিবে

<form id="loginform" action="login.php" onSubmit="return login(this);">
 <input name="username" type="text" />
 <input name="password" type="password" />
 <input name="doLogin"  type="submit" value="Login" />
</form>

এই পদ্ধতিটি ব্যবহার করে, ব্রাউজারটির পাসওয়ার্ডটি সংরক্ষণ করার প্রস্তাব দেওয়া উচিত।


এখানে জাভাস্ক্রিপ্ট উভয় পদ্ধতিতে ব্যবহৃত:

function login(f){
    var username = f.username.value;
    var password = f.password.value;

    /* Make your validation and ajax magic here. */

    return false; //or the form will post your data to login.php
}

1
@ বিগুড কারণ এটি কার্যকর হয় যখন স্বীকৃত উত্তর না দেয় (আমার পক্ষে, কমপক্ষে)। ধন্যবাদ স্পটসন!
ডাবল এম

1
আইই হিসাবে আমার জন্য কাজ করে। আমি এখন তোমাকে চুমু দিতে পারি!
রেনরা

1
আমার জন্যও কাজ করেছেন .. :)
নবেল

1
এটিই সঠিক এবং সমস্যার সর্বাধিক মার্জিত সমাধান।
আরশ কাজেমি

এটি কাজ করে কারণ আমি কেবল ২ য় কোড অনুলিপি করেছি এবং এটিকে তদন্তের উপাদানটির মাধ্যমে লগইন পৃষ্ঠায় আটকান, সেই পৃষ্ঠাতে নতুনভাবে যুক্ত হওয়াতে ব্যবহারকারীর নাম / পাসওয়ার্ড লিখুন এবং লগইন টিপুন তারপর এটি আমাকে ব্যবহারকারী / পাসওয়ার্ড সংরক্ষণ করার অনুরোধ জানাবে। তারপরে আমি পৃষ্ঠাটি এবং ভয়েলা রিফ্রেশ করছি, এটি ইতিমধ্যে সংরক্ষিত ব্যবহারকারী / পাস চয়ন করতে অনুরোধ
জানায়

15

আমি নিজে এটির সাথে লড়াই করে যাচ্ছি এবং অবশেষে আমি বিষয়টি এবং এটি ব্যর্থ হওয়ার কারণ কী ছিল তা সন্ধান করতে সক্ষম হয়েছি।

আমার লগইন ফর্মটি পৃষ্ঠায় (ব্যাকবোন.জেএস ব্যবহার করে) গতিশীলভাবে ইনজেকশন করা হচ্ছিল এগুলি থেকেই এই সমস্ত ঘটেছিল। যত তাড়াতাড়ি আমি আমার লগইন ফর্মটি সরাসরি আমার সূচি। Html ফাইলে এম্বেড করার সাথে সাথে সমস্ত কিছুই কবজির মতো কাজ করে।

আমি মনে করি এটি ব্রাউজারের একটি বিদ্যমান লগইন ফর্ম রয়েছে তা সচেতন হওয়া উচিত, তবে যেহেতু আমার পৃষ্ঠায় গতিশীলভাবে ইনজেকশন দেওয়া হয়েছিল, তাই এটি কোনও "আসল" লগইন ফর্মের অস্তিত্ব নেই তা জানতেন না।


ক্রোম সংস্করণ 46 দিয়ে শুরু করে আপনি এখন গতিশীলভাবে ফর্মগুলিও ইনজেক্ট করতে পারেন এবং সেগুলি "আসল" লগইন ফর্ম হিসাবে স্বীকৃত হবে যা শংসাপত্রগুলি সংরক্ষণ করতে পারে। দেখুন stackoverflow.com/a/33113374/810109
mkurz

12

এই সমাধানটি কোডিংফর্মগুলিতে এরিকের দ্বারা পোস্ট করা আমার পক্ষে কাজ করেছে


এটি কেন অনুরোধ জানাবে না তার কারণ হ'ল সার্ভারে রিফ্রেশ করার জন্য ব্রাউজারটির ফিজিক্যালি পৃষ্ঠা দরকার। আপনি যে সামান্য কৌশলটি করতে পারেন তা হ'ল ফর্মটি সহ দুটি ক্রিয়া করা। আপনার অজ্যাক্স কোডটি কল করার জন্য প্রথম ক্রিয়াটি হ'ল অনসামিট। এছাড়াও একটি ফর্ম লক্ষ্য লুকানো iframe আছে।

কোড:

<iframe src="ablankpage.htm" id="temp" name="temp" style="display:none"></iframe>
<form target="temp" onsubmit="yourAjaxCall();">

এটির ফলে প্রম্পট প্রদর্শিত হবে কিনা তা দেখুন।

এরিক


Http://www.codingforums.com/showthread.php?t=123007 এ পোস্ট করা হয়েছে


5
একটি নোট হিসাবে, আমি খুঁজে পেয়েছি যে ফর্মটি নিজের কাছে জমা দেওয়া থাকলে ক্রোম 11 আপনার শংসাপত্রগুলি সংরক্ষণ করার প্রস্তাব দেয় না । সুতরাং আপনাকে actionকিছু ডামি পৃষ্ঠাতে সেট করতে হবে।
ব্যবহারকারী 123444555621

এটি একটি অনুরোধ হিসাবে পাসওয়ার্ডের পাসওয়ার্ডটি url এ প্রেরণ করবে। যদি পদ্ধতিটি পোস্টে পরিবর্তন করা হয় তবে ফায়ারফক্স (16) একটি নতুন ট্যাবে পূর্ববর্তী গোপন ফ্রেমটি খুলবে। অ্যান্ড্রয়েড 4 এ ক্রোমের ক্ষেত্রে একই: 4 :-(
স্টেফান.স

ক্রোম 46 এর ভুল আচরণটি স্থির করেছে - iframeআর কোনও কাজের ঘরের দরকার নেই। দেখুন stackoverflow.com/a/33113374/810109
mkurz

10

একটা ব্যাপার চূড়ান্ত সমস্ত ব্রাউজার বলপূর্বক সমাধান (পরীক্ষিত: Chrome 25, সাফারি 5.1, IE10, ফায়ারফক্স 16) পাসওয়ার্ড সংরক্ষণ করুন ব্যবহার করার জন্য জিজ্ঞাসা করতে jQuery এর এবং Ajax অনুরোধ:

জাতীয়:

$(document).ready(function() {
    $('form').bind('submit', $('form'), function(event) {
        var form = this;

        event.preventDefault();
        event.stopPropagation();

        if (form.submitted) {
            return;
        }

        form.submitted = true;

        $.ajax({
            url: '/login/api/jsonrpc/',
            data: {
                username: $('input[name=username]').val(),
                password: $('input[name=password]').val()
            },
            success: function(response) {
                form.submitted = false;
                form.submit(); //invoke the save password in browser
            }
        });
    });
});

এইচটিএমএল:

<form id="loginform" action="login.php" autocomplete="on">
    <label for="username">Username</label>
    <input name="username" type="text" value="" autocomplete="on" />
    <label for="password">Password</label>
    <input name="password" type="password" value="" autocomplete="on" />
   <input type="submit" name="doLogin" value="Login" />
</form>

কৌশলটি ফর্মটি তার নিজস্ব উপায়ে (ইভেন্ট.স্টপপ্রপাগেশন ()) জমা দেওয়ার পরিবর্তে আপনার নিজের কোড ($ .ajax ()) প্রেরণ করতে এবং এজ্যাক্সের সাফল্যের কলব্যাকে ফর্মটি আবার জমা দিন যাতে ব্রাউজারটি এটি ধরে এবং প্রদর্শিত হবে পাসওয়ার্ড সংরক্ষণের জন্য অনুরোধ। আপনি কিছু ত্রুটি হ্যান্ডলার ইত্যাদি যুক্ত করতে পারেন

আশা করি এটি কারও সাহায্য করেছে helped


7
এটি আসলে একটি HTTP গেট কি করতে হবে login.php?username=username&password=passwordযা প্রথম স্থানে পাসওয়ার্ড সংরক্ষণ পুরো উদ্দেশ্য defats
Adaptabi

Wooooooooooooooooooooooooooooooooooooooooooooooh! যা আমার পক্ষে কাজ করেছে;) অনেক ধন্যবাদ!
হার্ডিক ঠাকুর

1
হাঁ, যোগ event listenerগঠন এবং যোগ করার জন্য event.preventDefault()প্লাসevent.stopPropagation()
Densi Tensy

7

আমি স্পেটসনের উত্তরের চেষ্টা করেছিলাম কিন্তু এটি ক্রোম 18 এ আমার পক্ষে কাজ করে নি work

function getSessions() {
    $.getJSON("sessions", function (data, textStatus) {
        // Do stuff
    }).error(function () { $('#loginForm').fadeIn(); });
}
$('form', '#loginForm').submit(function (e) {
    $('#loginForm').fadeOut();
}); 
$('#loginframe').on('load', getSessions);
getSessions();

এইচটিএমএল:

<div id="loginForm">
    <h3>Please log in</h3>
    <form action="/login" method="post" target="loginframe">
            <label>Username :</label>
            <input type="text" name="login" id="username" />
            <label>Password :</label>
            <input type="password" name="password" id="password"/>
            <br/>
            <button type="submit" id="loginB" name="loginB">Login!</button>
    </form>
</div>
<iframe id="loginframe" name="loginframe"></iframe>

getSessions () একটি AJAX কল করে এবং যদি এটি ব্যর্থ হয় তবে লগইনফর্ম ডিভ দেখায়। (যদি ব্যবহারকারী প্রমাণীকৃত না হয় তবে ওয়েব পরিষেবা 403 ফেরত আসবে)

পাশাপাশি এফএফ এবং আইই 8-তে কাজ করার জন্য পরীক্ষিত।


আমি ক্রোমে এই পদ্ধতিটি চেষ্টা করেছি এবং অ্যাকশন পৃষ্ঠাটি ( /loginআপনার উদাহরণে) কিছু পাঠ্য বা অন্য দৃশ্যমান সামগ্রী ফিরে না আসা পর্যন্ত এটি কাজ করবে না ।
স্টিফেন বাঞ্চ 3

1
ক্রোম 46 এর ভুল আচরণটি স্থির করেছে - iframeআর কোনও কাজের ঘরের দরকার নেই। দেখুন stackoverflow.com/a/33113374/810109
mkurz

4

আপনার ফর্মটি লগইন ফর্ম এটি ব্রাউজারটি সনাক্ত করতে সক্ষম হতে পারে। পূর্ববর্তী প্রশ্নের আলোচনার কয়েকটি অনুসারে , একটি ব্রাউজার দেখতে এমন ফর্ম ক্ষেত্রগুলির সন্ধান করে <input type="password">। আপনার পাসওয়ার্ড ফর্ম ক্ষেত্র কি এর মতো বাস্তবায়িত হয়েছে?

সম্পাদনা: নীচের আমি মনে করি ফায়ারফক্স দ্বারা পাসওয়ার্ড সনাক্ত করে আপনার প্রশ্নের উত্তর form.elements[n].type == "password"(সমস্ত ফর্ম উপাদানের মাধ্যমে iterating) এবং তারপর অবিলম্বে পাসওয়ার্ড ক্ষেত্র (আরও তথ্য সামনে টেক্সট ক্ষেত্রের জন্য ফর্ম উপাদানগুলির মধ্যে পিছন অনুসন্ধান করে ব্যবহারকারীর নাম ক্ষেত্র সনাক্ত করে এখানে )। আমি যা বলতে পারি তা থেকে আপনার লগইন ফর্মটির একটি অংশ হওয়া দরকার <form>বা ফায়ারফক্স এটি সনাক্ত করতে পারে না।


1
এটি অনুরূপ, হ্যাঁ, ধন্যবাদ আমি এটি অফিশিয়াল উত্তর হিসাবে গ্রহণ করব যেহেতু এটি আমরা যতই কাছাকাছি পাচ্ছি। হতাশার কিছু এখানে: আমি দেখতে পাচ্ছি না (ওয়েবে কোথাও) একটি সাধারণ ব্লগ পোস্ট যা বলে যে "এখানে যে নিয়মগুলি ব্রাউজারগুলি আপনি পূরণ করছেন তা লগইন ফর্ম কিনা তা সনাক্ত করতে ব্যবহার করা হয়, তাই তারা প্রস্তাব দিতে পারে ব্যবহারকারীর পাসওয়ার্ড সংরক্ষণ করতে। " এটিকে কিছুটা কালো যাদু হিসাবে বিবেচনা করা (এবং মজিলাকে বিবেচনা করা, কমপক্ষে, এটি মুক্ত উত্স), আপনি কি ভাবেন যে কেউ কেবল হিউরিস্টিক্স প্রকাশ করবেন।
এরিক

(এবং একইভাবে, আমার জন্য আমার লগইন ফর্মটিকে "ইঙ্গিত" দেওয়ার কোনও উপায় বলে মনে হচ্ছে না তাই ব্রাউজারটি এটি লগইন ফর্ম বলে। আবারও আশ্চর্য হ'ল ওয়েবে এটি আরও ভাল নথিভুক্ত নয়। আমার ধারণা আমার পরিবর্তনগুলি ফর্ম ক্ষেত্রের নাম এবং সামগ্রিক এইচটিএমএল কাঠামোতে হবে এবং তারপরে আমি আশা করি [!] যা সমস্যার সমাধান করে))
এরিক

ঠিক আছে, ভাগ্য নেই আমি কিছুটা ভিন্ন কোণ থেকে এটি পৌঁছে দিয়ে একটি নতুন প্রশ্ন জিজ্ঞাসা করেছি: stackoverflow.com/questions/2398763/…
এরিক

3

সাধারণ 2020 এপ্রোচ

এটি স্বয়ংক্রিয়ভাবে স্বয়ংক্রিয়ভাবে সক্ষম হবে এবং ব্রাউজারগুলিতে পাসওয়ার্ড সংরক্ষণ করবে।

  • autocomplete="on" (ফর্ম)
  • autocomplete="username" (ইনপুট, ইমেল / ব্যবহারকারীর নাম)
  • autocomplete="current-password" (সংকেতশব্দ দিন)
<form autocomplete="on">
  <input id="user-text-field" type="email" autocomplete="username"/>
  <input id="password-text-field" type="password" autocomplete="current-password"/>
</form>

অ্যাপলের ডকুমেন্টেশনে আরও দেখুন: একটি HTML ইনপুট উপাদানটিতে পাসওয়ার্ড অটোফিল সক্ষম করা


4
এফওয়াইআইতে এটি ফর্ম জমা দেওয়ার প্রয়োজন বলে মনে হচ্ছে (এক্সএইচআর ব্যবহার করতে পারে না preventDefault) এবং কেবলমাত্র একটি একক পাসওয়ার্ড ক্ষেত্র (ডিজিটাল-নিরাপদ ধরণের অ্যাপ্লিকেশন) থাকলে এটি কাজ করবে না। এই অনুসন্ধানগুলি যে কারও পক্ষে দরকারী মনে হতে পারে সেগুলি ভাগ করে নেওয়া।
টোম হ্যাবলবাউয়ার

2

আমি এই থ্রেডের বিভিন্ন উত্তরগুলি পড়তে অনেক সময় ব্যয় করেছি এবং আমার জন্য এটি আসলে কিছুটা আলাদা (সম্পর্কিত, তবে আলাদা) ছিল। মোবাইল সাফারি (আইওএস ডিভাইস) এ, পৃষ্ঠাটি লোড হওয়ার পরে যদি লগইন ফর্মটি লুকানো থাকে তবে প্রম্পটটি উপস্থিত হবে না (আপনি ফর্মটি দেখানোর পরে তা জমা দিন)। আপনি নিম্নলিখিত কোডটি দিয়ে পরীক্ষা করতে পারেন, যা পৃষ্ঠা লোডের 5 সেকেন্ড পরে ফর্মটি প্রদর্শন করে। জেএস এবং ডিসপ্লেটি সরান: কোনওটি নয় এবং এটি কাজ করে না। আমি এখনও এর সমাধান খুঁজে পাচ্ছি না, অন্য কারও ক্ষেত্রে একই সমস্যা রয়েছে এবং এর কারণটি সনাক্ত করতে না পারলে কেবল পোস্ট করা হয়েছে।

জাতীয়:

$(function() {
  setTimeout(function() {
    $('form').fadeIn();
  }, 5000);
});

এইচটিএমএল:

<form method="POST" style="display: none;">
  <input name='email' id='email' type='email' placeholder='email' />
  <input name='password' id='password' type='password' placeholder='password' />
  <button type="submit">LOGIN</button>
</form>

2

ইতিমধ্যে উত্তরগুলির কোনওটিই এটি পরিষ্কার করে দেয় না আপনি পাসওয়ার্ডটি সংরক্ষণ করার জন্য অনুরোধ করতে HTML5 ইতিহাস API ব্যবহার করতে পারেন।

প্রথমত, আপনাকে অবশ্যই নিশ্চিত করতে হবে যে আপনার কাছে <form>পাসওয়ার্ড এবং ইমেল বা ব্যবহারকারীর নাম সহ কমপক্ষে একটি উপাদান রয়েছে। আপনি যতক্ষণ না সঠিক ইনপুট প্রকারগুলি (পাসওয়ার্ড, ইমেল বা ব্যবহারকারীর নাম) ব্যবহার করেন ততক্ষণ বেশিরভাগ ব্রাউজারগুলি এটিকে স্বয়ংক্রিয়ভাবে পরিচালনা করে। তবে নিশ্চিত হওয়ার জন্য, প্রতিটি ইনপুট উপাদানগুলির জন্য স্বতঃপূরণ মানগুলি সঠিকভাবে সেট করুন।

আপনি এখানে স্বতঃসমম্পূর্ণ মানগুলির একটি তালিকা পেতে পারেন: https://developer.mozilla.org/en-US/docs/Web/HTML/Atributes/autocomplete

যেগুলি দরকার সেগুলি হলো: username, emailএবংcurrent-password

তারপরে আপনার দুটি সম্ভাবনা রয়েছে:

  • জমা দেওয়ার পরে আপনি যদি অন্য কোনও ইউআরএল নেভিগেট করেন তবে বেশিরভাগ ব্রাউজারগুলি পাসওয়ার্ডটি সংরক্ষণ করার অনুরোধ জানাবে।
  • আপনি যদি অন্য কোনও ইউআরএলে পুনঃনির্দেশ করতে না চান বা পৃষ্ঠাটি পুনরায় লোড করতে না চান (যেমন একটি একক পৃষ্ঠার অ্যাপ্লিকেশন)। আপনার ফর্মের জমা দেওয়ার হ্যান্ডলারে ইভেন্ট ডিফল্টগুলি (e.preventDefault ব্যবহার করে) কেবল প্রতিরোধ করুন। আপনি আপনার একক পৃষ্ঠার অ্যাপ্লিকেশনটির ভিতরে 'নেভিগেট' ইঙ্গিত করতে ইতিহাসের কোনও কিছুতে চাপ দিতে আপনি HTML5 ইতিহাস API ব্যবহার করতে পারেন। ব্রাউজারটি এখন পাসওয়ার্ড এবং ব্যবহারকারীর নাম সংরক্ষণ করার অনুরোধ জানাবে।
history.pushState({}, "Your new page title");

আপনি পৃষ্ঠার ইউআরএলও পরিবর্তন করতে পারেন তবে পাসওয়ার্ডটি সংরক্ষণ করার জন্য অনুরোধ করার প্রয়োজন নেই:

history.pushState({}, "Your new page title", "new-url");

ডকুমেন্টেশন: https://developer.mozilla.org/en-US/docs/Web/API/History/pushState

এর অতিরিক্ত সুবিধা রয়েছে যা আপনি যদি ব্যবহারকারী ভুলভাবে পাসওয়ার্ডটি প্রবেশ করে তবে ব্রাউজারটিকে পাসওয়ার্ডটি সংরক্ষণ করতে জিজ্ঞাসা করতে ব্রাউজারকে আটকাতে পারবেন। মনে রাখবেন যে কিছু ব্রাউজারে ব্রাউজার সর্বদা শংসাপত্রগুলি সংরক্ষণ করতে বলবে, আপনি যখন প্রিভিভেন্টডাফল্ট কল করেন এবং ইতিহাস API ব্যবহার করেন না।

আপনি যদি ব্রাউজার ইতিহাস দূরে নেভিগেট করতে এবং / অথবা সংশোধন করতে না চান তবে আপনি পরিবর্তে স্টপ ব্যবহার করতে পারেন (এটিও কাজ করে)।


এই 2020 উত্তর! আমাকে history.pushState({}, null "Your new page title");কোনও নেভিগেশন ছাড়াই url পরিবর্তন করতে ব্যবহার করতে হয়েছিল
ডেলকন

1

নিম্নলিখিত কোড পরীক্ষা করা হয়

  • ক্রোম 39.0.2171.99 মি: ওয়ার্কিং
  • অ্যান্ড্রয়েড ক্রোম 39.0.2171.93: কাজ করছে
  • অ্যান্ড্রয়েড স্টক-ব্রাউজার (অ্যান্ড্রয়েড ৪.৪): কাজ করছে না
  • ইন্টারনেট এক্সপ্লোরার 5+ (অনুকরণযুক্ত): কাজ করা
  • ইন্টারনেট এক্সপ্লোরার 11.0.9600.17498 / আপডেট-সংস্করণ: 11.0.15: কাজ করা
  • ফায়ারফক্স 35.0: কাজ করছে

জেএস-ফিডল:
http://jsfiddle.net/ocozggqu/

পোস্ট-কোড:

// modified post-code from /programming/133925/javascript-post-request-like-a-form-submit
function post(path, params, method)
{
    method = method || "post"; // Set method to post by default if not specified.

    // The rest of this code assumes you are not using a library.
    // It can be made less wordy if you use one.

    var form = document.createElement("form");
    form.id = "dynamicform" + Math.random();
    form.setAttribute("method", method);
    form.setAttribute("action", path);
    form.setAttribute("style", "display: none");
    // Internet Explorer needs this
    form.setAttribute("onsubmit", "window.external.AutoCompleteSaveForm(document.getElementById('" + form.id + "'))");

    for (var key in params)
    {
        if (params.hasOwnProperty(key))
        {
            var hiddenField = document.createElement("input");
            // Internet Explorer needs a "password"-field to show the store-password-dialog
            hiddenField.setAttribute("type", key == "password" ? "password" : "text");
            hiddenField.setAttribute("name", key);
            hiddenField.setAttribute("value", params[key]);

            form.appendChild(hiddenField);
        }
    }

    var submitButton = document.createElement("input");
    submitButton.setAttribute("type", "submit");

    form.appendChild(submitButton);

    document.body.appendChild(form);

    //form.submit(); does not work on Internet Explorer
    submitButton.click(); // "click" on submit-button needed for Internet Explorer
}

মন্তব্য

  • গতিশীল লগইন-ফর্মগুলির জন্য একটি কল window.external.AutoCompleteSaveFormপ্রয়োজন
  • স্টোর-পাসওয়ার্ড-কথোপকথন দেখানোর জন্য ইন্টারনেট এক্সপ্লোরারের একটি "পাসওয়ার্ড"-ফিল্ড প্রয়োজন
  • ইন্টারনেট এক্সপ্লোরারকে সাবমিট-বোতামে ক্লিক করা প্রয়োজন বলে মনে হচ্ছে (এটি একটি নকল ক্লিক হলেও)

এখানে একটি নমুনা এজাক্স লগইন-কোড:

function login(username, password, remember, redirectUrl)
{
    // "account/login" sets a cookie if successful
    return $.postJSON("account/login", {
        username: username,
        password: password,
        remember: remember,
        returnUrl: redirectUrl
    })
    .done(function ()
    {
        // login succeeded, issue a manual page-redirect to show the store-password-dialog
        post(
            redirectUrl,
            {
                username: username,
                password: password,
                remember: remember,
                returnUrl: redirectUrl
            },
            "post");
    })
    .fail(function ()
    {
        // show error
    });
};

মন্তব্য

  • "অ্যাকাউন্ট / লগইন" সফল হলে একটি কুকি সেট করে
  • পৃষ্ঠা-পুনর্নির্দেশ (জেএস-কোড দ্বারা শুরু করা "ম্যানুয়ালি") প্রয়োজনীয় মনে হচ্ছে। আমি একটি আইফ্রেমে-পোস্ট পরীক্ষাও করেছি, তবে আমি তাতে সফল হইনি।

1

প্রোটোটাইপ.জেএস ব্যবহারকারীদের জন্য আমি প্রোটোটাইপ ব্যবহার করে মোটামুটি মার্জিত সমাধান (বা হ্যাক, যা কিছু ফিট করে) পেয়েছি, প্রোটোটাইপ ব্যবহার করে সর্বশেষ হোল্ডআউটগুলির মধ্যে একটি being সম্পর্কিত jQuery পদ্ধতিগুলির একটি সহজ প্রতিস্থাপনের কৌশলটি করা উচিত।

প্রথমে নিশ্চিত হয়ে নিন যে কোনও <form>ট্যাগ রয়েছে এবং একটি শ্রেণিবদ্ধ নাম সহ একটি সাবমিট বাটন যা পরে উল্লেখ করা যেতে পারে (এই ক্ষেত্রে faux-submit) যা display:noneনীচের চিত্রের মতো একটি স্টাইল সেট করে একটি উপাদানটির ভিতরে বাসা বেঁধেছে :

<form id="login_form" action="somewhere.php" method="post">
    <input type="text" name="login" />
    <input type="password" name="password" />
    <div style="display:none">
        <input class="faux-submit" type="submit" value="Submit" />
    </div>
    <button id="submit_button">Login</button>
</form>

তারপরে এর জন্য একটি ক্লিক পর্যবেক্ষক তৈরি করুন button, যা ফর্মটিকে চিত্রিত হিসাবে "জমা" দেবে:

$('submit_button').observe('click', function(event) {
    $('login_form').submit();
});

তারপরে submitইভেন্টের জন্য শ্রোতা তৈরি করুন এবং এটি বন্ধ করুন। এটি লুকানো ইনপুট বোতামের শ্রেণীর সাথে event.stop()আবৃত না Event.findElementহলে (উপরে যেমন faux-submit) ডম-এ সমস্ত জমা দেওয়ার ইভেন্টগুলি বন্ধ করে দেবে :

document.observe('submit', function(event) {
    if (event.findElement(".faux-submit")) { 
        event.stop();
    }
});

এটি ফায়ারফক্স 43 এবং ক্রোম 50 এ কাজ করার জন্য পরীক্ষিত।


0

আপনার সাইটটি সম্ভবত ইতিমধ্যে সেই তালিকায় রয়েছে যেখানে ব্রাউজারটিকে বলা হয়েছে একটি পাসওয়ার্ড সংরক্ষণের জন্য প্রম্পট না করতে। ফায়ারফক্সে, বিকল্পগুলি -> সুরক্ষা -> সাইটের পাসওয়ার্ড মনে রাখবেন [চেক বাক্স] - ব্যতিক্রমগুলি [বোতাম]


0

@ মিশল রোহারিকের উত্তরে কিছুটা বেশি তথ্য যুক্ত করুন।

যদি আপনার অজ্যাক্স কলটি ফিরে আসে ইউআরএল, আপনার ফর্মটি কল করার আগে সেই ইউআরএলের ফর্ম ক্রিয়া বৈশিষ্ট্যটি পরিবর্তন করতে jquery ব্যবহার করা উচিত ub জমা দিন

প্রাক্তন।

$(form).attr('action', ReturnPath);
form.submitted = false;
form.submit(); 

0

আমারও একই সমস্যা ছিল, এজ্যাক্স দিয়ে লগইন করা হয়েছিল, তবে ব্রাউজারগুলি (ফায়ারফক্স, ক্রোম, সাফারি এবং আইই 7-10) এজ্যাক্সের সাথে ফর্ম (# লগিনফর্ম) জমা দিলে পাসওয়ার্ড সংরক্ষণের প্রস্তাব দিবে না।

একটি সমাধান হিসাবে আমি আজাক্স দ্বারা জমা দেওয়া ফর্মটি লুকিয়ে জমা ইনপুট (# লগিনফর্মহিডেনসবিট) যুক্ত করেছি এবং এজ্যাক্স কল সাফল্যের সাথে ফিরে আসার পরে আমি লুকিয়ে জমা দেওয়া ইনপুটটিতে একটি ক্লিক ট্রিগার করব। পৃষ্ঠাটি যে কোনও উপায়ে রিফ্রেশ করার প্রয়োজন। ক্লিকটি এর সাথে ট্রিগার করা যেতে পারে:

jQuery('#loginFormHiddenSubmit').click();

আমি কেন লুকানো জমা বোতাম যুক্ত করেছি কারণ হ'ল:

jQuery('#loginForm').submit();

আইইতে পাসওয়ার্ড সংরক্ষণের প্রস্তাব দেবে না (যদিও এটি অন্যান্য ব্রাউজারগুলিতে কাজ করেছে)।


-1

প্রতিটি ব্রাউজারে (যেমন IE 6) শংসাপত্রগুলি মনে রাখার বিকল্প নেই।

আপনি যা করতে পারেন তা হ'ল (একবার ব্যবহারকারী সফলভাবে লগ ইন করুন) কুকির মাধ্যমে ব্যবহারকারীর তথ্য সংরক্ষণ করুন এবং "এই মেশিনে আমাকে মনে রাখুন" বিকল্পটি অর্জন করুন। এইভাবে, ব্যবহারকারী যখন আবার আসবে (এমনকি তিনি লগইন করে থাকলেও), আপনার ওয়েব অ্যাপ্লিকেশনটি কুকিটি পুনরুদ্ধার করতে এবং ব্যবহারকারীর তথ্য (ব্যবহারকারী আইডি + সেশন আইডি) পেতে এবং তাকে কাজ চালিয়ে যাওয়ার অনুমতি দিতে পারে।

আশা করি এটি পরামর্শমূলক হতে পারে। :-)


আমি কোনও কুকিতে ব্যবহারকারীর তথ্য সংরক্ষণ করব না, কমপক্ষে সংবেদনশীল কিছু।
জ্যাক মার্কেটি

আমি ব্যবহারকারীর পাসওয়ার্ড সংরক্ষণ করতে চাইনি। স্পষ্টতই আপনাকে useful garbageব্যবহারকারীর তথ্য সনাক্ত করতে কীভাবে তৈরি করতে হবে তাতে আপনাকে বেশ সৃজনশীল হতে হবে । এমনকি আপনাকে স্বীকৃতি দেওয়ার জন্য এসও কুকিতে তথ্য সঞ্চয় করে।
বুহাকে সিন্ধি

যথেষ্ট পরিমাণে ন্যায্য, তবে তবুও আপনি যতটা পারেন এনক্রিপ্ট করব।
জ্যাক মার্চেটি

@ জ্যাকমারচেটি এটির ক্লায়েন্টের পক্ষে এনক্রিপ্ট করা একটি খারাপ (এবং বিন্দু অকেজো) ধারণা হবে। যেহেতু এনক্রিপ্ট করার জন্য প্রয়োজনীয় কোডটি দৃশ্যমান, তাই যে কেউ .js ফাইলটি আবিষ্কার করতে এবং এটি ডিক্রিপ্ট করতে পারে। এর অর্থ হল যে আপনার কোনও কুকিতে ডেটা সংরক্ষণ করা উচিত নয়
ইউনিভার্সাল ইলেক্ট্রিসিটি

-1

সত্য কথাটি, আপনি ব্রাউজারকে জিজ্ঞাসা করতে বাধ্য করতে পারবেন না। আমি নিশ্চিত যে অনুমান করার জন্য ব্রাউজারের নিজস্ব নিজস্ব অ্যালগরিদম রয়েছে যেমন আপনি কোনও ব্যবহারকারীর নাম / পাসওয়ার্ড প্রবেশ করিয়েছেন যেমন একটি ইনপুট খুঁজছেন type="password"তবে আপনি ব্রাউজারকে জোর করার জন্য কোনও কিছু সেট করতে পারবেন না।

আপনি, অন্যদের পরামর্শ অনুসারে, কুকিতে ব্যবহারকারীর তথ্য যুক্ত করতে পারেন। আপনি যদি এটি করেন তবে কমপক্ষে এটিকে আরও ভালভাবে এনক্রিপ্ট করুন এবং তাদের পাসওয়ার্ড সংরক্ষণ করবেন না। সম্ভবত তাদের ব্যবহারকারীর নাম সর্বাধিক সংরক্ষণ করুন।


এবং আপনি কুকিজ পরামর্শ?
বুহাকে সিন্ধি

যদিও আপনি এগুলিতে যা সঞ্চয় করেন তা এনক্রিপ্ট করতে বলি।
জ্যাক মার্কেটি

1
কুকিজ? হ'ল অপেক্ষা করা খারাপ ধারণা
নাইটস্কাইকোড

-1

আপনি ডায়ালগটি ফর্মের সাথে সংযুক্ত করতে পারেন, সুতরাং এই সমস্ত ইনপুট একটি ফর্মের মধ্যে রয়েছে। অন্য জিনিসটি হ'ল পাসওয়ার্ডের পাঠ্য ক্ষেত্রটি ব্যবহারকারীর নাম পাঠ্য ক্ষেত্রের ঠিক পরে।


-1

এটি আমার পক্ষে আরও ভাল কাজ করে, কারণ এটি 100% আজাক্সড এবং ব্রাউজারটি লগইন সনাক্ত করে।

<form id="loginform" action="javascript:login(this);" >
 <label for="username">Username</label>
 <input name="username" type="text" value="" required="required" />
 <label for="password">Password</label>
 <input name="password" type="password" value="" required="required" />
 <a href="#" onclick="document.getElementById("loginform").submit();"  >Login</a>
</form>

-2

কুকি ব্যবহার করা সম্ভবত এটির সর্বোত্তম উপায়।

'আমাকে মনে রাখবেন?' এর জন্য আপনার একটি চেকবক্স থাকতে পারে? এবং ফর্মটিতে // ব্যবহারকারীর লগইন // তথ্য সংরক্ষণ করার জন্য একটি কুকি তৈরি করতে হবে। সম্পাদনা: ব্যবহারকারী সেশন তথ্য

একটি কুকি তৈরি করতে, আপনাকে পিএইচপি দিয়ে লগইন ফর্মটি প্রক্রিয়া করতে হবে।

আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.