Polysnap: 즉석에서 Polywrap Wasm 래퍼 호출하기

MetaMask Snaps는 MetaMask를 세계에서 가장 확장 가능한 지갑으로 만들기 위한 로드맵입니다. 개발자라면 완전히 새로운 방식으로 자신만의 기능과 API를 MetaMask에 추가할 수 있습니다. Web3 개발자들은 이러한 성장의 핵심이며, 이 시리즈는 현재 개발 중인 혁신적인 MetaMask Snaps를 소개하는 것을 목표로 합니다.

Polysnap

Snap 저장소: https://github.com/Niraj-Kamdar/Polysnap

왜 만들었나요?

현재 개발자들은 MetaMask에 새로운 기능을 추가하려 할 때마다 새로운 Snap을 만들어야 합니다. Polysnap은 코드 재사용에 대한 더 나은 접근 방식을 제시합니다. Polywrap으로 구동되는 다양한 Wasm 모듈이 IPFS에 저장됩니다. Polysnap을 사용하면 앱 개발자가 새로운 Snap을 만들 필요 없이 간단한 JSON RPC 호출만으로 IPFS에 배포된 모든 Wasm 래퍼를 즉시, 그리고 안전하게 실행할 수 있습니다.

Polysnap을 사용하는 dapp의 사용자는 여러 Snap을 설치할 필요 없이 Polysnap 하나만 설치하면 됩니다. 이를 통해 잠재적인 공격 경로를 줄일 수 있습니다. Polysnap을 사용하는 Dapp은 인터넷 접근, 지갑 접근 등 호스트 기능과 관련된 모든 작업을 Polysnap이 통제하고, 해당 기능에 의존하는 코드를 실행하기 전에 항상 사용자 확인을 요구하기 때문에 기존 Snap보다 더 안전할 수 있습니다.

Dapp 개발자는 사용자에게 여러 Snap을 설치하도록 요청할 필요 없이, Polysnap 하나만으로 모든 Polywrap 래퍼를 실행할 수 있습니다.

Snap 개발자는 더 이상 Snap 개발에 JavaScript와 JavaScript 생태계만 사용할 필요가 없습니다. 대신 Rust, Go, AssemblyScript 같은 언어로 Polywrap 래퍼를 작성하고, Polysnap을 통해 해당 래퍼를 호출할 수 있습니다.

기술적인 구현 과정을 설명해 주시겠어요?

Polysnap 프로젝트는 두 가지 요소로 구성됩니다:

1. Polysnap (MetaMask Snap)

2. Polysnap 데모 웹사이트

MetaMask Snap이 핵심 기능이며 프로젝트의 중점 사항입니다. 웹사이트는 Snap을 시연하는 데 사용됩니다.

Snap

Polysnap은 3가지 부분으로 나눌 수 있습니다.

1. Polywrap Client

2. Plugin Wrapper

3. WASM Wrapper

1. Polywrap Client

Polywrap은 안전하고, 개방적이며, 사용자 소유의 인터넷을 위한 통합 실행 환경을 구축하고 있습니다.

Polywrap을 사용하면 Polywrap Client를 통해 어디서든 실행 가능한 무한히 확장 가능한 소프트웨어를 만들 수 있습니다. Polywrap Client는 두 가지 유형의 래퍼 실행을 지원합니다:

1. Wasm Wrapper - Polywrap 툴체인을 사용하여 IPFS에 빌드 및 배포된 샌드박스 Wasm 래퍼 모듈

2. Plugin Wrapper - HTTP, 파일 시스템, JSON-RPC 등 다양한 호스트 기능을 Wasm 래퍼에 노출하는 호스트 기능 래퍼

Polysnap에 간단한 JSON-RPC 호출로 모든 래퍼를 호출하기 위해 Polywrap Client를 어떻게 사용하는지 확인해 보세요.

export const onRpcRequest: OnRpcRequestHandler = async ({
  origin,
  request,
}) => {
  switch (request.method) {
    case 'wrap_invoke':
      const invocation = request.params as unknown as InvokerOptions;
      const isApproved = await wallet.request({
        method: 'snap_confirm',
        params: [
          {
            prompt: `${origin}`.substring(0, 40),
            description: `URI: ${invocation.uri}\nMethod: ${invocation.method}`,
            textAreaContent: `Args ${JSON.stringify(invocation.args)}`,
          },
        ],
      });

      if (isApproved === true) {
        const client = await getClient();
        const response = await client.invoke<any>(invocation);
        if (!response.ok) {
          throw response.error;
        }
        return deserializeMap(response.value);
      }
      throw new Error('User declined invocation');
    default:
      throw new Error('Method not found.');
  }
};
복사

2. Plugin Wrapper

Plugin 래퍼는 Polywrap Client와 함께 Polysnap에 직접 내장됩니다. 이 Plugin 래퍼들은 MetaMask의 SES 환경 내에서 제공되는 기능(예: HTTP, Ethereum JSON-RPC)을 노출합니다.

이번 MVP에서는 세 가지 플러그인을 지원합니다.

