অনলাইন / অফলাইন ইভেন্ট ক্রস ব্রাউজার কীভাবে সনাক্ত করবেন?


111

HTML5 অনলাইন এবং অফলাইন ইভেন্টগুলি ব্যবহার করে যখন ব্রাউজারটি অফলাইন হয় তখন আমি সঠিকভাবে সনাক্ত করার চেষ্টা করছি।

আমার কোডটি এখানে:

<script>
    // FIREFOX
    $(window).bind("online", applicationBackOnline); 
    $(window).bind("offline", applicationOffline);

    //IE
    window.onload = function() {
        document.body.ononline = IeConnectionEvent;
        document.body.onoffline = IeConnectionEvent;
    } 
</script>

আমি যখন ফায়ারফক্স বা আইই উভয়টিতে কেবল "ওয়ার্ক অফলাইন" হিট করব তখন এটি ঠিকঠাক কাজ করে, তবে আমি যখন কেবল তারটিকে প্লাগ করি তখন এটি এলোমেলোভাবে কাজ করে।

এই পরিবর্তনটি সনাক্ত করার সর্বোত্তম উপায় কী? আমি টাইমআউটগুলির সাথে এজাক্স কলগুলি পুনরাবৃত্তি করা এড়াতে চাই।


2
আমি ট্রেফেক্সের সাথে একমত, তবে আমি এটি যুক্ত করতে চাই যে সংযোগ সনাক্তকরণ সমর্থনটি বেশিরভাগ অ্যাপ্লিকেশনগুলির পক্ষে সর্বোত্তম is এমন কোনও পদ্ধতির উপর নির্ভর করা যা সংযোগটি উন্মুক্ত কিনা তা শারীরিকভাবে পরীক্ষা করে না যা সত্যই সঠিক ফলাফলের গ্যারান্টি দিতে পারে না।
ম্যাটবাস্ট

আপনার উপদেশের জন্য ধন্যবাদ. সুতরাং আপনি Ajax পদ্ধতি সুপারিশ করবেন? অর্থাত। টাইমআউট সহ এক্সএইচআর কল প্রেরণ চালিয়ে যেতে চান?
পিয়ের ডুপলুই

ফায়ারফক্সের (এবং আইই এবং অপেরার) প্রয়োগটি ভুল। এখানে এই প্রভাবটি সম্পর্কে আমার মন্তব্য দেখুন: bugzilla.mozilla.org/show_bug.cgi?id=654579#c9
thewoolleyman

4
আপনি কেবলমাত্র এই উদ্দেশ্যে তৈরি একটি ওপেন-সোর্স লাইব্রেরি, অফলাইন.js দেখতে চাইতে পারেন ।
অ্যাডাম

উত্তর:


70

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

অনুমান থেকে:

ব্যবহারকারী এজেন্ট অবশ্যই অফলাইনে থাকলে (নেটওয়ার্ক থেকে সংযোগ বিচ্ছিন্ন) মিথ্যা প্রত্যাবর্তন করে। ব্যবহারকারী এজেন্ট অনলাইনে থাকতে পারলে সত্যটি ফেরত দেয়।

অনলাইন এবং অফলাইনে ইভেন্টগুলি এই বৈশিষ্ট্যের মান পরিবর্তিত হওয়ার পরে বরখাস্ত করা হয়।

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

শেষ পর্যন্ত, স্পষ্ট নোটগুলি:

এই বৈশিষ্ট্যটি সহজাতভাবে অবিশ্বাস্য। কোনও কম্পিউটার ইন্টারনেট অ্যাক্সেস না করেই কোনও নেটওয়ার্কের সাথে সংযুক্ত হতে পারে।


23
সংযোগটি হারিয়ে গেলে কেবল ক্রোম নেভিগেটর.অনলাইন সঠিকভাবে সেট করে। আপনি ইন্টারনেট সংযোগ সরিয়ে দিলে সাফারি এবং ফায়ারফক্স উভয়ই পতাকাটিকে মিথ্যাতে সেট করে না।
chovy

2
@ চবি এবং এখন কেমন? আমি ইদানীং এটি ফায়ারফক্স / ক্রোমে পরীক্ষা করেছি এবং প্রত্যাশিত ফলাফল পেয়েছি, যখন দেখি যে পতাকাটি সেট করা হচ্ছে, যখন আমি বন্ধ করব এবং ইন্টারনেট সংযোগ চালু করব ..
জেমস কাজিটা

12
আজ 1/31/2017 আমি ওএসএক্স ক্রোম 55.0.2883.95, সাফারি 10.0.3 এবং এফএফ 50.1.0 খুললাম। উইন্ডো.নভিগেটর.অনলাইনগুলি সমস্তই দুর্দান্ত বলে মনে হচ্ছে যখন আমি আমার নেটওয়ার্কে থাকি, তবে আমার রাউটার থেকে কর্ডটি সরিয়ে ফেলেছি। এগুলি সমস্ত অফলাইনে সঠিকভাবে সনাক্ত করেছে।
nycynik

3
নেভিগেটর.অনলাইন সমস্ত বড় ব্রাউজার জুড়ে সমর্থিত (এবং কিছু সময়ের জন্য এটি হয়েছে): caniuse.com/#feat=online-status
রাফায়েল

@ রাফায়েলল্ডার আজকের হিসাবে সঠিক, তবে এই উত্তরটি ২০১১ জানুয়ারীতে লেখা হয়েছিল!
রেবেকা

34

প্রধান ব্রাউজার বিক্রেতারা "অফলাইন" অর্থ কী তার চেয়ে আলাদা।

আপনি স্বয়ংক্রিয়ভাবে "অফলাইনে" গেলে Chrome এবং সাফারি সনাক্ত করবে - এর অর্থ এই যে আপনি যখন নিজের নেটওয়ার্ক কেবলটি আনপ্লাগ করেন তখন "অনলাইন" ইভেন্ট এবং বৈশিষ্ট্যগুলি স্বয়ংক্রিয়ভাবে ফায়ার হবে।

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

ফায়ারফক্স / মজিলা আচরণের জন্য বৈধ যুক্তি রয়েছে, যা এই বাগ রিপোর্টের মন্তব্যে বর্ণিত হয়েছে:

https://bugzilla.mozilla.org/show_bug.cgi?id=654579

তবে, প্রশ্নের উত্তর দেওয়ার জন্য - আসলে নেটওয়ার্ক সংযোগ আছে কিনা তা সনাক্ত করতে আপনি অনলাইন / অফলাইন ইভেন্ট / সম্পত্তির উপর নির্ভর করতে পারবেন না।

পরিবর্তে, আপনাকে অবশ্যই বিকল্প পদ্ধতি ব্যবহার করতে হবে।

এই মজিলা বিকাশকারী নিবন্ধের "নোটস" বিভাগটি দুটি বিকল্প পদ্ধতির লিঙ্ক সরবরাহ করে:

https://developer.mozilla.org/en/Online_and_offline_events

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

"অ্যাপক্যাশ ত্রুটির ইভেন্টগুলির জন্য শুনছি" পদ্ধতির উদাহরণের সাথে এই লিঙ্কগুলি:

http://www.html5rocks.com/en/mobile/workingoffthegrid/#toc-appcache

... এবং "এক্সএমএলএইচটিএইচপিপি ব্যর্থতার পক্ষে শুনছি" পদ্ধতির উদাহরণ:

http://www.html5rocks.com/en/mobile/workingoffthegrid/#toc-xml-http-request

এইচটিএইচ, - চাদ


