MetaMask Snaps: 擴充你的交易體驗,打造個人化錢包

閱讀時間約 9 分鐘

MetaMask Snaps 簡介

Metamask Snaps 是一款基於 Metamask Flask的新型態擴充套件,它將部分功能開源出來讓開發者有機會以他們想要的方式擴展 MetaMask錢包,旨在讓使用者有更個人化或多樣的交易體驗。Metamask Snaps集成api介接到自定義錢包UI呈現的過程,得以讓錢包有更多樣可能玩法的實現。也讓開發人員能夠靈活地擴展 MetaMask 錢包的功能,而不需要修改其核心功能。
簡單來說就是錢包開外掛啦~~

開發 MetaMask Snaps 步驟

  • 一、從MetaMask Flask開始
要使用 Metamask Snaps,您需要先安裝 Metamask flask擴充程式node.js以及yarn。Metamask Flask可以看做是Metamask錢包的實驗版本,目前MetaMask Snaps 只能在Metamask Flask上面使用。以下是從 Metamask Flask 開始使用 MetaMask Snaps 的步驟:
  1. 開啟您的瀏覽器( Google Chrome 、Firefox、Brave),並安裝 Metamask 擴充程式;
  2. 安裝完成後,在瀏覽器右上角可以看到 Metamask 圖標,點擊圖標並創建一個新錢包;
  3. 創建完錢包後,您可以選擇將您的資產轉移到 Metamask 錢包中,不過如果是要用來測試的話,可以先不要放太多資產在flask裡面;
  4. 在 MetaMask Snaps 中選擇您要使用的區塊鏈,可以在此先切換到測試鏈,並準備使用snaps來豐富交易體驗。
官網下載MetaMask Snaps喔!
  • 二、啟動Snap專案
接下來必須要安裝node.js(>16)以及yrn,yarn 是一個 JavaScript 的套件管理工具,用於管理和編譯 JavaScript 套件。它是由 Facebook、Google、Exponent 和 Tilde 共同開發的,用意是在解決 npm的一些效能和安全性問題。相關安裝方法可以參考yarn
接下來是依照官方網站的說明所做的MetaMask Snaps 快速上手範例(TypeScript Example Snap),是一個web UI跟Snap互動的範例,可以在web按下按鍵之後,在Flask上呈現訊息。在vscode或cmd中下此指令:
yarn create @metamask/snap your-snap-name
它的用意是起一個snap範例專案,接下來進入專案完成yarn安裝以及開啟yarn來啟動snap專案:
yarn install && yarn start
snap專案成功啟動之後在瀏覽器上訪問http://localhost:8000/應該就可以看到以下畫面,
接下來需要登入Flask錢包
由Metamask Flask訪問snap並連接,需要按下connect
再來要授予snap相關權限
Approve &install之後 畫面就會變成下面這樣子的歡迎訊息UI介面,發現Send Hello message欄位可以開始互動。
按下Send message就可以跟在Flask跟Snap進行互動,Flask會跳出
Hello, http://localhost:8000!
This custom confirmation is just for display purposes.
But you can edit the snap source code to make it do something, if you want to!
就是Snap接收到按鍵之後所呈現的UI資訊,也是開發者能加工的地方。
現在您已經知道如何使用 MetaMask Snaps 了,趕快去體驗一下吧!

MetaMask Snaps的功能

