以太坊區(qū)塊鏈如何保證Asp.Net Core的API安全(下)

上一篇用以太坊區(qū)塊鏈保證Asp.Net Core的API安全(上)我們介紹了基本的解決方案,這一篇我們重點來看客戶端。

正如我們所說,我們的DApp是一個簡單的HTML/ES6客戶端。我們將在Asp.Net Core 2之上構(gòu)建客戶端,以利用IIS Express和Visual Studio IDE。因此,Startup.cs類中的Configure方法將是:

if (env.IsDevelopment())
{
    app.UseDeveloperExceptionPage();
}

app.UseDefaultFiles();
app.UseStaticFiles();

使DApp成為NPM項目并安裝必備條件以使用ES6 Javascript標準。這不是強制性的,可以使用自己的堆棧構(gòu)建DApp。

從項目文件夾運行Powershell并運行以下NPM命令:

npm init
npm install webpack
npm install babel-core babel-loader --save-dev
npm install babel-preset-es2015 --save-dev
npm install babel-preset-stage-0 --save-dev
npm install babel-polyfill --save
npm install babel-runtime --save
npm install babel-plugin-transform-runtime --save-dev

要配置webpack/babel,請使用以下配置創(chuàng)建webpack.config.js文件:

var path = require("path");

module.exports = {
    entry: [
        "babel-polyfill",
        "./src/main"
    ],
    output: {
        publicPath: "/js/",
        path: path.join(__dirname, "/wwwroot/js/"),
        filename: "main.build.js"
    }
};

我們已設定webpacksrc/main.js文件構(gòu)建到/www/js/main.build.js。

安裝以太坊擴展包:

npm install web3
npm install ethereumjs-util

Web3是一個javascript封裝包,它簡化了針對以太坊區(qū)塊鏈的JSON RPC調(diào)用。Ethereumjs-util提供了一些以太坊特定的實用程序。讓我們構(gòu)建一個非常簡單的HTML頁面。我們需要一個登錄按鈕和另一個按鈕來從我們的API層加載一些安全數(shù)據(jù):

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>Ethereum Jwt Client</title>
</head>
<body>
    <h1>Ethereum Jwt Client</h1>
    <div id="login-view">
        <label>Your account: </label> <span id="eth_account_span"></span>
        <button type="submit" id="login_btn">Login</button>
    </div>
    <div id="data-view">
        <button type="submit" id="load_data_btn">Request secured data</button>
        <ul id="data_list">

        </ul>
    </div>
    <script src="js/main.build.js"></script>
</body>
</html>

DApp邏輯將駐留在src/main.js文件中,正如我們在webpack.config.js文件中指定的那樣。src/main.js文件將是:

let ethUtil = require('ethereumjs-util');
let Web3 = require('web3');

let coinbase = null;
let accessToken = null;

let init = () => {
    if (typeof web3 !== 'undefined') {
        web3 = new Web3(web3.currentProvider);
        web3.eth.getCoinbase(function (err, account) {
            if (err === null && ethUtil.isValidAddress(account)) {
                coinbase = account;
                eth_account_span.innerHTML = coinbase;
            } else {
                eth_account_span.innerHTML = 'Please unlock your account and refresh the page';
                console.error(err);
            }
        });

    } else {
        eth_account_span.innerHTML = 'Please install or unlock Metamask browser plugin or navigate this page with Mist or another web3 browser';
    }
};

let request = obj => {
    return new Promise((resolve, reject) => {
        let xhr = new XMLHttpRequest();
        xhr.open(obj.method || "GET", obj.url);
        if (obj.headers) {
            Object.keys(obj.headers).forEach(key => {
                xhr.setRequestHeader(key, obj.headers[key]);
            });
        }
        xhr.onload = () => {
            if (xhr.status >= 200 && xhr.status < 300) {
                resolve(xhr.response);
            } else {
                reject(xhr.statusText);
            }
        };
        xhr.onerror = () => reject(xhr.statusText);
        xhr.send(obj.body);
    });
};

