agentic

OpenClaw: 웹사이트를 안전하게 게시하는 방법1 min read

Reading Time: 6 minutesOpenClaw: 범위 에이전트 권한을 사용하여 웹 사이트를 구축 및 게시하고, 파일을 테스트하고, 호스트 또는 공유 아티팩트를 통해 배포하고, 공개 URL을 확인합니다.

OpenClaw publishing a website cover

OpenClaw: 웹사이트를 안전하게 게시하는 방법1 min read

Reading Time: 6 minutes

OpenClaw는 웹사이트 구축에 도움을 줄 수 있지만 웹사이트 호스트는 아닙니다. 에이전트에게 소스 파일을 생성하고, 사이트를 로컬로 실행하고, 브라우저에 표시되는 내용을 수정하도록 요청하세요. 그런 다음 제어하는 ​​호스팅 플랫폼을 통해 배포하거나 검토 가능한 AgentGrid.io 아티팩트에 프로젝트를 배치하고 사람의 승인 후에만 게시하세요. 채팅 스크린샷, 로컬 포트 ​​또는 개인 아티팩트 URL은 고객이 접하는 실행 URL이 아닙니다.

이 가이드는 파일 및 명령 도구와 함께 OpenClaw 에이전트를 사용하는 빌더를 위한 것입니다. 가장 중요한 결정은 권한 경계입니다. 에이전트는 프로덕션 자격 증명을 보유하지 않고도 초안을 작성하고 테스트할 수 있습니다. 팀이 출시 전에 하나의 공유 버전을 검사해야 하는 경우, AgentGrid.io 작업공간 시작 별도의 승인된 작업으로 계속 게시하세요.

OpenClaw가 구축한 웹사이트에 안정적인 집을 제공하는 방법

먼저 AgentGrid.io를 준비한 다음 OpenClaw에 제한된 액세스 권한을 부여하고 채팅 외부에서 결과를 확인하세요.

1단계: AgentGrid.io 작업 공간 선택

app.agentgrid.io에 로그인하고 이 웹사이트에 대한 팀과 작업 공간을 선택하세요. 초안에 고객 자료가 포함된 경우 제한된 작업 공간을 사용하십시오. 공개 배포 전에 누가 검토할지 계획하세요.

에이전트 초대가 강조 표시된 AgentGrid.io 작업 공간
AgentGrid.io 작업 영역에서 에이전트 초대는 지원되는 연결을 시작합니다.

2단계: 이 OpenClaw 에이전트를 제한된 권한 부여와 연결

OpenClaw 대화에서 다음과 같이 말합니다. Use agentgrid.io for this website. If you can run shell commands, run npx @animaapp/cli@latest login and return the verification URL and code. Do not ask for my password or publish anything. 원하는 작업 영역과 읽기 및 쓰기로 직접 확인을 승인합니다. 필요하지 않은 경우 공유 및 게시를 꺼진 상태로 두세요. OpenClaw에게 실행을 요청하세요. npx @animaapp/cli@latest workspaces 원하는 작업공간이 나열되어 있는지 확인하세요. 무인 상담원의 경우 상담원 관리 → 상담원 초대를 이용하세요. 기본 공유 및 게시 기능을 선택 해제하고 작업 영역을 선택한 다음 일회성 링크를 비공개로 전달하세요. 초대장을 만드는 것만으로는 연결되지 않습니다. 셸 실행이 비활성화된 경우 직접 액세스 권한이 있다고 주장하는 대신 수동 가져오기를 사용하세요.

3단계: 로그뿐만 아니라 아티팩트 빌드 및 검사

OpenClaw에 포함된 작업을 제공합니다. 일정, 발표자 카드, 등록 링크가 포함된 반응형 이벤트 마이크로사이트를 구축하세요. 승인된 사본과 자산을 사용하고, 로컬에서 페이지를 확인하고, 선택한 작업 공간에 프로젝트를 AgentGrid.io에 앱으로 배치합니다. 게시하지 마십시오. CLI 가져오기 명령을 사용하도록 하세요. npx @animaapp/cli@latest create -t import --from ./project --artifact-type app --workspace <workspace-id> 실제 폴더와 검색된 작업공간 ID를 사용합니다. 반환된 아티팩트 URL을 열고 파일을 확인하고 미리 봅니다. 사이트에는 다음과 같은 진입점이 필요합니다. index.html; 비밀 업로드를 피하세요. node_modules, 또는 출력을 빌드합니다. OpenClaw가 연결할 수 없는 경우 생성된 프로젝트 폴더 또는 ZIP을 가져와 AgentGrid.io의 New 메뉴를 통해 가져옵니다. 그것은 살아있는 거울이 아닌 새로운 유물입니다. 반복 작업의 경우 에이전트에 기존 아티팩트 URL을 제공하고 해당 아티팩트를 업데이트하도록 요청한 다음 기록을 확인하여 어떤 ID가 이를 변경했는지 확인하세요.