1. HTTP Plugin - Wasm Wrapper에서 직접 HTTP GET/POST 요청을 할 수 있는 API를 노출

2. IPFS Plugin - IPFS에서 파일을 저장, 고정 및 검색하는 API를 노출

3. IPFS URI Resolver Plugin - IPFS에서 배포된 Wasm 래퍼를 확인하는 API를 노출

3. Wasm Wrapper

Wasm 래퍼는 Polywrap 툴체인을 사용하여 IPFS에 빌드 및 배포된 Wasm 모듈입니다. Wasm은 샌드박스 환경이기 때문에 호스트가 이를 지원하는 API를 노출하지 않는 한 어떠한 IO도 수행할 수 없습니다. 이로 인해 모든 Wasm 래퍼는 MetaMask Snap 내에서 안전하게 실행될 수 있습니다. Polysnap은 Plugin 래퍼의 도움 없이는 인터넷 접근과 같은 호스트 기능을 실행할 수 없습니다. IPFS에 배포된 모든 래퍼는 wrappers.io에서 확인할 수 있습니다.

export async function getClient(): Promise<PolywrapClient> {
  const ipfsResolverWrapperResult = await ipfsResolverPlugin(
    {},
  ).createWrapper();
  // IPFS URI RESOLVER
  if (!ipfsResolverWrapperResult.ok) {
    throw ipfsResolverWrapperResult.error;
  }
  const ipfsUriResolver = new WrapperResolver(
    Uri.from('ens/ipfs-resolver.polywrap.eth'),
    ipfsResolverWrapperResult.value,
  );

  // IPFS RESOLVER
  const ipfsWrapperResult = await ipfsPlugin({}).createWrapper();
  if (!ipfsWrapperResult.ok) {
    throw ipfsWrapperResult.error;
  }
  const ipfsResolver = new WrapperResolver(
    Uri.from('ens/ipfs.polywrap.eth'),
    ipfsWrapperResult.value,
  );

  // HTTP RESOLVER
  const httpWrapperResult = await httpPlugin({}).createWrapper();
  if (!httpWrapperResult.ok) {
    throw httpWrapperResult.error;
  }
  const httpResolver = new WrapperResolver(
    Uri.from('ens/http.polywrap.eth'),
    httpWrapperResult.value,
  );

  // AGGREGATED RESOLVER
  const resolver = RecursiveResolver.from([
    httpResolver,
    ipfsResolver,
    ipfsUriResolver,
    new ExtendableUriResolver(),
  ]);

  return new PolywrapClient({
    interfaces: [
      {
        interface: new Uri('wrap://ens/uri-resolver.core.polywrap.eth'),
        implementations: [
          new Uri('wrap://ens/ipfs-resolver.polywrap.eth'),
        ],
      },
    ],
    envs: [
      {
        uri: new Uri('wrap://ens/ipfs.polywrap.eth'),
        env: {
          provider: defaultIpfsProviders[0],
          fallbackProviders: defaultIpfsProviders.slice(1),
        },
      },
    ],
    resolver,
  });
}
복사

Polysnap 웹사이트

Polysnap 웹사이트는 Polysnap의 실제 동작을 보여주기 위해 만든 간단한 데모 사이트입니다. MetaMask 지갑을 연결하고 Snap을 설치하는 버튼과, Polysnap에 JSON RPC 호출을 제출하고 결과를 표시하는 쿼리 대시보드가 있습니다.

Snap에 호출을 보내기 위해 사용자는 세 가지 요소를 제공합니다:

• Wasm 래퍼로 확인되는 uri (해커톤 프로젝트는 IPFS URI만 지원하지만, 향후 버전에서는 ENS 확인도 지원할 수 있습니다)

• 호출할 method의 이름

• 호출된 메서드에 전달될 인수를 포함하는 json 객체 args

"Invoke" 버튼을 클릭하면 웹사이트는 이 필드의 값을 읽어 Snap으로 전달합니다. Snap은 확인 창을 열어 호출 승인을 요청하며, 이를 통해 최종 사용자의 동의 없이 앱이 임의로 호출을 실행하지 못하도록 합니다.

호출이 승인되면 Snap의 Polywrap Client가 호출을 처리하고 결과를 반환합니다. 결과는 버튼 아래 박스에 출력됩니다. 물론 실제 앱에서 개발자는 일반적으로 호출을 프로그래밍 방식으로 설정하고 결과를 다른 방식으로 활용할 것입니다.

이름에서 알 수 있듯이, Polysnap은 여러 Snap의 기능을 하나로 담은 Snap입니다. Polysnap 하나만으로 개발자는 Wasm으로 컴파일 가능한 모든 언어로 작성된 Polywrap Wasm 래퍼의 모든 메서드를 호출할 수 있습니다.

래퍼는 런타임에 다운로드되어 캐시됩니다. Wasm 래퍼는 샌드박스 환경이며 상태가 없기 때문에, Polysnap은 이미 안전한 Snap 환경에 추가적인 보안 레이어를 더합니다.

그리고 이 모든 것이 완전히 탈중앙화되어 있습니다.

다음 단계로 구현할 계획이 있다면 무엇인가요?

다음 버전의 Polysnap을 위해 구상한 개선 사항 목록입니다:

• Cache, Concurrency, Ethereum, Near, Tezos 등 더 많은 Plugin Wrapper 지원 추가

• 각 Polywrap 플러그인 접근에 대한 권한 기반 보안을 추가하여 최종 사용자가 보안을 관리할 수 있도록 함

• Snap을 소개하고, 문서를 호스팅하며, 최종 사용자가 쉽게 설치할 수 있는 PolySnap 설치 웹사이트 제작

• IPFS, ENS 및 HTTP Polywrap URI Resolver 지원 추가

• MetaMask Snap을 통해 JSON-RPC로 호출하는 동안 Polywrap Client 설정을 커스터마이징할 수 있도록 앱 개발자의 커스텀 설정 제출 지원

• PolySnap이 캐시한 래퍼에 대한 커스텀 캐시 관리 솔루션 지원

본인과 팀에 대해 간략히 소개해 주시겠어요?

저희 두 사람은 모두 프리랜서 소프트웨어 엔지니어와 디자이너로 구성된 DAO인 dOrg의 멤버이자 Polywrap의 개발자입니다.

• Kris - 저는 Web3 소프트웨어 엔지니어입니다. 2020년 친구가 dOrg와 탈중앙화 웹을 소개해 주면서 제 삶이 바뀌었습니다. 이후 Polywrap 팀에 합류하여 차세대 SDK 개발자 도구를 만드는 데 기여하고 있습니다.

• Niraj - 저는 dOrg의 Web3 개발자이며 현재 Polywrap 프로젝트에서 핵심 개발자로 활동하고 있습니다. 2년간 Web3 개발자로 일하며 Polywrap에 합류하기 전에는 Badger, Opolis, Coordinape, Llama에 기여했습니다.

MetaMask Snaps가 Web3 공간에서 어떤 가능성을 열어준다고 생각하시나요?

저희는 MetaMask Snaps가 MetaMask를 수백만 명의 새로운 사용자를 Web3로 온보딩하는 허브로 만들 잠재력이 있다고 생각합니다. 개발자 경험과 보안은 모든 플러그인 생태계의 성공에 있어 가장 중요한 요소입니다. 저희는 Polysnap이 MetaMask Snaps를 더욱 사용하기 쉽고, 확장 가능하며, 안전하게 만들어 이 두 가지를 모두 실현할 수 있다고 믿습니다.

MetaMask Snaps를 시도해 보고 싶은 개발자들에게 조언이 있다면요?

MetaMask Snaps를 사용하면 MetaMask 지갑을 위한 새로운 확장 Snap을 작성하여 MetaMask의 기능을 확장할 수 있습니다. 다양한 L1 지갑을 MetaMask에 직접 통합하거나 트랜잭션에 대한 더 많은 인사이트를 제공하는 등 수많은 사용 사례를 가능하게 하는 매우 강력한 도구입니다. 저희는 Polysnap을 통해 이러한 사용 사례를 구현하기 위한 개발자 경험을 더욱 쉽게 만들고자 합니다.

MetaMask Snaps는 아직 새롭지만, 단 하나의 주말 동안 팀들이 MetaMask 안에 Cosmos 지갑을 구현하는 등 놀라운 MetaMask Snaps를 만드는 것을 목격했습니다. MetaMask Snaps 기능이 아직 프리 프로덕션 상태라도 일찍 시작하세요!

또는 새로운 Snap을 작성하는 대신, Rust나 AssemblyScript 같은 언어로 Polywrap Wasm 래퍼를 작성하는 것도 고려해 보세요. 그러면 자신만의 새로운 Snap을 작성하지 않고도 Polysnap으로 호출할 수 있을 뿐만 아니라, Polywrap 클라이언트를 통해 어디서든 사용할 수 있습니다.

MetaMask Snaps로 빌드하기

MetaMask Snaps를 시작하려면:

1. 개발자 문서를 확인하세요

2. MetaMask Flask를 설치하세요

3. MetaMask Snaps 가이드를 참고하세요

4. Twitter, GitHub 토론, Discord에서 저희와 소통하세요

가까운 곳에서 열리는 다음 해커톤에서 저희 팀을 만나보세요! 즐거운 BUIDLing ⚒️

면책 조항: MetaMask Snaps는 일반적으로 Consensys Software 이외의 제3자가 개발합니다. 제3자가 개발한 MetaMask Snaps의 사용은 전적으로 사용자 본인의 판단과 위험 부담 하에 이루어지며, 이로 인해 발생하는 모든 손실이나 피해에 대한 책임은 사용자 본인에게 있습니다. Consensys는 제3자가 개발한 Snap에 대해 구두 또는 서면을 불문하고 어떠한 명시적 또는 묵시적 보증도 하지 않으며, 제3자가 개발한 MetaMask Snaps에 대한 모든 책임을 부인합니다. 블록체인 관련 소프트웨어 사용에는 위험이 따르며, MetaMask Snaps를 사용함으로써 해당 위험을 전적으로 감수하게 됩니다.