login_btn.addEventListener('click', (e) => {
    e.preventDefault();

    login_btn.setAttribute('disabled', 'disabled');
    login_btn.innerHTML = 'Please sign the message';

    let plain = 'Hi, you request a login from client to Eth Jwt Api. Please sign this message. This is not a transaction, is completely free and 100% secure. We\'ll use your signature to prove your ownership over your private key server side.';
    let msg = ethUtil.bufferToHex(new Buffer(plain, 'utf8'));
    let hash = ethUtil.bufferToHex(ethUtil.keccak256("\x19Ethereum Signed Message:\n" + plain.length + plain));
    let from = coinbase;

    let params = [msg, from];
    let method = 'personal_sign';

    web3.currentProvider.sendAsync({
        method,
        params,
        from,
    }, function (err, result) {
        if (err || result.error) {
            login_btn.removeAttribute('disabled');
            login_btn.innerHTML = 'Login';

            console.error(err);
            return console.error(result.error);
        }
        console.log({
            'signature': result.result,
            'msg': msg,
            'hash': hash
        });

        login_btn.innerHTML = 'Requesting token...';
        let loginData = {};
        loginData.signer = from;
        loginData.signature = result.result;
        loginData.message = msg;
        loginData.hash = hash;

        request({
            url: 'http://localhost:49443/api/token',
            body: JSON.stringify(loginData),
            method: 'post',
            headers: {
                'Authorization': 'Bearer ' + accessToken,
                'Content-type': 'application/json'
            }
        }).then(data => {
            var json = JSON.parse(data);
            accessToken = json.token;
            console.log('access token: ' + accessToken);

            login_btn.removeAttribute('disabled');
            login_btn.innerHTML = 'Login';
        }).catch(error => {
            console.error(error);

            login_btn.removeAttribute('disabled');
            login_btn.innerHTML = 'Login';
        });
    });
});

load_data_btn.addEventListener('click', (e) => {
    e.preventDefault();

    request({
        url: 'http://localhost:49443/api/values',
        headers: {
            'Authorization': 'Bearer ' + accessToken
        }
    }).then(data => {
        var json = JSON.parse(data);
        for (let i = 0; i < json.length; i++) {
            data_list.innerHTML += '<li>' + json[i] + '</li>';
        }
    }).catch(error => {
        console.error(err);
    });

});

window.addEventListener('load', init);
  • 1.coinbaseaccessToken是全局變量,分別存儲用戶以太坊帳戶和JWT token。
  • 2.init函數(shù)從Metamask提供的提供程序初始化web3對象,然后它嘗試檢索用戶的帳戶(coinbase)。這需要解鎖在Metamask中簽名的帳戶。
  • 3.require函數(shù)只是hxr對象的封裝,可以輕松地向API層調(diào)用ajax。
  • 4.load_data_btn單擊處理程序?qū)PI層安全端點進行ajax調(diào)用。這需要有效的accessToken才能工作,否則,API層將響應401 HTTP響應。
  • 5.login_btn單擊是一個兩步功能。首先,它要求用戶簽署任意消息。簽名后,它會將帳戶,簽名,明文消息和帶前綴的哈希發(fā)送到令牌端點。

請注意,web3.personal.sign將十六進制格式(0x ...)的普通字符串的字節(jié)數(shù)組作為輸入。

正如我們所說的,服務器端,我們將使用兩種不同的方式從簽名中恢復公鑰:在一個中我們將使用JSON RPC 接口中的web3.personal.ecrecover(web3.personal.sign對應);在另一個中,我們將使用底層的ecrecover離線功能。根據(jù)文檔,web3.personal.sign使用底層簽名函數(shù)來簽署hash和前綴消息,因此,為了使用底層ecrecover對應,我們還需要計算并將此hash發(fā)送到令牌端點。

運行兩個應用程序并使用安裝了Metamask插件的瀏覽器導航到客戶端。請記住,為了將src/main.js文件構(gòu)建到js/main.build.js,你需要從Powershell運行webpac命令。如果一切正常,客戶端將檢索coinbase,你將在頁面上看到你的帳戶:

image

如果你現(xiàn)在單擊“請求數(shù)據(jù)”按鈕,將獲得HTTP響應401。如果單擊“登錄”按鈕,Metamask將提示你簽名:

image

簽名后,處理程序?qū)α钆贫它c進行ajax調(diào)用。在此階段,身份驗證方法不會檢查任何簽名,因此端點將始終發(fā)出JWT令牌。一旦收到JWT令牌,客戶端就能通過ajax調(diào)用安全端點。如果現(xiàn)在單擊“請求數(shù)據(jù)”按鈕,將收到HTTP響應200和數(shù)據(jù)負載:

image

從簽名中檢索以太坊帳戶

到目前為止,EthereumJwtApi是一個簡單的JWT Asp.Net核心示例,因為它不提供任何有效的身份驗證方法。

TokenController的關鍵部分是兩個Authenticate方法及其從簽名中檢索以太坊帳戶的能力。為此,你需要安裝Nethereum.Web3 NuGet包。Nethereum是以太坊的.Net實現(xiàn)。

Authenticate方法只是對web3.personal.ecrecover函數(shù)進行JSON RPC調(diào)用:

