For Developers

Guides integration prets production pour les equipes qui ont besoin d une livraison HTML crawler-safe sur des sites JavaScript.

Demarrage rapide

Le modele le plus rapide place SeoRender devant votre app uniquement pour le trafic crawler. Le trafic humain reste sur l origin.

Creer votre compte et token API dans panel.seorender.io.
Configurer la detection crawler dans middleware, Nginx ou edge proxy.
Transmettre les requetes crawler vers /edge avec URL complete.
Activer des triggers recache apres publication de contenu.

Plateformes supportees

SeoRender fonctionne avec React, Vue, Angular, Svelte et stacks JavaScript custom car le rendering est gere a la couche edge.

Edge proxy (Node.js)

Configurez les variables d environnement et lancez l edge proxy devant votre origin.

typescriptmiddleware.ts

Next.js middleware example

1// middleware.ts (Next.js App Router)
2import { NextRequest, NextResponse } from "next/server";
3
4const BOT_PATTERN = /(googlebot|bingbot|duckduckbot|chatgpt-user|perplexitybot)/i;
5
6export async function middleware(request: NextRequest) {
7  const userAgent = request.headers.get("user-agent") ?? "";
8  if (!BOT_PATTERN.test(userAgent)) return NextResponse.next();
9
10  const edgeUrl = `https://bot.seorender.io/edge/${encodeURIComponent(request.nextUrl.toString())}`;
11
12  const prerender = await fetch(edgeUrl, {
13    headers: {
14      "X-SeoRender-Token": process.env.SEORENDER_TOKEN ?? "YOUR_TOKEN",
15      "X-Forwarded-Host": request.headers.get("host") ?? "",
16    },
17  });
18
19  if (!prerender.ok) return NextResponse.next();
20  const html = await prerender.text();
21  return new NextResponse(html, {
22    status: 200,
23    headers: { "content-type": "text/html; charset=utf-8" },
24  });
25}
26
27export const config = {
28  matcher: ["/((?!api|_next|.*\\..*).*)"],
29};

typescript.env.local + proxy

Exemple middleware Node.js

1// .env.local
2ORIGIN_BASE_URL=https://your-app.com
3API_BASE_URL=https://bot.seorender.io
4SEORENDER_TOKEN=your-token
5EDGE_PROXY_PORT=8080
6
7// Start proxy
8npm run dev:proxy

javascriptworker.js

Exemple Cloudflare Worker

1export default {
2  async fetch(request, env) {
3    const ua = request.headers.get("user-agent") || "";
4    const isBot = /(googlebot|bingbot|duckduckbot|yandex|chatgpt-user)/i.test(ua);
5
6    if (!isBot) {
7      return fetch(request);
8    }
9
10    const target = `https://bot.seorender.io/edge/${encodeURIComponent(request.url)}`;
11
12    return fetch(target, {
13      headers: {
14        "x-seorender-token": env.SEORENDER_TOKEN,
15        "x-forwarded-host": new URL(request.url).host
16      }
17    });
18  }
19};

Configuration Nginx

Ajoutez des conditions crawler et transferez le trafic bot en gardant le trafic humain sur votre application.

nginxnginx.conf

Exemple Nginx bot-routing

1map $http_user_agent $is_crawler {
2  default 0;
3  ~*googlebot 1;
4  ~*bingbot 1;
5  ~*duckduckbot 1;
6  ~*chatgpt-user 1;
7  ~*perplexitybot 1;
8}
9
10location / {
11  if ($is_crawler = 1) {
12    proxy_pass https://bot.seorender.io/edge/$scheme://$host$uri;
13    proxy_set_header X-SeoRender-Token YOUR_TOKEN;
14    proxy_set_header X-Forwarded-Host $host;
15    break;
16  }
17  proxy_pass http://app_upstream;
18}

Reference API

Utilisez les endpoints recache et render pour garder le contenu indexe a jour apres chaque publication.

shellapi-check.sh

Verification rapide endpoint REST (cURL)

1# POST /recache
2curl -X POST "https://bot.seorender.io/recache" \
3  -H "Content-Type: application/json" \
4  -H "X-SeoRender-Token: YOUR_TOKEN" \
5  -d '{"url":"https://example.com/page"}'
6
7# GET /render
8curl "https://bot.seorender.io/render?url=https://example.com" \
9  -H "X-SeoRender-Token: YOUR_TOKEN"
10
11# GET /edge
12curl "https://bot.seorender.io/edge/https%3A%2F%2Fexample.com" \
13  -H "X-SeoRender-Token: YOUR_TOKEN" \
14  -H "User-Agent: googlebot"

Exemples client

Declenchez recache et verifiez les pages rendues avec le langage de votre choix.

javascriptrecache.js

Node.js (fetch)

1const endpoint = "https://bot.seorender.io/recache";
2const token = process.env.SEORENDER_TOKEN;
3const url = "https://example.com/pricing";
4
5const response = await fetch(endpoint, {
6  method: "POST",
7  headers: {
8    "content-type": "application/json",
9    "x-seorender-token": token ?? ""
10  },
11  body: JSON.stringify({ url })
12});
13
14if (!response.ok) {
15  throw new Error("Recache failed: " + response.status);
16}

pythonrecache.py

Python (requests)

1import requests
2
3endpoint = "https://bot.seorender.io/recache"
4token = "YOUR_TOKEN"
5payload = {"url": "https://example.com/pricing"}
6
7response = requests.post(
8    endpoint,
9    headers={"X-SeoRender-Token": token},
10    json=payload,
11    timeout=10,
12)
13response.raise_for_status()

gorecache.go

Go (net/http)

1package main
2
3import (
4  "bytes"
5  "net/http"
6)
7
8func main() {
9  body := []byte(`{"url":"https://example.com/pricing"}`)
10  req, _ := http.NewRequest("POST", "https://bot.seorender.io/recache", bytes.NewBuffer(body))
11  req.Header.Set("Content-Type", "application/json")
12  req.Header.Set("X-SeoRender-Token", "YOUR_TOKEN")
13
14  client := &http.Client{}
15  resp, err := client.Do(req)
16  if err != nil { panic(err) }
17  defer resp.Body.Close()
18}

phprecache.php

PHP (cURL)

1<?php
2$ch = curl_init("https://bot.seorender.io/recache");
3
4curl_setopt_array($ch, [
5  CURLOPT_POST => true,
6  CURLOPT_HTTPHEADER => [
7    "Content-Type: application/json",
8    "X-SeoRender-Token: YOUR_TOKEN"
9  ],
10  CURLOPT_POSTFIELDS => json_encode(["url" => "https://example.com/pricing"]),
11  CURLOPT_RETURNTRANSFER => true
12]);
13
14$result = curl_exec($ch);
15curl_close($ch);

Checklist implementation

Les balises canonical et hreflang sont coherentes sur les pages rendues.
Les directives robots autorisent l indexation des pages critiques.
Les templates critiques sont couverts par des hooks recache apres update.
Search Console et analytics sont suivis apres mise en ligne.

Depannage

Si les bots recoivent du HTML vide, verifier detection user-agent et regles proxy.
Si d anciens contenus apparaissent en SERP, declencher recache pour les URLs concernees.
Si une seule langue est indexee, verifier canonical et alternates par locale.

Besoin d aide implementation ? Contactez notre equipe.

Contacter le support