1
ফায়ারফক্স 41 দিয়ে শুরু হচ্ছে: updates this property when the OS reports a change in network connectivity on Windows, Linux, and OS X.(আপনি যে দস্তাবেজের উল্লেখ করেছেন সে অনুসারে)। সুতরাং এটি শুধুমাত্র অফলাইন যদি আপনি ব্রাউজার সাথে এসেছেন ব্রাউজিং "অফলাইন মোড" না
শহরবাসী

17

আজ একটি মুক্ত উত্স জাভাস্ক্রিপ্ট লাইব্রেরি এই কাজ করে: এটি বলা হয় Offline.js

আপনার ব্যবহারকারীদের কাছে স্বয়ংক্রিয়ভাবে অনলাইন / অফলাইন ইঙ্গিত প্রদর্শিত হবে।

https://github.com/HubSpot/offline

সম্পূর্ণ README যাচাই করতে ভুলবেন না । এটিতে এমন ইভেন্ট রয়েছে যা আপনি হুক করতে পারেন।

এখানে একটি পরীক্ষা পৃষ্ঠা । এটি সুন্দর / উপায় দ্বারা একটি দুর্দান্ত প্রতিক্রিয়া ইউআই আছে! :)

অফলাইন.জেএস সিমুলেট ইউআই একটি অফলাইন.জেএস প্লাগইন যা আপনাকে পরীক্ষা করতে দেয় যে কীভাবে আপনার প্রকৃত সংযোগটি অক্ষম করতে ব্রুট-ফোর্স পদ্ধতি ব্যবহার না করে আপনার পৃষ্ঠাগুলি বিভিন্ন সংযোগের রাজ্যে প্রতিক্রিয়া জানায়।


2
লাইব্রেরিটি স্থানীয় ফ্যাভিকনটি বারবার হুডের নীচে আনার মাধ্যমে কাজ করে। আমার মতে, পাঠাগারটি খুব "বড়" এবং এর অনেকগুলি বৈশিষ্ট্য রয়েছে; মূল কৌশলটি কেবল বার বার ফেভিকন আনছে।
কারেল বালেক

1
যখন আমি নেটওয়ার্ক কেবলটি
আনপ্লাগুলি

15

সমস্ত মেজর ব্রাউজারে এখন সবচেয়ে ভাল উপায় যেটি কাজ করে তা হ'ল নিম্নলিখিত লিপি:

(function () {
    var displayOnlineStatus = document.getElementById("online-status"),
        isOnline = function () {
            displayOnlineStatus.innerHTML = "Online";
            displayOnlineStatus.className = "online";
        },
        isOffline = function () {
            displayOnlineStatus.innerHTML = "Offline";
            displayOnlineStatus.className = "offline";
        };

    if (window.addEventListener) {
        /*
            Works well in Firefox and Opera with the 
            Work Offline option in the File menu.
            Pulling the ethernet cable doesn't seem to trigger it.
            Later Google Chrome and Safari seem to trigger it well
        */
        window.addEventListener("online", isOnline, false);
        window.addEventListener("offline", isOffline, false);
    }
    else {
        /*
            Works in IE with the Work Offline option in the 
            File menu and pulling the ethernet cable
        */
        document.body.ononline = isOnline;
        document.body.onoffline = isOffline;
    }
})();

সূত্র: http://robertnyman.com/html5/offline/online-offline-events.html


3
কোডটিতে মন্তব্যগুলি যেমন স্পষ্টভাবে জানিয়েছে - আপনি ইথারনেট কেবলটি প্লাগ লাগিয়ে রাখলে বা ওয়াইফাই বন্ধ করে দিলে এটি ফায়ারফক্স / ক্রোমে কাজ করে না
মনীশ

আমি "উত্স" লিঙ্কটি দেখার এবং সংযোগ বিচ্ছিন্ন ইথারনেট কেবলটি দেখার চেষ্টা করেছি, এটি আইইতে "আপনি অফলাইনে আছেন" দেখিয়েছেন, তবে আমার জন্য ফায়ারফক্স / ক্রোমে নেই (সমস্ত ব্রাউজারের সর্বশেষ সংস্করণ ব্যবহার করে)। আমি কি কিছু মিস করছি?
মনীশ

