I am using mailto to allow submission of product quote information by customers. I am attempting auto-populate the quote into the email body by constructing the mailto link as a string, and concatenating the quote information, per the following code:
var quoteinfo = 'quote information here';
var link = '<a href="mailto:email?subject=subject&body=Please enter your contact information
and message here: %0A%0A%0AQuote:%0A' + quoteinfo + '">email</a>';
However, when using IE, when the link is clicked, the email is generated, but only the text that is explicitly added appears--nothing stored in the quoteinfo variable shows up. I have verified that the final link does contain all of the quote information--it just is not appearing in the email. Since the email does successfully generate with part of its text, I do not believe this is a character overflow problem (and in any case, this happens even with as few as 30 characters in the quoteinfo variable.
Perhaps this is a problem specific to the mail client?
A final note: I am well aware that there is a popular movement toward replacing mailto with forms--for other reasons, I cannot do that here, so please refrain from responding by advising a switch to a form.
A specific example of how my links would appear is as follows:
mailto:sales#optecinc.com?subject=Submission From Quote Creator &body=Please enter
your contact information and message here: %0A%0A%0AQuote:%0A#17350 - IFW 2-inch -
$829.00%0A
The hash symbol (#) has special meaning in URLs (remember anchor names? e.g. http://example.com#TopOfPage). Replace it with%23.
See W3's URL Encoding Reference
Better yet, JavaScript can do it for you with the encodeURI() function.
window.onload = function() {
var eTo = encodeURI("sales#example.com");
var eSubj = encodeURI("Submission From Quote Creator");
var eBody = encodeURI("Please enter your contact information and message here: \n\n\nQuote:\n#17350 IFW 2-inch -$829.00\n");
var email = "mailto:" + eTo + "?subject=" + eSubj + "&body=" + eBody;
document.getElementById("sales").href = email;
}
email
Somewhere along these lines, you are drawing a false conclusion. Start by eliminating the dynamic link generation, and test using a static piece of HTML. If that doesn't work either, post the exact link that doesn't work. Perhaps you have invalid characters in your quote that you are not aware of. Does it perhaps start with an apostrophe?
From your code above, the link would look something like this:
<html>
<body>
email
</body>
</html>
This works perfectly fine (tested IE9, Outlook2007).
In addition to URL encoding the hash (#) as Fantabulum mentions, I would check which client they are using. If it is Outlook (as inferred from your tag selection) they may want to run a "Detect and Repair" (usually found on the Help menu).
Running "Detect and Repair" has fixed a number of issues with similar links on our intranet. Usually the problem is the result of a corrupt file/setting, or some other program jacking with Outlook - e.g. a Windows update reverting a registry key that Outlook had changed.
Related
I have several pages that are arrived on with valid GET data, such as http://website.com/?id=12345
I have a generic HTML form that is pulled onto many different pages using php's "require" and submits using POST. Regardless of which page this form is located on, it should always submit back to that same page. However, after the form is submitted, I would like the ?id=12345 to be stripped out.
So, for example, if the user is on http://website.com/new.php?id=12345, it should post back to http://website.com/new.php. If the user is on http://website.com/old.php?id=12345, that same form it should post back to old.php
Previously the best solution I found was to style the form as such:
<form action="?" method="POST">
Which will change all links to http://website.com/new.php? or http://website.com/old.php? which is very close, but not perfect.
As it turns out, I finally found the solution to my problem by using JavaScript:
url = location.href;
qindex = url.indexOf("?");
This can pull whatever is on the address bar as a string and find the index of the first ? mark. From there:
if(qindex != -1)
tells me that there is a ? mark
var plainUrl = url.substring(0, qindex);
Can get, as a string, everything up to the ? mark, but not after. Finally:
window.location.replace(plainUrl);
Will rewrite the address bar to the plain URL, not including the ? or whatever comes after, and without redirecting the browser.
Since your page will not undergo any server-side processing, you can achieve what you want via a combination of the following two tricks.
First, change your particular querystring to a hash, which is thereafter directly editable without triggering a page reload:
http://yourdomain.com/page.html#search=value
Then modify such a script as this to do what you want to do, according to the query string passed in.
<script type='text/javascript'>
// grab the raw "querystring"
var query = document.location.hash.substring(1);
// immediately change the hash
document.location.hash = '';
// parse it in some reasonable manner ...
var params = {};
var parts = query.split(/&/);
for (var i in parts) {
var t = part[i].split(/=/);
params[decodeURIComponent(t[0])] = decodeURIComponent(t[1]);
}
// and do whatever you need to with the parsed params
doSearch(params.search);
</script>
now you can delete the query string suffix in the following way:
As detailed elsewhere, namely hide variables passed in URL, it's possible to use JavaScript's History API in modern browsers.
history.replaceState({}, null, "/index.html");
That will cause your URL to appear as /index.html without reloading the page
This little gem is explained in more detail here:
https://developer.mozilla.org/en-US/docs/Web/API/History_API
I show email on my website as following
Email
But I read the following while analysing my website using woorank.com, what should I do to avoid this?
Malicious bots scrape the web in search of email addresses and plain text email addresses are more likely to be spammed.
In the past I have seen this done with javascript. Basically you assign the email address to javascript variables and change the contents of an element using these. You can also provide a fallback for users with javascript disabled which points them in the direction of a form if you need to. Here's an example
var user = 'foo',
domain = 'bar.com',
element = document.getElementById('email');
element.innerHTML = user + '#' + domain;
//OR
//'Email'
This way bots never see the email address as they do not load javascript.
Well, you can figure out a different way every day. Here's one using jQuery.
<a class="mail" href="mailto:john#badmail.mydomain.com">e-mail</a>
Then handle the click with jQuery.
$('a.mail').on('click', function(){
var href = $(this).attr('href');
$(this).attr('href', href.replace('badmail.', ''));
});
The reason I like this is that I can let the spammers spam the dummy mail domain thinking they got yet another e-mail harvested. If I was maintaining my own spam filter, I could collect samples to my bad bucket.
Also, this approach allows you to render the page quite clean with dynamic data and simply have the javascript snippet only once on the whole site to handle the real user clicks.
Works also on mobiles.
The trouble with the JavaScript solutions is that people with JS turned off will also not see the email address. Albeit a minority you need a combination of techniques for the best results.
Many of these techniques are detailed here, but I have provided the solutions only: https://www.ionos.co.uk/digitalguide/e-mail/e-mail-security/protecting-your-e-mail-address-how-to-do-it/
Comments
<p>If you have any questions or suggestions, please write an e-mail to:
us<!-- abc#def -->er#domai<!-- #abc.com -->n.com.
</p>
Hidden Spans
<style type="text/css">
span.spamprotection {display:none;}
</style>
<p>If you have any questions or suggestions, please write an e-mail to:
user<span class="spamprotection">CHARACTER SEQUENCE</span>#domain.com.
</p>
Reverse Strings
This may not be friendly for multilingual sites.
<style type="text/css">
span.ltrText {unicode-bidi: bidi-override; direction: rtl}
</style>
<p>If you have any questions or suggestions, please write an e-mail to:
<span class="ltrText"> moc.niamod#resu</span>.
</p>
JavaScript as in many other answers
<script type="text/javascript">
var part1 = "user";
var part2 = Math.pow(2,6);
var part3 = String.fromCharCode(part2);
var part4 = "domain.com"
var part5 = part1 + String.fromCharCode(part2) + part4;
document.write("If you have any questions or suggestions, please write an e-mail to:
<href=" + "mai" + "lto" + ":" + part5 + ">" + part1 + part3 + part4 + "</a>.");
</script>
ROT13 Encryption
JavaScript dependant but also helps with GDPR as it's encrypted.
<script type="text/javascript">
function decode(a) {
return a.replace(/[a-zA-Z]/g, function(c){
return String.fromCharCode((c <= "Z" ? 90 : 122) >= (c = c.charCodeAt(0) + 13)
? c : c - 26);
})
};
function openMailer(element) {
var y = decode("znvygb:orahgmre#qbznva.qr");
element.setAttribute("href", y);
element.setAttribute("onclick", "");
element.firstChild.nodeValue = "Open e-mail software";
};
</script>
<a id="email" href=" " onclick='openMailer(this);'>E-mail: please click</a>
CSS Only
Borrowed from here: Protect e-mail address with CSS only
<!doctype html>
<html>
<head>
<title>Protect e-mail with only css</title>
<style type="text/css">
.e-mail:before {
content: attr(data-website) "\0040" attr(data-user);
unicode-bidi: bidi-override;
direction: rtl;
}
</style>
</head>
<body>
<span class="e-mail" data-user="nohj" data-website="moc.liamg"></span>
</body>
</html>
There are multiple different choices for hiding emails on websites, commonly using either the HTML entity version of the email address (as Aziz-Saleh suggested), but from an actual web design point of view, just putting the email address like that on a website isn't the most user friendly thing to do.
For instance, the mailto: link automatically triggers the browser to open the user's Email Application of choice - but consider this. Not everybody has a dedicated email application. For instance, I don't use Outlook (I'm a Windows user), and unless I have Windows Live Mail installed, my computer can't open that link. I think Chrome can open the links into GMail if you're signed in, but I would need to check that.
Ultimately, by using mailto:, you are potentially alienating a portion of your userbase that will not be able to use that link in the first place.
I would suggest using email forms, and there are plenty of easy-to-follow tutorials available for both PHP and your language of JSP, such as this link here: Sending Email in JSP and even on StackOverflow
By using your server to send the email, you get tighter control over how the email is generated, what data the user is allowed to put in, and you could even send them a return email (generated by the server) to confirm that you have received their message. This is a tried-and-tested real-world method of allowing customers and visitors to contact you, whilst still giving you protection and control over the entire process.
TL;DR: Raw mailto: links might alienate people without dedicated email programs, whereas if you use JSP forms, you can control how they contact you, with what information (you can use fields and the HTML5 required attribute to mandate certain input fields) and you can even respond with a do-not-reply email so they know their message was heard (just don't forget to ask for their email address)
Solution 1:
You can use many publicly available email address encoders like (first result on google):
http://www.wbwip.com/wbw/emailencoder.html
This encodes the emails into their character entity value, this will require more logic form scrapers to decode it.
So an email like: test#gmail.com becomes test#gmail.com which can be used in a mailto as well.
Solution 2:
Use an online email to image converter (again first result on google):
http://www.email2image.com/Convert-Email-to-Image.aspx
To make it as an image. Other services enable you to do this automatically via an API like:
https://www.mashape.com/seikan/img4me-text-to-image-service#!endpoint-Main
Personally, I came up with this, pretty straightforward and kinda funny solution. I throw this code where I want my email address to appear:
<script>(function whatever(){var s='#',n='nabil',k='kadimi.com',e=n+s+k,l='<a href=mailto:{{spam#uce.gov}}>{{spam#uce.gov}}</a>'.replace(/{{.+?(}})/g,e);document.write(l)})()</script>
Explanation
Bots that crawl websites and look for emails using regular expressions will grab the FTC (Federal Trade Commission) email address (spam#uce.gov). Legit visitors will see your email address after it's constructed with that code.
##Expanded
<script>
(function whatever() {
var s = '#'
, n = 'nabil'
, k = 'kadimi.com'
, e = n + s + k
, l = '<a href=mailto:{{spam#uce.gov}}>{{spam#uce.gov}}</a>'.replace(/{{.+?(}})/g, e)
;
document.write(l);
})();
</script>
##Demo
<script>(function whatever(){var s='#',n='nabil',k='kadimi.com',e=n+s+k,l='<a href=mailto:{{spam#uce.gov}}>{{spam#uce.gov}}</a>'.replace(/{{.+?(}})/g,e);document.write(l)})()</script>
I've been using CloudFlare's free Email Address Obfuscation feature: https://support.cloudflare.com/hc/en-us/articles/200170016-What-is-Email-Address-Obfuscation-
Email harvesters and other bots roam the Internet looking for email
addresses to add to lists that target recipients for spam. This trend
results in an increasing amount of unwanted email.
Web administrators have come up with clever ways to protect against
this by writing out email addresses (i.e., help [at] cloudflare [dot]
com) or by using embedded images of the email address. However, you
lose the convenience of clicking on the email address to automatically
send an email.
By enabling Cloudflare Email Address Obfuscation, email addresses on
your web page will be obfuscated (hidden) from bots, while keeping
them visible to humans. In fact, there are no visible changes to your
website for visitors.
To prevent unexpected website behavior, email addresses are not
obfuscated when they appear in:
Any HTML tag attribute, except for the href attribute of the a tag.
Other HTML tags
Any page that does not have a MIME type of "text/html" or "application/xhtml+xml"
I'm not affiliated with CloudFlare. I just appreciate all that they offer for free.
I use email encoders like http://www.wbwip.com/wbw/emailencoder.html . Just put your address to the source and between the "a" tags. Something like this
info#example.com
It is encoding of info#example.com
Put your email address on a transparent image in png or gif format and display that image on your web pages. Only a human reader would know the image is showing an email address.
This will prevent bots from finding your email address on your website.
Google actually provides a service for this. Free to use and works pretty well: Mail ReCaptcha
Yeah it means use a php form for visitors to contact you through. It is much safer and stops bots sending emails to you like thousands of times. Look around Google for a contact form tutorial there will be plenty!
A tutorial will tell you to use php and so when the user fills out a form it will be emailed to you with the details they filled out in the form. However most forms use like a "Captcha" entry and it stops the bots, almost like a "Are you Human?" test.
Hope this helps.
Edit: Having used Formspree for a little over a year now, I have to say I'm not too happy. It's really easy for people to spam you all kinds of garbage.
2020 (and potentially beyond) solution:
Register with Formspree, a free platform that forwards form data to an email of your choosing. Be sure to register using the email address on which you want to receive submissions.
Copy the unique Formspree endpoint that gets generated.
Create a contact form with this endpoint.
Congrats! Your email is officially masked from bots.
Can we send email from static website( html page)? without using asp.net or others(i mean no server side tech).
With javascript and html alone, it's not possible. Javascript is not intended to do such things and is severely crippled in the way it can interact with anything other than the webbrowser it lives in. You can use a mailto: link to trigger opening of the users registered mail client.
However, you can do a popup window to make a better approach of mailto: like this solution
var addresses = "";//between the speech mark goes the receptient. Seperate addresses with a ;
var body = ""//write the message text between the speech marks or put a variable in the place of the speech marks
var subject = ""//between the speech marks goes the subject of the message
var href = "mailto:" + addresses + "?"
+ "subject=" + subject + "&"
+ "body=" + body;
var wndMail;
wndMail = window.open(href, "_blank", "scrollbars=yes,resizable=yes,width=10,height=10");
if(wndMail)
{
wndMail.close();
}
EDIT: Maybe you can't use server side, but you can use the formmail.cgi if your host provides one. Most hosts support this, and instructions for using FormMail are simple.
You can't send an email with just HTML (From the Front-End) unless you don't mind interacting with a third party service provider which can do the back-end process for you.
Otherwise, you need to use the Back-End, the most common and easiest way to do this is with PHP.
see this
With no server-side coding, you have only one option to send email via HTML and that is
Email
You could do that, but you can't guarantee the result.
The following code is legit:
<form method="post" action="mailto:my_adress#my_website.com" enctype="text/plain">
<!-- some inputs here, with a submit of course -->
</form>
But before you do that, please read this. It will show you the dangers of using that.
I need to create a "forward to friend" link in a HTML email that will mimic the forward button on the mail client (ie launch a new window with a pre-filled body), is this possible?
ie:
Forward this email to a friend
If not, what's a simple approach to achieve an as similar as possible result?
ps. I'm aware this is pretty much pointless functionality, it's a request from client.
I wonder if your client would go for this:
create a jazzy Forward to a Friend button.
that button should open up a page on the client site.
that page should contain an email a friend form.
Much easier to accomplish.
You cannot imitate or initiate the forward action in any mail client (web or desktop) currently on the market today. You have several other options available though:
Offer an online version of your email and include a link to it in your mailto tag:
<a href="mailto:Enter%20an%20email?subject=Your%20Subject%20Line&body=Thought%20you%20might%20be%20interested%20in%20this%20http://www.yourdomain.com">
Forward to a friend</a>
Include a callout in your email (near the top, preferably) encouraging your recipients to forward the message to their friends.
Include a link to a web form where your recipients can provide other people's email addresses and send these new email addresses copies of the mailing. (The only issue with this one is that the recipient's address book is not available to them easily, which probably hinders sharing - test to know what your demographic is like).
No, this is not possible. At least, I really, really, really hope it's not possible.
Why? Because if it was possible, spammers could put links in e-mails that might cause people to unintentionally forward something. For this reason, forwarding has to be self-instigated by the user with the functionality provided by their e-mail client.
You can have links that use the mailto protocol, like this
Link
but this probably isn't what you are looking for. All this does is open the compose mail page with the e-mail field filled in (assuming that their default e-mail client is configured to do so).
You could do something like this:
<a href="mailto:person#example.com?subject=FW: Email Subject
&body=Body of email text
&cc=anotherperson#example.com
&bcc=onemore#example.com">Forward email</a>
And fill out all the fields in the compose mail dialog, but there is nothing you can do that emulates the forwarding functionality.
If you can extract from HTML email client Subject and Body of the email then you can do this:
Forward
One major minus is your whole URI inside 'a' can not be longer then 1024 characters.
Oh and don't forget to URL escape subject and body when composing URI string.
Forwarding is not possible.
But I've done some research on the same like as I wanted to promote an event.
I've create this following link,
Spread the word
Hope it helps!
I am not a web developer, but just writing web pages for myself. I have stopped directly putting email addresses into html in order to avoid being captured by bots for spamming purpose or whatever it may be.
I wrote a simple js to concat pieces of information together instead:
function ml(name, dom, sub, body) {
var mailname = name + "#";
var nl = "%C2%A0%0A";
var nlcol = "%3A" + nl;
var dom = dom + ".";
var msg = "mai" + "lto:" + mailname + dom + "com" + "?subject=" + sub + "&body=" + body;
window.location.href = msg;
}
in the html:
<a onclick="ml('emailName', 'domain Name', 'subject string', 'greeting in content or any text in content')" >
<input type="button" value="Share with a friend">
</a>
I have to send an email to several hundred users. Each will have a link tailored to the recipient so I need to generate the emails in script/code - I'm no Notes developer so I can't do this in Notes; I'm using C# and I'm pulling the list out of a SQL database.
There are some constraints:
The site that the link points to uses Integrated Windows Authentication.
The sender wants the link to be a button, rather than text.
The vast majority of recipients are running Lotus Notes 7.
I've tried creating an HTML mail but have had problems:
If I use a form with a submit button and action that points to the link, Notes tries to use its internal browser which fails (because the site uses Integrated Windows Authentication).
If I use an a href tag with an img tag in it, pointing to an image on a webserver, Notes refuses to display the image - i just get the red x box, even though the tags are valid if embedded in a web page.
Anyone know how I can do this?
I finally found a method that works: embedding the image in the email itself. I found the solution here. I'll include the critical stuff here, just in case.
There are three key components to the email: the plain text version, the html version and the image, all consructed as AlternateViews:
string imagePath = #"C:\Work\images\clickhere.jpg";
AlternateView imageView = new AlternateView(imagePath, MediaTypeNames.Image.Jpeg);
imageView.ContentId = "uniqueId";
imageView.TransferEncoding = TransferEncoding.Base64;
:
//loop to generate the url and send the emails containing
AlternateView plainTextView = AlternateView.CreateAlternateViewFromString(
BuildPlainTextMessage(url), null, "text/plain");
AlternateView htmlView = AlternateView.CreateAlternateViewFromString(
BuildHtmlMessage(url), null, "text/html");
//set up MailAddress objects called to and from
:
MailMessage mail = new MailMessage(from, to);
mail.Subject = "ACTION REQUIRED: Do this by then or else";
mail.AlternateViews.Add(plainTextView);
mail.AlternateViews.Add(htmlView);
mail.AlternateViews.Add(imageView);
//send mail using SmtpClient as normal
:
//endloop
BuildHtmlMessage(string) and BuildPlainTextMessage(string) just return strings containing the messages. BuildHtmlMessage includes this to display the image in a link to 'url':
sb.AppendLine("<div>");
sb.AppendFormat("<a href=\"{0}\" target=\"_blank\">", url);
sb.Append("<img alt=\"Click here button image\" hspace=0 src=\"cid:uniqueId\" ");
sb.Append("align=baseline border=0 >");
sb.Append("</a>");
sb.AppendLine("</div>");
Hope this is of use to someone else, sometime.
I imagine no matter what link you use (button, text), you're going to run into that same problem where the Notes client launches its internal browser. That's a preference on the Notes client, and it could be different on all machines.
I would first try a standard text link to see if it has the same behavior. Maybe if that does work for some reason, you at least can deliver a workaround.
Regarding the image issue - is the image coming from the server using Windows Authentication? Make sure the image is open to the public and doesn't require authentication to see it (test in Firefox, and if you don't get a password prompt, you're safe)
I hate to say it, but you might have to request users copy a URL from their email to a specific browser. At least you'd know that would work.
I agree with Ken on the preference for the internal browser. The image not displaying - showing a red x - might be a preference also. I don't recall if it was available in R7, but in R8 there is a preference to not show remote images automatically. It is a security feature. It could also be a proxy issue - if they would have to login to their internet proxy server to get to the internet, and your image is on the internet...
There is also this but it fires off a security warning to the user with my Notes config:
<input type='button'
onclick=document.location.href='http://server/path';
value='Click here'
id='buttonID' class='button'
xstyle='background-color:red;color:white;'/>