MetaMask 在官方網站中提到幾個MetaMask Snaps 的功能,其中有一些蠻實用的,讓開發者能夠擴展 MetaMask 錢包並為使用者提供更多個人化和多樣化的交易體驗。例如:
1.對話框(Dialogs): 這個功能可以在Metamask錢包中發送指定的警告或是提示訊息。
2.通知(Notifications): 與 dialogs 類似,notification 實踐將訊息在Metamask錢包或瀏覽器上顯示,提供使用者更直觀的交互方式。
3.加密儲存(Encrypted storage): MetaMask Snaps 提供幾種加解密的方法讓訊息傳送時可以更加安全,或是可以提供其他的工具來進行開發。
4.非 EVM 鏈支援(Non-EVM chain support):MetaMask Snaps 不僅支援以太鏈,還可以將功能擴充到其他鏈上。並且也得以管理metamask錢包中非以太鏈用戶的帳戶及資產。
5.交易洞察(Transaction insights):MetaMask Snaps 提供了方法,在交易之前獲取該次交易相關的資訊,例如發送和接收地址,或是預估的gas fee。
6.定時任務(Cron jobs):我覺得最酷的功能是,MetaMask Snaps 可以為使用者安排定期的工作排程,可以用來做許多的擴充發想,例如自動化交易。
7.自定義介面(Custom UI):MetaMask Snaps 有一些已經定義好的元件可以提供在metamask錢包中自定義UI介面。
8.網路訪問(Network access):MetaMask Snaps 可以請求第三方的 API 來豐富自己的功能,這是擴展小狐狸錢包的一個強大方式,例如可以結合合約掃描的 API 或是辨識交易風險的 API。
這些功能都可以藉由改動Snaps範例程式碼得以實現,例如這裡提供一個範例,演示了如何訪問以太鏈並在 Flask UI 中顯示交易費用比例。
而這些功能主要需要藉由編輯 template-snap-monorepo/snap/src/index.ts 來添加或是修改。
而 template-snap-monorepo/snap/snap.manifest.json 則提供 MetaMask Flask 關於 snap 的重要資訊,包括它自何處出版的、如何驗證 snap 的 source code,以及權限設定等相關訊息。

MetaMask Snaps的優點與限制

實際使用下來,我發現MetaMask Snaps 有一些優點和一些限制。在優點方面,MetaMask Snaps 最大的優勢莫過於可以輕鬆整合自定義 API ,並且以 UI 呈現於 MetaMask 錢包的功能,結合所撈取交易資訊,進行後續的應用,這讓開發人員節省許多開發資源,也為廣大的 MetamMask 用戶製造了許多體驗擴充功能的潛在機會。
不過基於資安風險,MetaMask 也藉由限制請求snap的方法來管控使用者權限,這有利也有弊,有利於使用者錢包的資料安全,有弊的地方在於站在開發者的角度,我們更難去分流客群,缺乏開發出更好的交易體驗功能的誘因。
UI的自定義呈現也是一個潛在的問題,實際去進行使用後發現,雖然 MetaMask 官方說明讓開發者能夠自定義UI介面,感覺可以很自由的發展個性化的UI介面。但實際上也受限於官方訂定的少數固定的component,最後導致無法呈現一些”較活潑”的UI互動。
目前最大的問題出在 MetaMask Snaps 綁定在MetaMask Flask上,MetaMask Flask是MetaMask的一個frok,是MetaMask的實驗版本錢包。實驗性質的功能都會先在上面實施,MetaMask Snaps 亦然,所以一般用戶並不會直接接觸到snap。
目前尚未有明確的方式將功能完整且程序完善的 Snaps 整合到正式的 MetaMask 環境中,也缺乏提供開發者共享和使用 Snaps 的平台。這可能使開發者擔憂他們在開發 Snaps 上的投入可能無法得到回報。
雖然MetaMask Snaps 還處於相對早期的發展階段,並存在一些限制,但不得不說MetaMask在某程度上也很有誠意,它拋出了一個讓開發者可以將自家功能介接到小狐狸錢包的機會,降低開發者將自家功能結合到web3體驗的門檻,也豐富了小狐狸錢包的生態系,聽說最近MetaMask也積極地在內部鼓勵人員開發snaps,就讓我們繼去期待它的發展。隨著時間的推移,我們可以預見 MetaMask Snaps 有望提供更多功能和改進,為用戶和開發者帶來更好的使用和開發體驗。
___________________________________________________________________________
作者阿原目前從事區塊鏈資料分析工作,對區塊鏈的經濟架構、事件發展有很大的興趣,並希望能將相關的區塊鏈知識分析並且統整給大家。如果喜歡我的文章,或是想獲得更多區塊鏈大小事,歡迎關注我的vocus帳號
另外,我已經加入由趨勢科技防詐達人所成立的方格子專題-《區塊鏈生存守則》,在那裡我會跟其他優質的創作者一起帶大家深入瞭解區塊鏈,並隨時向大家更新區塊鏈資安事件。
> 追蹤《區塊鏈生存守則》學習如何在區塊鏈的世界保護自己
> 關注防詐達人獲得其他最新詐騙情報
31會員
176內容數
我們整理了web3相關的熱門資安問題,包含加密貨幣投資詐騙、盜版NFT、空投釣魚和區塊鏈重大資安事件懶人包等等,並提供最完整的辨識方法教學,讓大家從0到1學習如何保護自己
留言0
查看全部
發表第一個留言支持創作者!
防詐達人的沙龍 的其他內容
你是否看過這則報導:「蔡英文的最新投資讓專家們感到敬畏,也讓大銀行產生恐慌」,其實不只是蔡英文,全世界的名人都是詐騙集團假冒的目標,郭台銘、馬英九、黃子佼、外國知名節目Dragon’s Den的Peter Jones都是受害者,詐騙集團利用名人名氣與聲望讓大量粉絲落入假投資詐騙陷阱
  Soildity是一種風格類似JavaScript的強型別高階語言,專門用來進行智能合約的開發及編程。本文敘述solidity的獨特之處。   
