top of page
Search

Enhancing Security for External Links: A Guide for Institutions

Writer: Amanda Foster
Amanda Foster
Jan 5
3 min read

Updated: Sep 2

When you add `target="_blank"` to external links, you might be creating security vulnerabilities and exposing user privacy. Here's how to fix it and test your site in just a few minutes.


Understanding the Risks of External Links


External links that open in new tabs create two critical issues:


1. Tabnabbing Attacks


Tabnabbing is a sneaky technique. The new page can access `window.opener`, allowing malicious sites to manipulate your original page. This could redirect users to convincing phishing sites. Imagine clicking a link, only to find yourself on a fraudulent page that looks just like the one you trusted. Scary, right?


2. Privacy Leaks


External sites can receive detailed referrer information. This can expose search queries, session data, and sensitive browsing patterns. It’s like leaving your diary open for anyone to read. You wouldn’t want that, would you?


The Simple Fix: How to Prevent Tabnabbing and Privacy Leaks


To prevent these vulnerabilities, use the following code:


Add `rel="noopener noreferrer"` to all external links with `target="_blank"`:


<!-- UNSAFE -->

<a href="https://external-site.com" target="_blank">External Link</a>


<!-- SAFE -->

<a href="https://external-site.com" target="_blank" rel="noopener noreferrer">External Link</a>


  • noopener: Prevents access to your original window.

  • noreferrer: Blocks referrer information from being sent.


Implementation Examples


HTML


```html

<a href="https://external-database.com" target="_blank" rel="noopener noreferrer">

View External Resource

</a>

```


Rails ERB


```erb

<%= link_to "External Site", external_url, target: "_blank", rel: "noopener noreferrer" %>

```


JavaScript


```javascript

const link = document.createElement('a');

link.target = '_blank';

link.rel = 'noopener noreferrer';

```


Test Your Site Right Now


Quick Console Audit


Run this JavaScript in your browser's console to audit all external links on any page:


```javascript

// Audit external links on current page

function auditExternalLinks() {

const links = document.querySelectorAll('a[target="_blank"]');

let report = 'EXTERNAL LINKS SECURITY AUDIT:\n\n';

links.forEach((link, i) => {

const href = link.href;

const rel = link.getAttribute('rel') || 'none';

const isExternal = href.match(/^https?:\/\//) &&

!href.includes(window.location.hostname);

if (isExternal) {

const hasNoopener = rel.includes('noopener');

const hasNoreferrer = rel.includes('noreferrer');

const status = (hasNoopener && hasNoreferrer) ? '✅ SECURE' : '❌ VULNERABLE';

report += `${i+1}. ${href}\n`;

report += ` rel="${rel}"\n`;

report += ` Status: ${status}\n\n`;

}

});

console.log(report || 'No external links found');

}


auditExternalLinks();

```


Manual Testing


Test for window.opener vulnerability:

  1. Click an external link with `target="_blank"`.

  2. In the new tab, open Developer Tools (F12).

  3. In the console, type: `window.opener`.

  4. Secure result: null.

  5. Vulnerable result: Window {parent: Window, ...}.


Test for referrer leaks:

  1. Open Developer Tools → Network tab.

  2. Click an external link.

  3. Find the request to the external domain.

  4. Check Headers → Request Headers for Referer:

  5. Secure: No referrer header present.

  6. Vulnerable: Shows your site's URL and potentially sensitive paths.


Why This Matters


This is especially critical for:


  • Library systems: Research queries shouldn't be exposed to external databases.

  • Healthcare portals: Patient information must stay confidential.

  • Financial applications: Account activity requires protection.

  • E-commerce sites: Shopping behavior should remain private.


Quick Security Checklist


  • [ ] All external links with `target="_blank"` include `rel="noopener noreferrer"`.

  • [ ] JavaScript-generated external links include security attributes.

  • [ ] Testing confirms `window.opener` is null in new tabs.

  • [ ] Testing confirms no referrer information leaks.


Note on Internal Links


You only need these attributes on external links. Internal navigation within your domain is safe:


<!-- Internal links - no attributes needed -->

<a href="/internal-page" target="_blank">Internal Link</a>


<!-- External links - security attributes required -->

<a href="https://external-site.com" target="_blank" rel="noopener noreferrer">External</a>


Conclusion


Adding `rel="noopener noreferrer"` to external links is a simple fix that prevents serious security vulnerabilities and privacy breaches. Use the console audit script above to test your site today, and make this part of your standard development workflow. The few minutes spent implementing this protection could save you from significant security incidents down the road.


Additional Resources


For more information on securing your digital assets, consider exploring Notch8's services. We aim to be the go-to expert for institutions looking to build and maintain robust digital repositories, ensuring that scholarly and cultural content is easily accessible and preserved for the long term.


By taking these steps, you not only enhance security but also build trust with your users. After all, a secure browsing experience is a happy browsing experience!

bottom of page