AgentGrid.io의 White Lotus 데모 웹사이트 아티팩트
AgentGrid.io의 웹사이트 아티팩트 예: White Lotus 데모는 해당 버전이 검토되는 동안 비공개입니다.

4단계: 게시 승인 및 실제 URL 확인

주장, 접근성 기본 사항, 모바일 동작 및 대상 링크를 검토하세요. 그런 다음에만 AgentGrid.io에서 게시를 사용하거나 의도적으로 해당 기능을 부여한 경우 OpenClaw에 명시적인 게시 지침을 제공하세요. 로그아웃된 브라우저에서 공개 URL을 열고 현재 버전이 있는지 확인하세요. 익명 방문자에게는 비공개 링크가 작동하지 않습니다. 승인된 각 업데이트를 게시합니다. 자동화 에이전트가 사이트 변경을 중지해야 하는 경우 에이전트 관리에서 해당 액세스 권한을 제거하세요. 이전 작업은 역사에 남아 있습니다.

게시 옵션을 표시하는 AgentGrid.io 공유 메뉴가 업데이트되었습니다.
업데이트된 공유 메뉴에는 승인된 아티팩트를 라이브 웹 사이트로 전환하는 게시가 포함되어 있습니다.

OpenClaw가 수행하는 작업과 수행하지 않는 작업

OpenClaw의 시작하기 문서 게이트웨이 및 구성된 채널을 통해 액세스되는 에이전트에 대해 설명합니다. 해당 도구는 활성화되면 파일 및 명령과 함께 작동할 수 있습니다. 브라우저 도구는 페이지 검사에 도움이 되지만 게이트웨이 대시보드 또는 브라우저 세션은 공개 웹 사이트 배포가 아닙니다. OpenClaw의 임원 승인 명령 가능 에이전트는 파일을 수정하거나 호스트의 배포 CLI를 호출할 수 있으므로 샌드박스 설정이 중요합니다. 현재 단계에 필요한 액세스 권한만 부여하세요.

1단계: 제한된 웹 사이트 작업 만들기

에이전트에 프로젝트 작업공간과 필요한 파일 및 실행 도구가 있는지 확인하세요. 전체 홈 디렉터리가 아닌 깨끗한 폴더나 저장소를 선택하세요. 승인된 로고, 사진, 사본 및 비즈니스 정보를 제공하세요. 초기 랜딩 페이지 구축을 위해 배포 토큰이나 고객 데이터를 제공하지 마세요. 프레임워크의 이름을 지정하거나 서버측 기능이 필요하지 않은 경우 정적 사이트를 요청하세요.

예시 프롬프트: “자전거 사이트 폴더에 지역 자전거 수리점을 위한 반응형 단일 페이지 사이트를 만듭니다. 서비스, 시간, 서비스 지역 및 견적 요청 클릭 유도 문구를 포함합니다. 시맨틱 HTML 및 액세스 가능한 CSS를 사용합니다. 확인되지 않은 주소, 가격 및 추천을 자리 표시자로 표시합니다. 소스와 공용 자산을 함께 유지합니다. 미리 보고 사용 가능한 검사를 실행하는 방법을 알려주십시오. 자격 증명을 배포, 게시 또는 사용하지 마십시오.”

OpenClaw에게 진입점, 디렉터리 트리, 종속성, 설치/빌드 명령 및 변경된 파일 목록을 반환하도록 요청하세요. 정적 앱은 index.html를 사용할 수 있습니다. 프레임워크 앱에는 매니페스트와 스크립트가 필요합니다. 로컬 미리보기와 대상 호스트의 빌드 출력을 설명하는 README를 요청하세요. 자산이 에이전트 컴퓨터에서만 사용할 수 있는 경로가 아닌 상대 또는 공개 URL을 사용하는지 확인하세요.

2단계: 브라우저에서 테스트하고 실제 결함 수정