13

সম্প্রতি থেকে, navigator.onLineসমস্ত প্রধান ব্রাউজারগুলিতে একই দেখায় এবং এটি ব্যবহারযোগ্য।

if (navigator.onLine) {
  // do things that need connection
} else {
  // do things that don't need connection
}

এটি প্রাচীনতম সংস্করণগুলি যা সঠিকভাবে সমর্থন করে তা হ'ল : ফায়ারফক্স ৪১ হ'ল , আইই 9, ক্রোম 14 এবং সাফারি 5।

বর্তমানে এটি ব্যবহারকারীদের প্রায় পুরো বর্ণালীকে উপস্থাপন করবে, তবে আপনার পৃষ্ঠার ব্যবহারকারীদের কী ক্ষমতা রয়েছে তা আপনার সর্বদা পরীক্ষা করা উচিত।

এফএফ 41 এর আগে, falseব্যবহারকারী কেবলমাত্র অফলাইন মোডে ব্রাউজারটি রাখলে তা প্রদর্শিত হবে । আই 8 এ body, এর পরিবর্তে সম্পত্তিটি ছিল onwindow

উত্স: ক্যানিজ


11

window.navigator.onLineঅ্যাট্রিবিউট এর সাথে সংশ্লিষ্ট অন্যান্য ঘটনা বর্তমানে নির্দিষ্ট ওয়েব ব্রাউজার (চালু অবিশ্বস্ত হয় বিশেষত ফায়ারফক্স ডেস্কটপ তাই আমি একটু ফাংশন (jQuery ব্যবহার) যে পর্যায়ক্রমে নেটওয়ার্ক সংযোগ স্থিতি পরীক্ষা এবং উপযুক্ত বাড়াতে লিখেছিলেন,) হিসাবে @Junto বলেন offlineএবং onlineইভেন্ট:

// Global variable somewhere in your app to replicate the 
// window.navigator.onLine variable (it is not modifiable). It prevents
// the offline and online events to be triggered if the network
// connectivity is not changed
var IS_ONLINE = true;

function checkNetwork() {
  $.ajax({
    // Empty file in the root of your public vhost
    url: '/networkcheck.txt',
    // We don't need to fetch the content (I think this can lower
    // the server's resources needed to send the HTTP response a bit)
    type: 'HEAD',
    cache: false, // Needed for HEAD HTTP requests
    timeout: 2000, // 2 seconds
    success: function() {
      if (!IS_ONLINE) { // If we were offline
        IS_ONLINE = true; // We are now online
        $(window).trigger('online'); // Raise the online event
      }
    },
    error: function(jqXHR) {
      if (jqXHR.status == 0 && IS_ONLINE) {
        // We were online and there is no more network connection
        IS_ONLINE = false; // We are now offline
        $(window).trigger('offline'); // Raise the offline event
      } else if (jqXHR.status != 0 && !IS_ONLINE) {
        // All other errors (404, 500, etc) means that the server responded,
        // which means that there are network connectivity
        IS_ONLINE = true; // We are now online
        $(window).trigger('online'); // Raise the online event
      }
    }
  });
}

আপনি এটি এর মতো ব্যবহার করতে পারেন:

// Hack to use the checkNetwork() function only on Firefox 
// (http://stackoverflow.com/questions/5698810/detect-firefox-browser-with-jquery/9238538#9238538)
// (But it may be too restrictive regarding other browser
// who does not properly support online / offline events)
if (!(window.mozInnerScreenX == null)) {
    window.setInterval(checkNetwork, 30000); // Check the network every 30 seconds
}

অফলাইন এবং অনলাইন ইভেন্টগুলি শুনতে (jQuery এর সহায়তায়):

