Our app generates an email that includes a link with a hash fragment.
- When an Outlook 2010 user clicks the HTML link (within the
<a>
tag), the URL is opened but mysteriously excludes the hash fragment. - If the user clicks the plain URL (that Outlook converts to a clickable link), the full URL opens correctly.
Here is the relevant code from our Rails app, if that helps:
mail(from: @message.from, to: @message.to, cc: @message.cc, bcc: @message.bcc, subject: @message.subject) do |format|
format.html { render text: @message.body_text }
end
Email message (truncated; using Twitter URLs in place of our app URLs, which follow a similar pattern):
Subject: Hello
Mime-Version: 1.0
Content-Type: text/html;
charset=UTF-8
Content-Transfer-Encoding: 7bit
<html>
<head>
<meta content='text/html; charset=utf-8' http-equiv='content-type'>
<title>title</title>
</head>
<body>
<table id='message_body_template'>
<tr>
<td>
<p><a href="http://twitter.com/#!/cnn" title="" target="">Click here</a>
to learn more.</p>
<p>Plain text link: http://twitter.com/#!/cnn</p>
</td>
</tr>
</table>
</body>
</html>
Click here opens the Twitter home page, while the plain text "link" opens CNN's Twitter page. Can anyone explain why?
Yes, the problem is unrelated to what back-end you use. It appears that (frustratingly) some versions of Outlook strip the hash portion of URLs.
My solution was to email a modified version of the link without the hash, and then redirect it to where it's supposed to go.
When I had the same issue in Laravel + Backbone I performed the redirect using this code in
routes.php
(equivalent toroutes.rb
in Rails):Recently I had faced this issue, when I set the URL without any protocol. Later I tried adding the protocol to the URL and it began working properly.
I was creating the mail body part in the
JS
itself. Below is the initial code.var link = window.location.host+'/#/somepage';
The working code.
var link = window.location.protocol + '//' + window.location.host+'/#/somepage';
I hope this may help someone, who face the similar issue.
You won't be able to change how Outlook handles the link, but you can simply use https://twitter.com/cnn and twitter will then redirect to https://twitter.com/#!/cnn