private async Task<UserVM> Authenticate(LoginVM login)
{
    UserVM user = null;

    var client = new RpcClient(new Uri(_config["Nethereum:Geth"])); // Require the RPC endpoint of a Geth node as input eg: http://127.0.0.1:8545
    var signer = await client.SendRequestAsync<string>(new RpcRequest(1, "personal_ecRecover", login.Message, login.Signature));

    if (signer.ToLower().Equals(login.Signer.ToLower()))
    {
        // read user from DB or create a new one
        // for now we fake a new user
        user = new UserVM { Account = signer, Name = string.Empty, Email = string.Empty };
    }

    return user;
}

PRO:

web3.personal.signweb3.personal.sign的對應部分,因此你無需擔心其底層實現(xiàn)。

缺點:

需要你自己的Geth節(jié)點。不支持Parity,Infura不允許JSON RPC調(diào)用web3.personal.*Authenticate2方法顯示了另一種方法,它使用底層ecrecover功能的離線實現(xiàn):

private async Task<UserVM> Authenticate2(LoginVM login)
{
    UserVM user = null;

    var signer = new Nethereum.Signer.MessageSigner();
    var account = signer.EcRecover(login.Hash.HexToByteArray(), login.Signature);

    if (account.ToLower().Equals(login.Signer.ToLower()))
    {
        // read user from DB or create a new one
        // for now we fake a new user
        user = new UserVM { Account = account, Name = string.Empty, Email = string.Empty };
    }

    return user;
}

PRO:

不需要JSON RPC調(diào)用就能工作。MessageSigner.EcRecoverNethereum提供的離線功能。

缺點:

你需要處理web3.personal.sign實現(xiàn)才能正確恢復帳戶。出于這個原因,在客戶端,我們相應地計算了前綴消息哈希。

結(jié)論

現(xiàn)在你擁有基本的知識和一個項目的骨架,可以使用以太坊保護你的Asp.Net Core 2 API。只需幾點說明:

web3 1.0.0處于測試階段,web3.personal.sign實現(xiàn)可能會隨著時間的推移而變化。請務必在你可以維護的代碼庫上使用這種身份驗證方法。也許Infura某天決定允許web3.personal.ecrecover :-)

======================================================================

分享一些以太坊、EOS、比特幣等區(qū)塊鏈相關的交互式在線編程實戰(zhàn)教程:

  • java以太坊開發(fā)教程,主要是針對java和android程序員進行區(qū)塊鏈以太坊開發(fā)的web3j詳解。
  • python以太坊,主要是針對python工程師使用web3.py進行區(qū)塊鏈以太坊開發(fā)的詳解。
  • php以太坊,主要是介紹使用php進行智能合約開發(fā)交互,進行賬號創(chuàng)建、交易、轉(zhuǎn)賬、代幣開發(fā)以及過濾器和交易等內(nèi)容。
  • 以太坊入門教程,主要介紹智能合約與dapp應用開發(fā),適合入門。
  • 以太坊開發(fā)進階教程,主要是介紹使用node.js、mongodb、區(qū)塊鏈、ipfs實現(xiàn)去中心化電商DApp實戰(zhàn),適合進階。
  • C#以太坊,主要講解如何使用C#開發(fā)基于.Net的以太坊應用,包括賬戶管理、狀態(tài)與交易、智能合約開發(fā)與交互、過濾器和交易等。
  • EOS教程,本課程幫助你快速入門EOS區(qū)塊鏈去中心化應用的開發(fā),內(nèi)容涵蓋EOS工具鏈、賬戶與錢包、發(fā)行代幣、智能合約開發(fā)與部署、使用代碼與智能合約交互等核心知識點,最后綜合運用各知識點完成一個便簽DApp的開發(fā)。
  • java比特幣開發(fā)教程,本課程面向初學者,內(nèi)容即涵蓋比特幣的核心概念,例如區(qū)塊鏈存儲、去中心化共識機制、密鑰與腳本、交易與UTXO等,同時也詳細講解如何在Java代碼中集成比特幣支持功能,例如創(chuàng)建地址、管理錢包、構(gòu)造裸交易等,是Java工程師不可多得的比特幣開發(fā)學習課程。
  • php比特幣開發(fā)教程,本課程面向初學者,內(nèi)容即涵蓋比特幣的核心概念,例如區(qū)塊鏈存儲、去中心化共識機制、密鑰與腳本、交易與UTXO等,同時也詳細講解如何在Php代碼中集成比特幣支持功能,例如創(chuàng)建地址、管理錢包、構(gòu)造裸交易等,是Php工程師不可多得的比特幣開發(fā)學習課程。

匯智網(wǎng)原創(chuàng)翻譯,轉(zhuǎn)載請標明出處。這里是原文以太坊區(qū)塊鏈.Net

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務。

相關閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容