$(window).bind('online offline', function(e) {
  if (!IS_ONLINE || !window.navigator.onLine) {
    alert('We have a situation here');
  } else {
    alert('Battlestation connected');
  }
});

7

নেভিগেটর.অনলাইন একটি গোলযোগ

সার্ভারে একটি অজ্যাক্স কল করার চেষ্টা করার সময় আমি এটির মুখোমুখি হয়েছি।

যখন ক্লায়েন্টটি অফলাইন থাকে তখন বেশ কয়েকটি সম্ভাব্য পরিস্থিতি থাকে:

  • এজ্যাক্স কল টাইমআউট এবং আপনি ত্রুটি পাবেন
  • এজ্যাক্স কলটি সাফল্য ফিরিয়ে দেয় তবে এই সংখ্যাটি বাতিল
  • এজ্যাক্স কলটি কার্যকর করা হয়নি কারণ ব্রাউজারটি এমন সিদ্ধান্ত নেয় (নেভিগেটর.অনলাইন যখন কিছুক্ষণ পরে মিথ্যা হয়ে যায়)

আমি যে সমাধানটি ব্যবহার করছি তা হ'ল জাভাস্ক্রিপ্টের সাহায্যে স্থিতিটি নিয়ন্ত্রণ করা। আমি একটি সফল কলটির শর্তটি সেট করেছিলাম, অন্য কোনও ক্ষেত্রে আমি অনুমান করি ক্লায়েন্টটি অফলাইন। এটার মতো কিছু:

var offline;
pendingItems.push(item);//add another item for processing
updatePendingInterval = setInterval("tryUpdatePending()",30000);
tryUpdatePending();

    function tryUpdatePending() {

        offline = setTimeout("$('#offline').show()", 10000);
        $.ajax({ data: JSON.stringify({ items: pendingItems }), url: "WebMethods.aspx/UpdatePendingItems", type: "POST", dataType: "json", contentType: "application/json; charset=utf-8",
          success: function (msg) {
            if ((!msg) || msg.d != "ok")
              return;
            pending = new Array(); //empty the pending array
            $('#offline').hide();
            clearTimeout(offline);
            clearInterval(updatePendingInterval);
          }
        });
      }

5

এইচটিএমএল 5 এ আপনি navigator.onLineসম্পত্তিটি ব্যবহার করতে পারেন । এখানে দেখুন:

http://www.w3.org/TR/offline-webapps/#related

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

আপনি যা সন্ধান করছেন এটি যদি এটি হয় তবে আমাদের জানান।

আন্তরিক শুভেচ্ছা,


আপনার সাহায্যের জন্য ধন্যবাদ Trefex। আমি আমার কোড পরিবর্তন করেছি, এবং এখন কেবল নেভিগেটর.অনলাইন সম্পত্তি যাচাই করুন, তবে আমি আগের মতো আচরণ পাই। ম্যাটবাস্টার মন্তব্যটি একবার দেখুন।
পিয়ের ডুপলুই

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

1
ঠিক আছে, ধন্যবাদ :) আমি কেবল ভেবেছিলাম এটি ব্যবহারকারীর পক্ষে আরও ভাল হবে যদি অ্যাপ্লিকেশনটি সংযোগের কোনও পরিবর্তনকে স্বয়ংক্রিয়ভাবে সনাক্ত করতে সক্ষম হয় (এফএফ বা আইইতে ম্যানুয়ালি অফলাইন মোড সক্ষম করার প্রয়োজন নেই)। এইভাবে, অ্যাপ্লিকেশনটি অফলাইনে গেলে এটি সার্ভারের অনুসন্ধানের পরিবর্তে এটির স্থানীয় ক্যাশে ব্যবহার করবে। আমি জন রেসিগের এই পোস্টটি পেয়েছি, যা এটি বেশিরভাগ ক্ষেত্রে ব্যাখ্যা করে যে এটি কেন কাজ করে না: ejohn.org/blog/offline-events
পিয়ের ডুপলুই

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

