SSSは現在old-sdk対応ですが、新sdkでも使用することができます。
今回は新sdkからSSSを利用する方法について説明します。

symbol-sdk(v3)の埋め込み

ブラウザコンソールを使用して表示中ページにsymbol-sdk-v3を埋め込みます。

(script = document.createElement('script')).src = 'https://xembook.github.io/symbol-browserify/symbol-sdk-3.0.0.js';
document.getElementsByTagName('head')[0].appendChild(script);

環境定義

トランザクション送信に必要な環境の定義、情報を取得します。

node = window.origin;

sdk = require("/node_modules/symbol-sdk");
Buffer = require("/node_modules/buffer").Buffer;

res = await fetch(node + "/network/properties");
json = await res.json();
generationHash = json.network.generationHashSeed;
networkId = json.network.identifier;
currencyMosaicId =  json.chain.currencyMosaicId.split("'").join('').slice(2);
epochAdjustment = Number(json.network.epochAdjustment.replace("s",""));

function createDeadline(secs = 7200) {
	const value = ((Math.trunc(Date.now() / 1000) + secs) - epochAdjustment) * 1000
	return BigInt(value);
}

function setMaxFee(tx,multiplier){
    return new sdk.symbol.Amount(BigInt(tx.size * multiplier))
}

facade = new sdk.facade.SymbolFacade(networkId);
privateKey = new sdk.CryptoTypes.PrivateKey("896E43895B908AF5847ECCB2645543751D94BD87E71058B003417FED5123****")
keypair = new sdk.facade.SymbolFacade.KeyPair(privateKey);

トランザクション作成

トランザクションを作成してペイロードを出力します。

tx = facade.transactionFactory.create({
	type: 'transfer_transaction',
	signerPublicKey: keypair.publicKey.toString(),
	deadline:createDeadline(),
	recipientAddress: 'TD4WXUXYAPPB5Y42VT6FHISG6T32I2IBUXIKKPQ',
	message:[0,...(new TextEncoder('utf-8')).encode('GoodLuck!')],
	mosaics: [
		{ mosaicId: 0x3A8416DB2D53B6C8n, amount: 1000000n }
	]
})
tx.fee = setMaxFee(tx,100);
payload = Buffer.from(tx.serialize()).toString("hex");

SSSへのトランザクションセットと署名要求

ペイロードを利用してトランザクションをセットします。

window.SSS.setTransactionByPayload(payload);
signedTx = await window.SSS.requestSign();

ネットワークへの配置(PUT)

SSSから受け取ったオブジェクトからpayloadを取り出し、
fetchを利用して、ブロックチェーンへトランザクションを配置します。

signedPayload = signedTx.payload;
jsonPayload = `{"payload": "${signedPayload}"}`
response = await fetch(`${node}/transactions`, {
	method: 'put',
	body: jsonPayload  ,
	headers: {'Content-Type': 'application/json'}
});
await response.text();

確認

ネットワークに配置したトランザクションを確認してみましょう。

//承認状態の確認
res = await fetch(`${node}/transactionStatus/${signedTx.hash}`);
console.log(await res.json());

//承認済みトランザクションの確認
res = await fetch(`${node}/transactions/confirmed/${signedTx.hash}`);
console.log(await res.json());

//エクスプローラーで確認
console.log("https://testnet.symbol.fyi/transactions/" + signedTx.hash);