프로젝트의 문서화된 로컬 서버 또는 개발 명령을 실행한 다음 렌더링된 사이트를 직접 엽니다. 좁고 넓은 너비, 키보드 탐색, 대비, 이미지 대체, 철자법, 링크 및 전화번호 동작을 확인하세요. 콘솔 오류 및 누락된 이미지를 검사합니다. 프로젝트에서 지원하는 경우 테스트 및 프로덕션 빌드를 실행하세요. 상담원의 스크린샷은 방향을 잡는 데 도움이 되지만 양식 및 메뉴와의 상호 작용을 대체하지는 않습니다.

견적 요청이 스타일이 지정된 양식일 경우 제출물이 어디로 가는지 물어보세요. 검토된 양식 서비스를 연결하거나 작동한다는 주장을 제거하세요. 무해한 제출로 테스트하고 전달을 확인하세요. 상점의 실제 영업 시간, 위치, 사진 라이센스 및 개인 정보 보호 문구를 소유자에게 확인하십시오. 상담원에게 특정 수정 사항을 문의하고 새 미리보기를 이전 미리보기와 비교하세요. 승인된 사본을 자동으로 대체하는 “더 좋게 만드세요”라는 메시지를 피하세요.

프롬프트 수정: “휴대폰 크기의 뷰포트에서 서비스 카드를 읽을 수 있도록 유지하고 키보드로 탐색에 액세스할 수 있도록 합니다. 자리 표시자 연락처 세부 정보는 브리프.md에서 승인된 사실로만 대체합니다. 변경된 각 파일, 테스트 결과 및 나머지 차단 항목을 보고합니다. 호스팅 구성을 건드리거나 게시하지 마세요.” 가능하면 소스 제어에서 승인된 버전을 유지하세요.

3단계: 배포 경계 선택

  • 기존 호스트: 검토된 소스를 커밋하고, 호스트에서 프레임워크 및 빌드 출력을 구성하고, 해당 호스트의 저장소 통합 또는 CLI를 통해 배포합니다. 해당 서비스는 공개 URL을 제공합니다. 브라우저 JavaScript가 아닌 호스트 관리 비밀에 API 키를 보관하세요.
  • AgentGrid.io 공유 아티팩트: 승인을 받은 경우에만 명령 가능 에이전트를 연결하거나 수동으로 폴더/ZIP을 가져옵니다. 개인이 게시하기 전에 공동작업자가 비공개 앱 아티팩트를 검토하도록 합니다. 아티팩트의 기록 및 미리보기는 특정 버전에 대한 승인을 만드는 데 도움이 됩니다.

OpenClaw 제어 UI를 웹 사이트 호스트로 설명하지 마십시오. 로컬 전달 포트는 미리 보기를 위해 개발 프로세스를 공개할 수 있지만 지속 가능한 공개 사이트는 아닙니다. 에이전트에 로그인된 호스팅 계정에 대한 배포 CLI 또는 브라우저 액세스 권한을 부여하는 경우 이를 프로덕션 액세스 권한으로 취급하고 해당 작업에 대한 명시적인 승인을 얻으세요.

4단계: 검토된 프로젝트 연결 또는 가져오기

공유 경로의 경우 AgentGrid.io의 문서화된 연결은 CLI 및 승인 흐름을 사용합니다. 명령 가능 OpenClaw 환경에서 시작 명령은 다음과 같습니다. npx @animaapp/cli@최신 로그인; 확인 링크를 직접 승인하고 원하는 작업 공간과 기능을 선택하세요. 단지 초안을 작성하기 위해 채팅에서 비밀번호를 넘겨주거나 광범위한 출판 권한을 가진 에이전트를 연결하지 마십시오. 연결이 불가능할 경우 문서화된 방법을 사용하십시오. 폴더 또는 ZIP 가져오기.

작은 소스 패키지를 준비합니다. node_modules, 개인 키, 로컬 환경 파일 및 관련 없는 작업 공간을 제외합니다. 진입점, 자산 및 빌드에 필요한 모든 구성을 포함합니다. AgentGrid.io에서 대상 작업 영역을 선택하고 앱 아티팩트를 생성하거나 가져옵니다. 해당 파일과 렌더링된 미리보기를 검사합니다. 성공적인 업로드는 API 경로, 서버 프로세스 또는 양식 통합이 올바르게 전송되었다는 증거가 아닙니다.

핸드오프 프롬프트: “액세스를 승인한 후 지정된 AgentGrid.io 작업 공간의 자전거 사이트에서 게시되지 않은 앱 아티팩트를 생성합니다. 소스 및 공개 자산만 포함합니다. 비공개 URL을 반환하고, 누락된 런타임 기능을 식별하고, 수정을 위해 동일한 아티팩트를 업데이트합니다. 다른 에이전트를 초대하거나 게시하거나 다른 작업 공간을 선택하지 마세요.” 작업 공간에 도달할 수 없으면 조용히 목적지를 변경하는 대신 중지하세요.