হ্যাঁ আমি অনুমান করি যে এটি সর্বোত্তম বিকল্প - শিল্পের বর্তমান অবস্থার প্রেক্ষিতে। আমি আশা করি যে সমস্ত ব্রাউজার শেষ পর্যন্ত নিজেরাই সংযোগের প্রকৃত ক্ষতি সনাক্ত করতে সক্ষম হবে: নেভিগেটর.অনলাইন ব্যবহার করা বেশ সহজ এবং এটি আরও জটিল হওয়া উচিত নয়। ভাবছেন না?
পিয়ের ডুপলুই

3

দয়া করে অফলাইনে লেখার জন্য প্রয়োজনীয় .js মডিউলটি সন্ধান করুন।

define(['offline'], function (Offline) {
    //Tested with Chrome and IE11 Latest Versions as of 20140412
    //Offline.js - http://github.hubspot.com/offline/ 
    //Offline.js is a library to automatically alert your users 
    //when they've lost internet connectivity, like Gmail.
    //It captures AJAX requests which were made while the connection 
    //was down, and remakes them when it's back up, so your app 
    //reacts perfectly.

    //It has a number of beautiful themes and requires no configuration.
    //Object that will be exposed to the outside world. (Revealing Module Pattern)

    var OfflineDetector = {};

    //Flag indicating current network status.
    var isOffline = false;

    //Configuration Options for Offline.js
    Offline.options = {
        checks: {
            xhr: {
                //By default Offline.js queries favicon.ico.
                //Change this to hit a service that simply returns a 204.
                url: 'favicon.ico'
            }
        },

        checkOnLoad: true,
        interceptRequests: true,
        reconnect: true,
        requests: true,
        game: false
    };

    //Offline.js raises the 'up' event when it is able to reach
    //the server indicating that connection is up.
    Offline.on('up', function () {
        isOffline = false;
    });

    //Offline.js raises the 'down' event when it is unable to reach
    //the server indicating that connection is down.
    Offline.on('down', function () {
        isOffline = true;
    });

    //Expose Offline.js instance for outside world!
    OfflineDetector.Offline = Offline;

    //OfflineDetector.isOffline() method returns the current status.
    OfflineDetector.isOffline = function () {
        return isOffline;
    };

    //start() method contains functionality to repeatedly
    //invoke check() method of Offline.js.
    //This repeated call helps in detecting the status.
    OfflineDetector.start = function () {
        var checkOfflineStatus = function () {
            Offline.check();
        };
        setInterval(checkOfflineStatus, 3000);
    };

    //Start OfflineDetector
    OfflineDetector.start();
    return OfflineDetector;
});

দয়া করে এই ব্লগ পোস্টটি পড়ুন এবং আমাকে আপনার চিন্তাভাবনা জানান। http://zen-and-art-of-programming.blogspot.com/2014/04/html-5-offline-application-de વિકાસment.html এতে ক্লায়েন্ট অফলাইন থাকা অবস্থায় সনাক্ত করতে অফলাইন. js ব্যবহার করে একটি কোড নমুনা ধারণ করে।


3
নোট করুন যে কেবলমাত্র লিঙ্ক-উত্তরগুলি নিরুৎসাহিত করা হয়েছে, এসও উত্তরগুলি সমাধানের সন্ধানের শেষ-পয়েন্ট হওয়া উচিত (বনাম। রেফারেন্সগুলির মধ্যে আরও একটি স্টপওভার, যা সময়ের সাথে সাথে বাসি হয়ে যায়)। রেফারেন্স হিসাবে লিঙ্কটি রেখে এখানে দয়া করে এখানে একা একা সংক্ষিপ্তসার বিবেচনা করুন।
ক্লিওপাত্র

হাই, আমি লিঙ্ক রেফারেন্স সহ প্রয়োজনীয় জেএসএস মডিউল পোস্ট করেছি। পরামর্শের জন্য ধন্যবাদ.
শ্রীহরি শ্রীধরন

