আইফোন সাফারি ওয়েব অ্যাপ্লিকেশন নতুন উইন্ডোতে লিঙ্কগুলি খুলবে


155

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


3
আপনি এখন scopeপ্যারামিটারটি ব্যবহার করতে পারেন manifest.json। আরও তথ্যের জন্য আমার উত্তর দেখুন। আমি এটি iOS 11.3 এ পরীক্ষা করেছি এবং এটি কার্যকর হয়।
আমির রামিনফার

3
আইওএস 11.3 খোলার সাফারি সঙ্গে সংগ্রাম কেউ জন্য, পুনরাবৃত্তি করা, দেখতে দয়া করে @ AmirRaminfar এর উত্তর এখানে: stackoverflow.com/a/49604315/32055
ক্রিস হেইন্সের

উত্তর:


110

আমি জাভাস্ক্রিপ্ট সমাধান iWebKit ফ্রেমওয়ার্কে পেয়েছি :

var a=document.getElementsByTagName("a");
for(var i=0;i<a.length;i++)
{
    a[i].onclick=function()
    {
        window.location=this.getAttribute("href");
        return false
    }
}

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

6
বিপরীত উদাহরণ আছে? আইফোন ওয়েব অ্যাপ্লিকেশনটিকে কোনও সাফারিতে কোনও পৃষ্ঠা খুলতে বাধ্য করা হোক না কেন এটি কোনও জাভাস্ক্রিপ্টের অবস্থান পরিবর্তন?
tkahn

1
@ পাভেল iwebkit উল্লেখ করার জন্য আপনাকে ধন্যবাদ :) কিছু ট্র্যাফিক পেতে সহায়তা করে: D
cmplieger

3
[].forEach.call(document.links, function(link) { link.addEventListener("click", function(event) { event.preventDefault(); window.location = this.href; }) });
অ্যালেক্স

1
এর কি কোনও পার্শ্ব প্রতিক্রিয়া আছে?
pingu

94

এখানে অন্যান্য সমাধানগুলি হয় বাহ্যিক লিঙ্কগুলির জন্য অ্যাকাউন্ট করে না (যা আপনি সম্ভবত সাফারিতে বাহ্যিকভাবে খুলতে চান) বা আপেক্ষিক লিঙ্কগুলির জন্য অ্যাকাউন্ট করবেন না (সেগুলিতে ডোমেন ছাড়াই)।

এইচটিএমএল 5 মোবাইল-বয়লারপ্লেট প্রকল্পের এই লিঙ্কটির লিঙ্কগুলি যা এই বিষয়টিতে ভাল আলোচনা করেছে: https://gist.github.com/1042026

এখানে তারা চূড়ান্ত কোড নিয়ে আসে:

<script>(function(a,b,c){if(c in b&&b[c]){var d,e=a.location,f=/^(a|html)$/i;a.addEventListener("click",function(a){d=a.target;while(!f.test(d.nodeName))d=d.parentNode;"href"in d&&(d.href.indexOf("http")||~d.href.indexOf(e.host))&&(a.preventDefault(),e.href=d.href)},!1)}})(document,window.navigator,"standalone")</script>

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

@ জোনাথান আমি নিশ্চিত নই আপনি যদি এই স্ক্রিপ্টটি সরিয়ে দেন তবে তা ঘটে না? হতে পারে আপনার সাইটে একটি লিঙ্ক পোস্ট? অথবা একটি নতুন প্রশ্ন খুলুন, এটি আরও ভাল হতে পারে।
rmarscher

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

এটি গ্রহণযোগ্য উত্তর হওয়া উচিত এবং কোডটি হেডারে রেখে পিএইচপিআরপুনারের সাহায্যে তৈরি করা আমার আইপ্যাড 1 পূর্ণস্ক্রিন ক্লায়েন্টে মনোমুখে কাজ করা উচিত। নিশ্চিত নয় কেন এটি এতটাই বিচলিত হয়েছে যেহেতু কোডের বেশ সংক্ষিপ্ত বিট মনে হয় যা অনেক বিডাব্লু ওভারহেড ছাড়াই পর্বত লিখিত হতে পারে ... এটি কেবল পিক হচ্ছে এবং সাধারণত ধন্যবাদ বলতে চাই।
sradforth

4
এটি js ফাংশন দ্বারা ব্যবহৃত href = "#" লিঙ্কগুলির মতো বুটস্ট্র্যাপি জিনিসগুলি ভেঙে দেয়
শন

47

আপনি যদি jQuery ব্যবহার করে থাকেন তবে আপনি এটি করতে পারেন:

$("a").click(function (event) {
    event.preventDefault();
    window.location = $(this).attr("href");
});