5단계: 승인된 버전 검토 및 게시

팀원에게 아티팩트 미리보기, 특히 모바일 레이아웃, 연락처 세부정보, 견적 양식 및 키보드 액세스를 테스트하도록 요청하세요. 동일한 아티팩트 또는 소스 저장소에서 피드백을 조정하고 릴리스 승인된 개정을 식별합니다. 기존 호스트를 사용하여 승인된 커밋을 배포하고 배포 세부 정보를 검토합니다. AgentGrid.io를 사용하면 게시 권한이 있는 사람이 게시 제어 공개 URL을 생성합니다. 에이전트 초대 및 비공개 아티팩트 공유는 게시 단계가 아닙니다.

전화를 포함하여 로그아웃한 동안 공개 주소를 엽니다. HTTPS, 메타데이터, 링크, 이미지, 양식 전달을 확인하세요. 승인된 미리보기와 비교해 보세요. 다른 경우 발표하기 전에 배포된 커밋 또는 아티팩트 버전, 빌드 설정, 비밀 및 캐싱을 조사하세요. 로컬 파일을 편집한다고 해서 게시된 아티팩트가 반드시 업데이트되는 것은 아닙니다.

초안 허가와 출판 허가를 분리하는 이유는 무엇입니까?

이를 통해 에이전트는 코드를 반복하고 사람은 방문자가 보는 내용을 제어할 수 있습니다. OpenClaw의 도구 및 승인 구성은 사이트 콘텐츠 검토 또는 호스트 배포 권한을 대체하지 않습니다. 에이전트의 파일 시스템 범위를 제한하고, 타사 도구를 설치하기 전에 확인하고, 웹 페이지 또는 가져온 프로젝트에서 검토되지 않은 명령을 실행하지 마십시오. 소스 제어 검토, 아티팩트 승인 및 공개 릴리스를 세 가지 개별 게이트로 처리합니다.

다음 업데이트를 의도적으로 수행

승인된 버전과 공개 URL을 기록하세요. 새로운 수정사항은 검토 후 다시 게시될 때까지 초안입니다.

자주 묻는 질문

OpenClaw는 웹사이트를 호스팅합니까?

OpenClaw는 여기에 설명된 공개 호스팅 대상이 아닌 에이전트 및 도구 환경입니다. 지속 가능한 공개 URL을 위해 웹 호스트 또는 별도로 게시된 앱 아티팩트를 사용하세요. 게이트웨이 대시보드 또는 로컬 미리보기는 해당 URL이 아닙니다.

에이전트 프로덕션 자격 증명을 제공하지 않고 게시할 수 있나요?

그렇습니다. 제한된 작업 공간 내에서 초안을 작성하고 테스트한 다음 호스팅 제공업체의 배포 워크플로 또는 AgentGrid.io의 게시 컨트롤을 사용하도록 합니다. 배포 준비를 돕는 에이전트라도 필요하지 않은 비밀을 받아서는 안 됩니다.

가져온 아티팩트가 올바르게 보이지만 형식이 실패하면 어떻게 되나요?

원본 사이트가 서버 경로, 환경 변수 또는 이전되지 않은 타사 서비스를 사용했는지 확인하세요. 출시 전에 새로운 환경에서 실제 제출을 테스트해 보세요. 시각적 미리보기를 기능 검증으로 취급하지 마십시오.

OpenClaw 폴더의 변경 사항이 라이브 사이트를 업데이트합니까?

일반적인 경우에는 자동으로 발생하지 않습니다. 업데이트는 호스트의 빌드 및 배포 파이프라인이나 명시적인 업데이트 및 별도 아티팩트의 다시 게시에 따라 달라집니다. 각 라이브 URL이 어떤 소스 버전을 나타내는지 기록하세요.

핸드오프를 비교하려면 다음 가이드를 참조하세요. Muse 웹사이트 게시 연습. 는 Claude 디자인 출판 가이드 또 다른 출발점을 다루고, 에이전트가 Anima를 사용하여 앱을 탐색하고 게시하는 방법 검토된 아티팩트가 게시로 이동하는 모습을 보여줍니다. 이는 상호 교환 가능한 제품 기능이 아닌 서로 다른 작업 흐름입니다.

|

Co-founder & CEO