2

আপনি নীচের মত সহজে অফলাইন ক্রস ব্রাউজারটি সনাক্ত করতে পারেন

var randomValue = Math.floor((1 + Math.random()) * 0x10000)

$.ajax({
      type: "HEAD",
      url: "http://yoururl.com?rand=" + randomValue,
      contentType: "application/json",
      error: function(response) { return response.status == 0; },
      success: function() { return true; }
   });

আপনি yoururl.com দ্বারা প্রতিস্থাপন করতে পারেন document.location.pathname

সমাধানটির ক্রুসটি হল, আপনার ডোমেন নামের সাথে সংযোগ স্থাপনের চেষ্টা করুন, আপনি যদি সংযোগ করতে সক্ষম না হন - আপনি অফলাইন। ক্রস ব্রাউজারে কাজ করে।


প্রদত্ত যে ডোমেন নামের পরে কোনও url নাম নেই, 404 পাওয়ার কোনও পরিবর্তন নেই
হরিশার

কখনও কখনও না, যেমন আমার অপির হোমপেজটি 404
বেন আউবিন

আপির হোম পেজের বিষয়টি কীভাবে ?? তা পেলাম না কারণ এটি যখন সার্ভারে হিট হয় তখন কোনও url থাকে না - সুতরাং কোনও প্রসেসিং হয় না, এমনকি আপনার হোম পৃষ্ঠাটি 404 হলেও - এটি কোনও বিষয় নয়। আপনি যদি কিছু নমুনা কোড সরবরাহ করতে পারেন তবে আমি যা সমস্যাটি বলছি তা বুঝতে এবং বুঝতে পারছি
Harishr

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

আমার ওয়েবপিতে কোনও হোম পৃষ্ঠা নেই তবে উপরেরটি এখনও কাজ করে। আমি কেন বিভ্রান্ত হচ্ছি তা না। হোম
পৃষ্ঠাগুলি

2

আমার এইচটিএমএল 5 অ্যাপটি অনলাইনে বা অফলাইনে রয়েছে কিনা তা যাচাই করতে আমি HTML5 ক্যাশে ম্যানিফেস্টে ফললব্যাক বিকল্পটি ব্যবহার করি:

FALLBACK:
/online.txt /offline.txt

এইচটিএমএল পৃষ্ঠায় আমি জাভাস্ক্রিপ্ট টোট ব্যবহার করি অনলাইন / অফলাইনে টিএসটি ফাইলের সামগ্রীগুলি পড়ুন:

<script>$.get( "urlto/online.txt", function( data ) {
$( ".result" ).html( data );
alert( data );
});</script>

অফলাইনে থাকাকালীন স্ক্রিপ্টটি অফলাইন.txt এর সামগ্রীগুলি পড়বে। ওয়েব পৃষ্ঠাগুলি অফলাইনে অনলাইনে থাকলে আপনি ফাইলগুলিতে পাঠ্যের উপর ভিত্তি করে সনাক্ত করতে পারবেন।


0

এখানে আমার সমাধান।

আইওএস 8-তে ফোনগ্যাপ ওয়েব অ্যাপ্লিকেশন এবং অ্যান্ড্রয়েড ৪.৪.২-এ ফোনগ্যাপ ওয়েব অ্যাপ্লিকেশন হিসাবে আইই, অপেরা, ক্রোম, ফায়ারফক্স, সাফারি দিয়ে পরীক্ষিত

এই সমাধানটি ফায়ারফক্সের সাথে লোকালহোস্টে কাজ করছে না।

================================================== ===============================