1
দয়া করে ব্যাখ্যা করুন কেন। লাইভ () ভাল হতে পারে?
এজেসিডাব্লু

8
লাইভ ইভেন্টটি সমস্ত লিঙ্কগুলিতে আবদ্ধ করবে যার মধ্যে এখনও অস্তিত্ব নেই, ক্লিক কেবলমাত্র বর্তমানে উপস্থিত রয়েছে তাদের সাথে আবদ্ধ হবে
মিস্পস্পেন্স

ধন্যবাদ! রক্ষাকর্তা। সাফারি কেন সারাক্ষণ লোড হচ্ছে তা জানার জন্য আমি কয়েক ঘন্টা ব্যয় করেছি।
স্টিভ

1
আমার কাছ থেকে +1 - this.hrefjQuery অবজেক্টে কাস্টিংয়ের পরিবর্তে ব্যবহৃত হয়েছে , তবে এই উত্তরের জন্য ধন্যবাদ। IOS6 এ কাজ করে।
ফেন্টন

17
.live () jQuery 1.7 হিসাবে অবহিত করা হয়েছে এবং 1.9 হিসাবে সরানো হয়েছে । পরিবর্তে $ (দস্তাবেজ) .on ('ক্লিক করুন', 'এ', ফাংশন () {...}) ব্যবহার করুন।
টম ডেভিস

21

এটি আইওএস .1.১ এ এবং বুটস্ট্র্যাপ জেএস লিঙ্কগুলির সাথে (যেমন ড্রপডাউন মেনু ইত্যাদি) নিয়ে কাজ করছে

$(document).ready(function(){
    if (("standalone" in window.navigator) && window.navigator.standalone) {
      // For iOS Apps
      $('a').on('click', function(e){
        e.preventDefault();
        var new_location = $(this).attr('href');
        if (new_location != undefined && new_location.substr(0, 1) != '#' && $(this).attr('data-method') == undefined){
          window.location = new_location;
        }
      });
    }
  });

1
+1 টি। এটি লিঙ্কগুলি ঠিক করার আগে আপনি কোনও ওয়েব অ্যাপ ব্যবহার করছেন কিনা তা যাচাই করে।
ট্রলি

1
আইওএস 8.0.2 এ কাজ করে! ধন্যবাদ
জোয়েল মারফি

1
@sean আমার আইপ্যাডে আরও একটি ওয়েবপৃপ চলছে যা চিত্র ম্যাপটি href হিসাবে ব্যবহার করছে এবং এই কোডটি কার্যকর হয় না ... এটি অন্য সমস্ত লিঙ্কের জন্য ঠিক কাজ করে। এই কোডটি কীভাবে চিত্র মানচিত্রের সাথে কাজ করবেন তা কোনও ধারণা? আমি পুরো খণ্ডটি অনুলিপি করে $('a').on('click'ফাংশন (ই) ` $('area').on('click'function এর সাথে , ফাংশন (ঙ) { tried প্রতিস্থাপন করার চেষ্টা করেছি তবে এটিও কার্যকর হবে বলে মনে হয় না। কোন ধারনা?
নেমাটোথ

আপনি যদি ইতিমধ্যে সংজ্ঞায়িত ক্লিক ফাংশনগুলি aনিয়ে থাকেন href="#"তবে jquery সিলেক্টর সম্পর্কে আপনি আরও নির্দিষ্ট হতে পারেন, যেমন$('a[href!="#"]')
সিজেকে

13

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

স্কোপ সদস্য হ'ল একটি স্ট্রিং যা এই ওয়েব অ্যাপ্লিকেশনটির অ্যাপ্লিকেশন প্রসঙ্গে নেভিগেশনের সুযোগকে উপস্থাপন করে।

এখানে আমার উদাহরণ:

{
  "name": "Test",
  "short_name": "Test",
  "lang": "en-US",
  "start_url": "/",
  "scope": "/",
  ...
}

আপনি এটি সম্পর্কে এখানে আরও পড়তে পারেন । আমি জেনারেটর ব্যবহার করার পরামর্শ দিচ্ছি যা এই কার্যকারিতাটি সরবরাহ করবে।

যদি আপনি সুযোগটি নির্দিষ্ট করেন তবে সবকিছু অ্যান্ড্রয়েডের মতো প্রত্যাশার মতো কাজ করে, সুযোগের বাইরে গন্তব্যগুলি সাফারিতে খোলে - আপনার পিডব্লিউএতে পিছনের বোতামটি (স্ট্যাটাস বারের ছোট একটি) দিয়ে।


7
দুর্ভাগ্যক্রমে, আমি বিশ্বাস করি না যে আপনি অন্যান্য ওয়েবসাইটগুলিকে (যেমন অন্য ডোমেনে OAuth লগইনগুলি) অন্তর্ভুক্ত করতে পারেন।
ভোলিস

আরে আমির, আমি অ্যাংুলার এবং অ্যান্ড্রয়েড ব্যবহার করে একটি পিওয়া তৈরি করেছি, এটি আমার ম্যানফেস্ট.জসনটি সঠিকভাবে পড়ার মতো বলে মনে হচ্ছে 'হোম স্ক্রিন প্রম্পট যুক্ত করুন'। তবে, আইওস ক্রোম / সাফারিতে কোনও প্রম্পট নেই ... কোনও ধারণা নেই?
ওস্তাদ

5

ডেভিডের উত্তর এবং রিচার্ডস মন্তব্যের ভিত্তিতে আপনার একটি ডোমেন চেক করা উচিত। অন্যথায় অন্যান্য ওয়েবসাইটের লিঙ্কগুলিও আপনার ওয়েব অ্যাপ্লিকেশনটিতে খোলা হবে।

$('a').live('click', function (event)
{      
    var href = $(this).attr("href");

    if (href.indexOf(location.hostname) > -1)
    {
        event.preventDefault();
        window.location = href;
    }
});

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

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

5

যদি jQuery মোবাইল ব্যবহার করে থাকেন তবে ডেটা-এজ্যাক্স = 'মিথ্যা' বৈশিষ্ট্যটি ব্যবহার করার সময় আপনি নতুন উইন্ডোটি অনুভব করতে পারবেন। প্রকৃতপক্ষে, যখনই ax .Mobile.ajaxEnable সেটিংস দ্বারা বা একটি টার্গেট = '' বৈশিষ্ট্য রেখে অজেক্সএনবল বন্ধ থাকে এবং বাহ্যিক লিঙ্কটি বন্ধ থাকে তখনই এটি ঘটবে।

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

$("a[data-ajax='false']").live("click", function(event){
  if (this.href) {
    event.preventDefault();
    location.href=this.href;
    return false;
  }
});

(লাইভ () পদ্ধতির জন্য রিচার্ড পুলকে ধন্যবাদ - বাঁধাই দিয়ে কাজ করা হয়নি ())

যদি আপনি বিশ্বজুড়ে অজ্যাক্স সক্ষম করে রেখেছেন তবে আপনাকে [ডেটা-অজ্যাক্স = 'মিথ্যা'] নামাতে হবে।

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


নিখুঁত, আপনি আমাকে বাঁচিয়েছেন :)
saulob

3

এই কোডটি আইওএস 5 এর জন্য কাজ করে (এটি আমার পক্ষে কাজ করেছিল):

মাথায় ট্যাগ:

<script type="text/javascript">
    function OpenLink(theLink){
        window.location.href = theLink.href;
    }
</script>

আপনি যে লিঙ্কটিতে একই উইন্ডোতে খুলতে চান:

<a href="(your website here)" onclick="OpenLink(this); return false"> Link </a>

আমি এই মন্তব্যটি থেকে এই কোডটি পেয়েছি: আইফোন ওয়েব অ্যাপ্লিকেশন মেটা ট্যাগ


কিছু কারণে আমি মনে করি এটি বোঝা সহজ।
জেরিবিবো

3

লক্ষ্যগুলি স্পষ্টভাবে "_blank" তে সেট করা থাকলে আপনার নতুন উইন্ডোতে লিঙ্কগুলি খোলার অনুমতি দেওয়া উচিত:

$('a').live('click', function (event)
{      
    var href = $(this).attr("href");

    // prevent internal links (href.indexOf...) to open in safari if target
    // is not explicitly set_blank, doesn't break href="#" links
    if (href.indexOf(location.hostname) > -1 && href != "#" && $(this).attr("target") != "_blank")
    {
        event.preventDefault();
        window.location = href;
    }

});

অনেক ধন্যবাদ! এটিই একমাত্র কোড যা আইওএস 5 ডাব্লু / টুইটার বুটস্ট্র্যাপের জন্য কাজ করেছিল। এটি যদিও উত্পাদন উপর কাজ করে না।
চিম কান

মিম্ম কেন এটি প্রযোজনায় কাজ করবে না তা নিশ্চিত নয় তবে আমি মনে করি এটি অন্যরকম কিছু। আমাকে জানতে দাও!
দাফর্ম্যাট

3

আমি একটি সম্পূর্ণ এবং কার্যকর যেটি পেয়েছি কারণ এটি কেবলমাত্র স্ট্যান্ডেলোন ওয়েব অ্যাপের অধীনে চলমান আছে তা পরীক্ষা করে, jQuery ছাড়াই কাজ করে এবং সোজাও রয়েছে, কেবল আইওএস 8.2 এর অধীনে পরীক্ষা করা হয়েছে:

একক থাকুন: মোবাইল সাফারি খোলার স্বতন্ত্র ওয়েব অ্যাপ্লিকেশনগুলিতে লিঙ্কগুলি রোধ করুন


2

আপনি প্রায় সাধারণত লিঙ্কিং করতে পারেন:

<a href="#" onclick="window.location='URL_TO_GO';">TEXT OF THE LINK</a>

এবং আপনি হ্যাশ ট্যাগ এবং href মুছে ফেলতে পারেন, এটি যা কিছু করে তা প্রভাবকে প্রভাবিত করে ..


2

এটিই আইওএস 6 এ আমার জন্য কাজ করেছিল (rmarscher এর উত্তরের খুব সামান্য অভিযোজন):

<script>                                                                
    (function(document,navigator,standalone) {                          
        if (standalone in navigator && navigator[standalone]) {         
            var curnode,location=document.location,stop=/^(a|html)$/i;  
            document.addEventListener("click", function(e) {            
                curnode=e.target;                                       
                while (!stop.test(curnode.nodeName)) {                  
                    curnode=curnode.parentNode;                         
                }                                                       
                if ("href" in curnode && (curnode.href.indexOf("http") || ~curnode.href.indexOf(location.host)) && curnode.target == false) {
                    e.preventDefault();                                 
                    location.href=curnode.href                          
                }                                                       
            },false);                                                   
        }                                                               
    })(document,window.navigator,"standalone")                          
</script>

2

এটি শানের সামান্য অভিযোজিত সংস্করণ যা ব্যাক বোতামটি আটকাচ্ছিল

// this function makes anchor tags work properly on an iphone

$(document).ready(function(){
if (("standalone" in window.navigator) && window.navigator.standalone) {
  // For iOS Apps
  $("a").on("click", function(e){

    var new_location = $(this).attr("href");
    if (new_location != undefined && new_location.substr(0, 1) != "#" && new_location!='' && $(this).attr("data-method") == undefined){
      e.preventDefault();
      window.location = new_location;
    }
  });
}

});


1

টুইটার বুটস্ট্র্যাপ এবং রেল 3 এর সাথে

$('a').live('click', function (event) {
  if(!($(this).attr('data-method')=='delete')){
    var href = $(this).attr("href");
    event.preventDefault();
    window.location = href; 
  }   
});

লিঙ্কগুলি মুছুন এখনও এইভাবে কাজ করছে।


1

টার্গেট = "_ ফাঁকা" রয়েছে ব্যতীত আমি স্ট্যান্ডেলোন ওয়েব অ্যাপ মোডের ভিতরে সমস্ত লিঙ্ক খুলতে পছন্দ করি। অবশ্যই jQuery ব্যবহার করে।

$(document).on('click', 'a', function(e) {
    if ($(this).attr('target') !== '_blank') {
        e.preventDefault();
        window.location = $(this).attr('href');
    }
});

1

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


1

আমি @ rmarscher এর উত্তরের বাইরে একটি বাওয়ার ইনস্টলযোগ্য প্যাকেজ তৈরি করেছি যা এখানে পাওয়া যাবে:

http://github.com/stylr/iosweblinks

আপনি খুব সহজেই বোভার ব্যবহার করে স্নিপেট ইনস্টল করতে পারেন bower install --save iosweblinks


1

যারা ব্যবহার করছেন তাদের JQuery Mobileউপরোক্ত সমাধানগুলি পপআপ ডায়ালগটি ভেঙে দেয়। এটি ওয়েব অ্যাপের মধ্যে লিঙ্কগুলি রাখবে এবং পপআপগুলির জন্য অনুমতি দেবে।

$(document).on('click','a', function (event) {
    if($(this).attr('href').indexOf('#') == 0) {
        return true;
    }
    event.preventDefault();
    window.location = $(this).attr('href');     
});

এটি দ্বারা এটি করতে পারে:

$(document).on('click','a', function (event){
    if($(this).attr('data-rel') == 'popup'){
        return true;
    }
    event.preventDefault();
    window.location = $(this).attr('href');     
});

0

আমি এখানে একটি পৃষ্ঠায় সমস্ত লিঙ্কের জন্য ব্যবহার করব ...

document.body.addEventListener(function(event) {
    if (event.target.href && event.target.target != "_blank") {
        event.preventDefault();
        window.location = this.href;                
    }
});

আপনি যদি jQuery বা Zepto ব্যবহার করছেন ...

$("body").on("click", "a", function(event) {
   event.target.target != "_blank" && (window.location = event.target.href);
});

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