近日有幣安用戶收到來自幣安的遷移通知,稱幣安就用戶即將關閉服務,並附上一個很像是幣安的釣魚連結。請小心!網址一定要看清楚,一不小心輸入帳號密碼可能會導致幣安帳戶被盜,損失大筆資金。
繼前陣子的「您所在地區帳戶將終止服務」幣安釣魚簡訊後,近期又出現假幣安郵件,通知收件者點擊按鈕以領取比特幣,實際上按鈕連結到的是幣安釣魚頁面,一旦登入你的幣安帳戶將會被盜用,甚至虛擬貨幣瞬間被轉走
今天我們會開始深入探討到EVM(以太坊虛擬機)上的一點點基礎知識。 若您是一個常常在etherscan.io上追蹤交易的朋友,一定對上面提到的各項資訊並不陌生。但我們觀察一筆交易時會發現,etherscan.io又額外提供了Internel Txns,這又是什麼呢?本篇將一同來探討。
近年來隨著元宇宙Metaverse的聲浪,NFT與虛擬貨幣變成人人嚮往的新投資商機,NFT遊戲也以邊玩邊賺錢「Play to earn」模式吸引眾多玩家。然而,近期開始出現一些「假NFT遊戲」,打著元宇宙的旗幟實行真投資詐騙,企圖欺騙想踏入幣圈的新手
你是否看過這則報導:「蔡英文的最新投資讓專家們感到敬畏,也讓大銀行產生恐慌」,其實不只是蔡英文,全世界的名人都是詐騙集團假冒的目標,郭台銘、馬英九、黃子佼、外國知名節目Dragon’s Den的Peter Jones都是受害者,詐騙集團利用名人名氣與聲望讓大量粉絲落入假投資詐騙陷阱
  Soildity是一種風格類似JavaScript的強型別高階語言,專門用來進行智能合約的開發及編程。本文敘述solidity的獨特之處。   