অনলাইনচেক.জেএস (ফাইলপথ: "রুট / জেএস / অনলাইনচেক.জেএস):

var isApp = false;

function onLoad() {
        document.addEventListener("deviceready", onDeviceReady, false);
}

function onDeviceReady() {
    isApp = true;
    }


function isOnlineTest() {
    alert(checkOnline());
}

function isBrowserOnline(no,yes){
    //Didnt work local
    //Need "firefox.php" in root dictionary
    var xhr = XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject('Microsoft.XMLHttp');
    xhr.onload = function(){
        if(yes instanceof Function){
            yes();
        }
    }
    xhr.onerror = function(){
        if(no instanceof Function){
            no();
        }
    }
    xhr.open("GET","checkOnline.php",true);
    xhr.send();
}

function checkOnline(){

    if(isApp)
    {
        var xhr = new XMLHttpRequest();
        var file = "http://dexheimer.cc/apps/kartei/neu/dot.png";

        try {
            xhr.open('HEAD', file , false); 
            xhr.send(null);

            if (xhr.status >= 200 && xhr.status < 304) {
                return true;
            } else {
                return false;
            }
        } catch (e) 
        {
            return false;
        }
    }else
    {
        var tmpIsOnline = false;

        tmpIsOnline = navigator.onLine;

        if(tmpIsOnline || tmpIsOnline == "undefined")
        {
            try{
                //Didnt work local
                //Need "firefox.php" in root dictionary
                var xhr = XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject('Microsoft.XMLHttp');
                xhr.onload = function(){
                    tmpIsOnline = true;
                }
                xhr.onerror = function(){
                    tmpIsOnline = false;
                }
                xhr.open("GET","checkOnline.php",false);
                xhr.send();
            }catch (e){
                tmpIsOnline = false;
            }
        }
        return tmpIsOnline;

    }
}

================================================== ===============================

index.html (ফাইলপথ: "রুট / সূচক html"):

<!DOCTYPE html>
<html>


<head>
    ...

    <script type="text/javascript" src="js/onlineCheck.js" ></script>

    ...

</head>

...

<body onload="onLoad()">

...

    <div onclick="isOnlineTest()">  
        Online?
    </div>
...
</body>

</html>

================================================== ===============================

চেকঅনলাইন.এফপি (ফাইলপথ: "রুট"):

<?php echo 'true'; ?> 

0

ভাল, আপনি জাভাস্ক্রিপ্ট প্লাগইন চেষ্টা করতে পারেন যা রিয়েল টাইমে ব্রাউজার সংযোগটি নিরীক্ষণ করতে পারে এবং যদি ইন্টারনেটের সাথে ইন্টারনেট বা ব্রাউজারগুলির সংযোগ নিচে চলে যায় তবে ব্যবহারকারীকে অবহিত করতে পারে।

ওয়্যারমনকি জাভাস্ক্রিপ্ট প্লাগইন এবং ডেমো আপনি এখানে খুঁজে পেতে পারেন

http://ryvan-js.github.io/


0

ডকুমেন্ট বডি ব্যবহার:

<body ononline="onlineConditions()" onoffline="offlineConditions()">(...)</body>

জাভাস্ক্রিপ্ট ইভেন্ট ব্যবহার:

window.addEventListener('load', function() {

  function updateOnlineStatus() {

    var condition = navigator.onLine ? "online" : "offline";
    if( condition == 'online' ){
        console.log( 'condition: online')
    }else{
        console.log( 'condition: offline')
    }

  }

  window.addEventListener('online',  updateOnlineStatus );
  window.addEventListener('offline', updateOnlineStatus );

});

রেফারেন্স :
ডকুমেন্ট-বডি: অনলাইন ইভেন্ট
জাভাস্ক্রিপ্ট-ইভেন্ট: অনলাইন এবং অফলাইন ইভেন্ট

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


1
এটি কাজ করবে না: window.addEventListener('online', updateOnlineStatus(event) );কারণ আপনি অবিলম্বে আপডেটলাইনস্ট্যাটাস () ফাংশনটি কল করছেন। এটি হওয়া উচিতwindow.addEventListener('online', updateOnlineStatus );
সাবাস্তিয়ান রোসেট
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.