경로 라우팅을 사용하면 기존 사이트는 그대로 유지하면서 특정 경로(예: /a/*)에서 Anymorph 페이지를 제공할 수 있습니다. DNS 변경이 필요 없습니다.
yourdomain.com/a/* → Anymorph 페이지
yourdomain.com/* → 기존 사이트
사전 요구사항
- Anymorph 대시보드의 워크스페이스 슬러그
- 프록시 URL:
https://{slug}.proxy.anymorph.app
플랫폼별 설정
Vercel
Netlify
Cloudflare Pages
AWS CloudFront
Nginx
기타
vercel.json에 재작성 규칙을 추가하세요:{
"rewrites": [
{
"source": "/a/:path*",
"destination": "https://your-slug.proxy.anymorph.app/a/:path*"
}
]
}
your-slug를 워크스페이스 슬러그로 교체한 후 배포하세요.
{
"rewrites": [
{
"source": "/api/:path*",
"destination": "https://api.example.com/:path*"
},
{
"source": "/a/:path*",
"destination": "https://your-slug.proxy.anymorph.app/a/:path*"
}
]
}
{
"rewrites": [...],
"headers": [
{
"source": "/a/:path*",
"headers": [
{
"key": "Cache-Control",
"value": "public, max-age=3600, stale-while-revalidate=86400"
}
]
}
]
}
netlify.toml에 추가하세요:[[redirects]]
from = "/a/*"
to = "https://your-slug.proxy.anymorph.app/a/:splat"
status = 200
force = true
또는 _redirects 파일을 사용하세요:/a/* https://your-slug.proxy.anymorph.app/a/:splat 200
_redirects 파일에 추가하세요:/a/* https://your-slug.proxy.anymorph.app/a/:splat 200
더 세밀한 제어가 필요하면 Cloudflare Worker를 사용하세요:export default {
async fetch(request) {
const url = new URL(request.url);
if (url.pathname.startsWith('/a/')) {
const proxyUrl = new URL(url.pathname + url.search,
'https://your-slug.proxy.anymorph.app');
return fetch(proxyUrl.toString());
}
return fetch(request);
}
};
1. Anymorph를 오리진으로 추가:
- 오리진 도메인:
your-slug.proxy.anymorph.app
- 프로토콜: HTTPS 전용
2. 캐시 동작 생성:
- 경로 패턴:
/a/*
- 오리진: Anymorph 오리진 선택
- 캐시 정책:
CachingOptimized
location /a/ {
proxy_pass https://your-slug.proxy.anymorph.app;
proxy_ssl_server_name on;
proxy_set_header Host your-slug.proxy.anymorph.app;
}
proxy_cache_path /var/cache/nginx/anymorph
levels=1:2 keys_zone=anymorph_cache:10m max_size=100m;
location /a/ {
proxy_cache anymorph_cache;
proxy_cache_valid 200 1h;
proxy_cache_use_stale error timeout http_502 http_503;
proxy_pass https://your-slug.proxy.anymorph.app;
proxy_ssl_server_name on;
proxy_set_header Host your-slug.proxy.anymorph.app;
}
리버스 프록시가 /a/*를 다음으로 전달하도록 설정하세요:https://your-slug.proxy.anymorph.app/a/...
Apache:<Location "/a/">
ProxyPass "https://your-slug.proxy.anymorph.app/a/"
ProxyPassReverse "https://your-slug.proxy.anymorph.app/a/"
RequestHeader set Host "your-slug.proxy.anymorph.app"
</Location>
Caddy:handle /a/* {
reverse_proxy https://your-slug.proxy.anymorph.app {
header_up Host your-slug.proxy.anymorph.app
}
}
Traefik:http:
routers:
anymorph:
rule: "PathPrefix(`/a`)"
service: anymorph
services:
anymorph:
loadBalancer:
servers:
- url: "https://your-slug.proxy.anymorph.app"
테스트
설정 후 /__check__ 엔드포인트로 연결 상태를 확인하세요:
curl https://yourdomain.com/a/__check__
정상 연결 시:
{"status": "connected", "domain": "yourdomain.com"}
연결 실패 시:
{"status": "not_configured", "message": "Domain not found in proxy configuration"}
/__check__는 프록시 연결 상태만 확인합니다. 실제 페이지가 배포되었는지는 해당 경로에 직접 접속해서 확인하세요.
커스텀 경로 접두사
다른 경로 접두사를 사용할 수 있습니다. 소스 패턴만 업데이트하세요:
{
"rewrites": [
{
"source": "/compare/:path*",
"destination": "https://your-slug.proxy.anymorph.app/a/:path*"
}
]
}
이제 yourdomain.com/compare/x-vs-y가 Anymorph 페이지에 매핑됩니다.
문제 해결
워크스페이스 슬러그가 잘못되었습니다. Anymorph 대시보드를 확인하세요.
- 구성 파일이 올바른 위치에 있는지 확인
- 문법 오류 확인
- 변경 후 재배포
첫 요청은 더 느릴 수 있습니다. 더 나은 성능을 위해 캐싱을 활성화하세요.
프록시 구성에 다음이 포함되어 있는지 확인하세요:
proxy_ssl_server_name on (Nginx)
- HTTPS 전용 오리진 프로토콜 (CloudFront)