近日有幣安用戶收到來自幣安的遷移通知,稱幣安就用戶即將關閉服務,並附上一個很像是幣安的釣魚連結。請小心!網址一定要看清楚,一不小心輸入帳號密碼可能會導致幣安帳戶被盜,損失大筆資金。
繼前陣子的「您所在地區帳戶將終止服務」幣安釣魚簡訊後,近期又出現假幣安郵件,通知收件者點擊按鈕以領取比特幣,實際上按鈕連結到的是幣安釣魚頁面,一旦登入你的幣安帳戶將會被盜用,甚至虛擬貨幣瞬間被轉走
今天我們會開始深入探討到EVM(以太坊虛擬機)上的一點點基礎知識。 若您是一個常常在etherscan.io上追蹤交易的朋友,一定對上面提到的各項資訊並不陌生。但我們觀察一筆交易時會發現,etherscan.io又額外提供了Internel Txns,這又是什麼呢?本篇將一同來探討。
近年來隨著元宇宙Metaverse的聲浪,NFT與虛擬貨幣變成人人嚮往的新投資商機,NFT遊戲也以邊玩邊賺錢「Play to earn」模式吸引眾多玩家。然而,近期開始出現一些「假NFT遊戲」,打著元宇宙的旗幟實行真投資詐騙,企圖欺騙想踏入幣圈的新手
你可能也想看
Google News 追蹤
Thumbnail
這個秋,Chill 嗨嗨!穿搭美美去賞楓,裝備款款去露營⋯⋯你的秋天怎麼過?秋日 To Do List 等你分享! 秋季全站徵文,我們準備了五個創作主題,參賽還有機會獲得「火烤兩用鍋」,一起來看看如何參加吧~
Thumbnail
近期藝人、網紅們和幣圈資深玩家的虛擬貨幣錢包被盜,裡面的NFT或虛擬貨幣被轉走的案件頻傳,動輒損失幾千萬,擔心自己成為下一個受害者?趕快跟著防詐達人了解MetaMask小狐狸錢包是什麼?它如何運作?以及詐騙集團是用什麼手法把你的錢包騙到手的?看完這個MetaMask懶人包再也不擔心錢包被盜
Thumbnail
當你要進入區塊鏈、加密貨幣的世界,都會需要一個可以存放數位資產的錢包,而錢包種類中的其中一種是去中心化錢包,現在要介紹的Metamask小狐狸錢包就是屬於這類,它是目前最早期且普及的開源軟體加密貨幣錢包,可以讓用戶擁有能自己能掌控的「私鑰」(就是加密貨幣世界的地址),我第一個擁有的錢包就是Metam
Thumbnail
以手機版 MetaMask App 做示範,從創建錢包、導覽介面、添加區塊鏈網路及代幣,讓你在手機上也能暢遊 Web3。
Thumbnail
先來簡單介紹如何注冊Luno的戶口?我位於馬來西亞,所以選擇馬來西亞區域的Luno網頁來注冊戶口,網頁鏈接:https://www.luno.com/en/my 等了一天,賬戶驗證成功,之後才能開始進行交易。 1. 在Wallet頁面直接購買ETH,費用2%。 Cheers!
Thumbnail
這篇文章為ledger冷錢包開箱文和設定教學。 連結Metamask狐狸錢包 連結Terra錢包
Thumbnail
【本篇重點】 一、《開通》準備一只加密錢包.MetaMask 二、《開通》連結小狐狸錢包 三、《開通》設定名稱、大頭照、封面…等 四、《使用》錢包地址在哪? 五、《使用》如何開啟被隱藏的 NFT? 六、《使用》手機也能看 OpenSea 嗎?
Thumbnail
這個秋,Chill 嗨嗨!穿搭美美去賞楓,裝備款款去露營⋯⋯你的秋天怎麼過?秋日 To Do List 等你分享! 秋季全站徵文,我們準備了五個創作主題,參賽還有機會獲得「火烤兩用鍋」,一起來看看如何參加吧~
Thumbnail
近期藝人、網紅們和幣圈資深玩家的虛擬貨幣錢包被盜,裡面的NFT或虛擬貨幣被轉走的案件頻傳,動輒損失幾千萬,擔心自己成為下一個受害者?趕快跟著防詐達人了解MetaMask小狐狸錢包是什麼?它如何運作?以及詐騙集團是用什麼手法把你的錢包騙到手的?看完這個MetaMask懶人包再也不擔心錢包被盜
Thumbnail
當你要進入區塊鏈、加密貨幣的世界,都會需要一個可以存放數位資產的錢包,而錢包種類中的其中一種是去中心化錢包,現在要介紹的Metamask小狐狸錢包就是屬於這類,它是目前最早期且普及的開源軟體加密貨幣錢包,可以讓用戶擁有能自己能掌控的「私鑰」(就是加密貨幣世界的地址),我第一個擁有的錢包就是Metam
Thumbnail
以手機版 MetaMask App 做示範,從創建錢包、導覽介面、添加區塊鏈網路及代幣,讓你在手機上也能暢遊 Web3。
Thumbnail
先來簡單介紹如何注冊Luno的戶口?我位於馬來西亞,所以選擇馬來西亞區域的Luno網頁來注冊戶口,網頁鏈接:https://www.luno.com/en/my 等了一天,賬戶驗證成功,之後才能開始進行交易。 1. 在Wallet頁面直接購買ETH,費用2%。 Cheers!
Thumbnail
這篇文章為ledger冷錢包開箱文和設定教學。 連結Metamask狐狸錢包 連結Terra錢包
Thumbnail
【本篇重點】 一、《開通》準備一只加密錢包.MetaMask 二、《開通》連結小狐狸錢包 三、《開通》設定名稱、大頭照、封面…等 四、《使用》錢包地址在哪? 五、《使用》如何開啟被隱藏的 NFT? 六、《使用》手機也能看 OpenSea 嗎?