Come aprire i link mailto nella nuova scheda per gli utenti che hanno gmail come gestore di posta predefinito?

Su una pagina web, i link mailto collegano il client di posta elettronica predefinito. Ora che Chrome offre la possibilità di impostare Gmail come client di posta elettronica predefinito, alcuni utenti hanno i collegamenti aperti nella stessa window in modo da eliminarli dalla pagina che hanno fatto clic sul collegamento (che non gli piace)

Ho provato a aggiungere il target _blank ai collegamenti, che funziona ottimamente per gli utenti di gmail, ma farà impazzire gli utenti di Outlook perché una nuova scheda vuota si aprirà each volta che fanno clic su un link mailto.

C'è un modo per rilevare il gestore di posta elettronica predefinito e offrire una buona esperienza per entrambi i tipi di utenti?

Okay, quindi sono riuscito a far funzionare Chrome in Mac. Il tuo chilometraggio può variare. Inoltre, questo è IMO abbastanza aggraziato, quindi non può valere la pena. Onestamente questo dovrebbe esistere come impostazione all'interno di Chrome e il comportmento dovrebbe essere delegato al sito web. Ad esempio, Chrome dovrebbe avere un'opzione: "[x] apri sempre i link mailto in una scheda separata"

Detto questo, ecco come lo fai.

Innanzitutto costruisci i tuoi collegamenti così:

 <a href="#" data-mailto="[email protected]">Mail Somebody</a> 

Quindi impostare un gestore di clic per quelli.

 $('a[data-mailto]').click(function(){ var link = 'mailto.html#mailto:' + $(this).data('mailto'); window.open(link, 'Mailer'); return false; }); 

C'è un argomento options opzionale per window.open che puoi modificare. In realtà lo consiglierei quasi, per vedere se è ansible get la window generata per essere il più inconcepibile ansible. https://developer.mozilla.org/en/DOM/window.open

http://www.w3schools.com/jsref/met_win_open.asp (il documento MDN è esaustivo, mentre il doc w3schools è quasi più facile da leggere)

Avanti dobbiamo creare la pagina mailto.html. Ora potrebbe essere necessario giocare con il timeout che vedi sotto. Potresti probabilmente anche impostare questo a qualcosa di veramente corto come 500ms.

 <html> <script> function checkMailto(hash){ hash = hash.split('mailto:'); if(hash.length > 1){ return hash[1]; } else { return false; } } var mailto = checkMailto(location.hash); if(mailto){ location.href = 'mailto:'+mailto; setTimeout(function(){ window.close(); }, 1000); } </script> </html> 

risultati

Mail.app impostato come lettore di posta elettronica predefinito:

Quando faccio clic sul collegamento, apre una window per una seconda volta, quindi compone un messaggio vuoto. Nel browser torna alla pagina originale.

Gmail impostato come lettore di posta in Impostazioni> Avanzate> Privacy> Gestori:

Quando faccio clic sul collegamento, apre una nuova scheda a Gmail, con la pagina precedente in modo sicuro nella propria scheda.

Nota: una volta impostato Gmail come gestore di posta elettronica, sul lato OS (alless su mac), Chrome è impostato come gestore di posta elettronica del sistema. Quindi, anche se si distriggers Gmail come gestore di posta elettronica all'interno di Chrome, è ancora impostato sul livello di sistema operativo. Quindi per ripristinarlo, sono andato a Mail> Prefs> General. E impostare il lettore di posta predefinito di nuovo a Mail.

Ho ricevuto una richiesta di implementazione in contatti di OwnCloud e, anche se penso che sia un po 'hackish, non sembra essere un altro modo per scoprire se il gestore di posta è impostato su un indirizzo webmail.

Questo esempio viene implementato senza la necessità di file esterni.

NOTA: jQuery è necessario per questo esempio, ma probabilmente può essere riscritto a rigido javascript.

Per evitare di wherer utilizzare data-mailto o altri trucchi, è ansible intercettare invece il gestore:

 $(window).on('click', function(event) { if(!$(event.target).is('a[href^="mailto"]')) { return; } // I strip the 'mailto' because I use the same function in other places mailTo($(event.target).attr('href').substr(7)); // Both are needed to avoid triggering other event handlers event.stopPropagation(); event.preventDefault(); }); 

Ora per la function mailTo() :

 var mailTo = function(url) { var url = 'mailto:' + data.url; // I have often experienced Firefox errors with protocol handlers // so better be on the safe side. try { var mailer = window.open(url, 'Mailer'); } catch(e) { console.log('There was an error opening a mail composer.', e); } setTimeout(function() { // This needs to be in a try/catch block because a Security // error is thrown if the protocols doesn't match try { // At least in Firefox the locationis changed to about:blank if(mailer.location.href === url || mailer.location.href.substr(0, 6) === 'about:' ) { mailer.close(); } } catch(e) { console.log('There was an error opening a mail composer.', e); } }, 500); } 

Ho diminuito il timeout a 500. Funziona per me, consente di vedere cosa gli utenti dicono quando viene premuto;)

Se si desidera evitare l'apertura di una nuova scheda / window è ansible utilizzare un iframe. Richiederà una richiesta aggiuntiva, ma è less fastidioso se non si utilizza la posta elettronica. Questo non era fattibile per ownCloud perché per impostazione predefinita la politica di Content-Security è molto rigorosa e non è consentito l'iniezione di URL "estranei" in un iframe (non molto testato):

 var mailTo = function(url) { var url = 'mailto:' + data.url, $if; try { $if = $('<iframe />') .css({width: 0, height: 0, display: 'none'}) .appendTo($('body')) .attr('src', url); } catch(e) { console.log('There was an error opening a mail composer.', e); } setTimeout(function() { try { if($if.attr('src') !== url && $if.attr('src').substr(0, 6) !== 'about:' ) { window.open($if.attr('src'), 'Mailer'); } } catch(e) { console.log('There was an error opening a mail composer.', e); } $if.remove(); }, 500); } 

Volevo solo dire che per Firefox c'è una soluzione semplice.

Costruisci i tuoi collegamenti così:

 <a href="#" data-mailto="[email protected]">Mail Somebody</a> 

Imposta un gestore di clic per quelli.

 $('a[data-mailto]').click(function(){ window.open($(this).data('mailto')); }); 

Sarebbe fantastico anche se Chrome lo accettasse.