惯性聚合 高效追踪和阅读你感兴趣的博客、新闻、科技资讯
阅读原文 在惯性聚合中打开

推荐订阅源

Last Week in AI
Last Week in AI
D
DataBreaches.Net
腾讯CDC
Recent Announcements
Recent Announcements
有赞技术团队
有赞技术团队
A
About on SuperTechFans
Cyber Security Advisories - MS-ISAC
Cyber Security Advisories - MS-ISAC
Google DeepMind News
Google DeepMind News
Microsoft Security Blog
Microsoft Security Blog
云风的 BLOG
云风的 BLOG
罗磊的独立博客
月光博客
月光博客
MyScale Blog
MyScale Blog
U
Unit 42
Martin Fowler
Martin Fowler
Stack Overflow Blog
Stack Overflow Blog
T
Tailwind CSS Blog
Engineering at Meta
Engineering at Meta
N
Netflix TechBlog - Medium
G
Google Developers Blog
博客园 - 【当耐特】
D
Docker
I
InfoQ
雷峰网
雷峰网

Netlify Developers

AI model comparison using Netlify's AI Gateway | Netlify Developers Build an AI agent to automatically process and summarize form submissions | Netlify Developers Build an AI agent to automatically generate relevant images for blog posts | Netlify Developers Prerendering SPA content pages to enable AI agent access | Netlify Developers Identify image optimization opportunities with Netlify Observability | Netlify Developers Fix top 404 page not found errors with Netlify Observability | Netlify Developers Introducing AI Gateway: built-in AI model access on Netlify | Netlify Developers Introducing Observability: your project insights on Netlify | Netlify Developers From first publish to first update with AI agents | Netlify Developers How to use Agent Runners on Netlify | Netlify Developers Add forms to your project with AI + Netlify | Netlify Developers Track Real User Metrics | Netlify Developers Lighthouse performance scores on Netlify | Netlify Developers Review your AI project before you ship | Netlify Developers Using environment variables in AI Projects on Netlify | Netlify Developers Build prototypes and MVPs fast with AI + Netlify | Netlify Developers Pause auto-publishing on Netlify | Netlify Developers Run serverless functions, storage, and more natively in Nuxt dev | Netlify Developers Netlify Office Hours: The AX Arcade challenge | Netlify Developers Netlify Office Hours: Prompting with style | Netlify Developers Netlify Office Hours: RAG Apps with OpenAI + Netlify DB | Netlify Developers How to build a RAG application with Neon, Netlify & OpenAI | Netlify Developers Netlify Office Hours: Netlify DB (powered by Neon) | Netlify Developers Netlify Office Hours: Netlify MCP Server | Netlify Developers Netlify Office Hours: Netlify Vite Plugin | Netlify Developers Building MCPs with Netlify | Netlify Developers Deploying sites from your AI tool | Netlify Developers Adding your domain using Netlify API | Netlify Developers Build a context driven chat bot with Netlify Blob and OpenAI | Netlify Developers Simplify deployments with Netlify’s branch-matching environment variables | Netlify Developers
Blocking AI bots and controlling crawlers | Netlify Devel...
2024-08-21 · via Netlify Developers

AI offers some incredible opportunities as a tool for developers, but we might not want all of the many AI services out there scraping everything we publish on our web sites to be used as their training content. There are ways to tell these bots not to crawl our data, and Netlify Edge Functions can help make this pretty straightforward.

Play

#TL;DR

We’ll look at two important mechanisms to block AI bots from scraping your sites, and implement them with a simply generated config file and with an Edge Function.

Deploy and play

If you prefer to go straight to deploying your own copy of an example, you can do that by clicking the button below

Deploy to Netlify

The simplest way to disallow bots from crawling your sites is to state this in a robots.txt file served from the root of your site. A robots.txt file is designed to instruct web crawlers about what content on your site they can and cannot access.

#Generating your robots.txt file for convenience

The robots.txt file will need to include a rule declaration for every known AI bot you wish to ban from scraping your content. Since the list of known AI bots is rather long, and likely to get longer, it can be helpful to generate the file in order to avoid typos and errors. It also means we can reuse the same single list of AI bots for something else… we’ll get to that later.

Most, if not all web frameworks make it trivial to generate a file from some data. For the sake of illustration, I’ve not used a framework for this example, and instead just made a tiny build script which adds the following declaration to a robots.txt file for every item it finds in a seperate list of User Agent strings for know AI crawlers.

The declaration we need for each bot:

User-agent: AGENT_NAME

Disallow: /

Here’s out list of AI bots held in a .json file for convenience:

[

"AdsBot-Google",

"Amazonbot",

"anthropic-ai",

"Applebot",

"AwarioRssBot",

"AwarioSmartBot",

"Bytespider",

"CCBot",

"ChatGPT",

"ChatGPT-User",

...

]

There’s nothing special about that little node script to make the file. You can see it here if you’re curious: build.js

Serve the resulting robots.txt file from the root of your site, and AI crawlers should honor it and not scrape the content of your site.

“Should”.

Sadly, not all AI products repsect the rules found in a robots.txt file, so we need to reach for another option for additional confidence:

#Blocking HTTP requests based on the User Agent String using an Edge Function

Edge Functions give us a low latency, high performance way to filter the requests being made to any resources in our sites.

Adding an Edge Function to a site is as simple as adding a TypeScript or JavaScript file to your site at this location, where Netlify knows to look for your Edge Functions:

/netlify/edge-functions/

Here’s an Edge Function that compares the User Agent string of the incoming HTTP request and compares it to our list of known AI bots, returning those requests an HTTP 401 response, while letting all other requests proceed as normal. It uses the same list of AI bots that we created to feed our robots.txt file. So that’s handy.

import { Config } from "@netlify/edge-functions";

import agents from "../../agents.json" with { type: "json" };

export default async (request: Request) => {

// Get the user agent string of the requester

const ua = request.headers.get('user-agent');

// Check against our list of known AI bots

let isBot = false;

agents.forEach(agent => {

if (ua.toLowerCase().includes(agent.toLowerCase())) {

isBot = true;

return;

}

})

// If the requester is an AI bot, disallow with a 401

if(isBot) {

return new Response(null, { status: 401 });

}

// Otherwise, continue with the request as normal

else {

return;

}

};

// This edge function is executed for all requests across the site

export const config: Config = {

path: "*",

};

Sadly, some bots have been found to mis-report their names in their User Agent strings, so we can’t rely on that technique alone either. Doubing-up and using both of these techniques should do the trick.

#Turning this into a utility

Those who operate multiple sites might find that this type of facility could be useful multiple times. It feels like a good contender to be packaged up as an integration which could be enabled with a couple of clicks for any of your sites.

To learn about how to do that, I’d recommend this guide on creating a Netlify Integration to insert Edge Functions into a site.

#Acknowledgements

This guide was inspired by the approaches taken and documented in these great posts: