Search
Ask A Question
In Process
Avatar
0
monkey Enlightened
Asked At: 1639607314000 In: Blockchain
monkey Enlightened Asked At: 1639607314000 In: Blockchain
Dự án NFT đơn giản với Metamask và Web3: Khởi tạo dự án
Dự án của chúng ta sẽ sử dụng java web, cấu trúc thư mục sẽ kiểu thế này:
<img src="https://stackask.com/wp-content/uploads/2021/12/Screen-Shot-2021-12-16-at-12.26.01-PM.png" alt="" class="alignnone size-full wp-image-3757" />
  1. file pom:
    <span><span><span>&lt;?</span>xml version=<span>"1.0"</span> encoding=<span>"UTF-8"</span><span>?&gt;</span></span>
<span>&lt;<span>project</span> <span>xmlns</span>=<span>"http://maven.apache.org/POM/4.0.0"</span>
         <span>xmlns:xsi</span>=<span>"http://www.w3.org/2001/XMLSchema-instance"</span>
         <span>xsi:schemaLocation</span>=<span>"http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd"</span>&gt;</span>
  <span>&lt;<span>modelVersion</span>&gt;</span>4.0.0<span>&lt;/<span>modelVersion</span>&gt;</span>

  <span>&lt;<span>parent</span>&gt;</span>
    <span>&lt;<span>groupId</span>&gt;</span>com.tvd12<span>&lt;/<span>groupId</span>&gt;</span>
    <span>&lt;<span>artifactId</span>&gt;</span>ezyfox<span>&lt;/<span>artifactId</span>&gt;</span>
    <span>&lt;<span>version</span>&gt;</span>1.0.2<span>&lt;/<span>version</span>&gt;</span>
  <span>&lt;/<span>parent</span>&gt;</span>

  <span>&lt;<span>groupId</span>&gt;</span>org.example<span>&lt;/<span>groupId</span>&gt;</span>
  <span>&lt;<span>artifactId</span>&gt;</span>nft-game-web<span>&lt;/<span>artifactId</span>&gt;</span>
  <span>&lt;<span>version</span>&gt;</span>1.0.0<span>&lt;/<span>version</span>&gt;</span>

  <span>&lt;<span>properties</span>&gt;</span>
    <span>&lt;<span>ezy.http.version</span>&gt;</span>0.2.0<span>&lt;/<span>ezy.http.version</span>&gt;</span>
    <span>&lt;<span>ezy.platform.version</span>&gt;</span>0.0.1a<span>&lt;/<span>ezy.platform.version</span>&gt;</span>
  <span>&lt;/<span>properties</span>&gt;</span>

  <span>&lt;<span>dependencies</span>&gt;</span>
    <span>&lt;<span>dependency</span>&gt;</span>
      <span>&lt;<span>groupId</span>&gt;</span>com.tvd12<span>&lt;/<span>groupId</span>&gt;</span>
      <span>&lt;<span>artifactId</span>&gt;</span>ezyhttp-server-boot<span>&lt;/<span>artifactId</span>&gt;</span>
      <span>&lt;<span>version</span>&gt;</span>$</span><span>{ezy.http.version}</span><span><span>&lt;/<span>version</span>&gt;</span>
    <span>&lt;/<span>dependency</span>&gt;</span>
    <span>&lt;<span>dependency</span>&gt;</span>
      <span>&lt;<span>groupId</span>&gt;</span>org.youngmonkeys<span>&lt;/<span>groupId</span>&gt;</span>
      <span>&lt;<span>artifactId</span>&gt;</span>ezyplatform-devtools<span>&lt;/<span>artifactId</span>&gt;</span>
      <span>&lt;<span>version</span>&gt;</span>$</span><span>{ezy.platform.version}</span><span><span>&lt;/<span>version</span>&gt;</span>
    <span>&lt;/<span>dependency</span>&gt;</span>
  <span>&lt;/<span>dependencies</span>&gt;</span>
<span>&lt;/<span>project</span>&gt;</span></span>
  1. File NftGameStartup:
    package org.example.nft_game;

import com.tvd12.ezyhttp.core.boot.EzyHttpApplicationBootstrap;

public class NftGameStartup {
    public static void main(String[] args) throws Exception {
        EzyHttpApplicationBootstrap.start(NftGameStartup.class);
    }
}
  • 5 Answer(s)
  • 2500 Views
  • Answer
blockchain metamask
Remain: 5
5 Answers
Avatar
monkey Enlightened
Added an answer at: 1639607397000
monkey Enlightened
Added an answer at: 1639607397000
  1. File HomeController:
    package org.example.nft_game.controller;

import java.io.IOException;
import java.io.InputStream;
import java.util.Map;

import com.fasterxml.jackson.databind.ObjectMapper;
import com.tvd12.ezyfox.stream.EzyAnywayInputStreamLoader;
import com.tvd12.ezyfox.stream.EzyInputStreamLoader;
import com.tvd12.ezyfox.stream.EzyInputStreams;
import com.tvd12.ezyfox.util.EzyMapBuilder;
import com.tvd12.ezyhttp.server.core.annotation.Controller;
import com.tvd12.ezyhttp.server.core.annotation.DoGet;
import com.tvd12.ezyhttp.server.core.view.Redirect;

@Controller
public class HomeController {

    private final ObjectMapper objectMapper;
    private final EzyInputStreamLoader inputStreamLoader;
    private static final String CONTRACT_ADDRESS = "0xA9F6009507ef930C67B98F7A12CB0CA4321aAaDB";

    public HomeController(ObjectMapper objectMapper) {
        this.objectMapper = objectMapper;
        this.inputStreamLoader = new EzyAnywayInputStreamLoader();
    }

    @DoGet("/")
    public Redirect home() {
        return Redirect.to("/index.html");
    }

    @SuppressWarnings("unchecked")
    @DoGet("/contract")
    public Map contractGet() throws IOException {
        try (InputStream inputStream = inputStreamLoader.load("abi.json")) {
            String api = EzyInputStreams.toStringUtf8(inputStream);
            return EzyMapBuilder
                .mapBuilder()
                .put("address", CONTRACT_ADDRESS)
                .put("abi", objectMapper.readValue(api, Map[].class))
                .build();
        }
    }
}
  • 1
  • Reply
Avatar
monkey Enlightened
Added an answer at: 1639607573000
monkey Enlightened
Added an answer at: 1639607573000
4. File style.css: 
body {
    background-color: #fff;
}
5. File main.js: 
var stringToHex = function(str) {
    var hex, i;
    var result = "0x";
    for (i = 0; i < str.length; i++) {
        hex = str.charCodeAt(i).toString(16);
        result += hex;
    }
    return result
}

var hexToString = function(hex) {
    var i;
    var hexes = hex.match(/.{1,2}/g) || [];
    var result = "";
    for(i = 0; i < hexes.length; i++) {
        result += String.fromCharCode(parseInt(hexes[i], 16));
    }

    return result;
}
  • 1
  • Reply
Avatar
monkey Enlightened
Added an answer at: 1639608006000
monkey Enlightened
Added an answer at: 1639608006000
  1. File abi.json, ở <a href="https://stackask.com/question/du-an-nft-don-gian-voi-metamask-va-web3-khoi-tao-moi-truong/" target="_blank">post trước</a> chúng ta đã deploy contract rồi, hãy tìm đến file: <code>truffle/build/contracts/GameItem.json</code> và copy phần "abi" array ( lưu ý chỉ copy phần array thôi nhé, không copy cả "abi": )
  2. File application.yaml:
    resources:
  enable: true
  1. File log4j.properties
    log4j.properties

# Root logger option
log4j.rootLogger=INFO, stdout

# Redirect log messages to console
log4j.appender.stdout=org.apache.log4j.ConsoleAppender
log4j.appender.stdout.Target=System.out
log4j.appender.stdout.layout=org.apache.log4j.PatternLayout
log4j.appender.stdout.layout.ConversionPattern=%d{yyyy-MM-dd HH:mm:ss} %-5p %c{1}:%L - %m%n
  • 1
  • Reply
Avatar
Nguyễn Thái Sơn Professional
Added an answer at: 1639765664000
Nguyễn Thái Sơn Professional
Added an answer at: 1639765664000 
@SuppressWarnings("unchecked") 
@DoGet("/contract") 
public Map contractGet() throws IOException { 
	try (InputStream inputStream = inputStreamLoader.load("abi.json")) { 
		String api = EzyInputStreams.toStringUtf8(inputStream); 
		return EzyMapBuilder.mapBuilder()
			.put("address", CONTRACT_ADDRESS)
			.put("abi", objectMapper.readValue(api, Map[].class))
			.build();
		}
	}
Tại sao lại phải để annotation superwarning ở đây ạ
  • 0
  • Reply
EzyMapBuilderbuildMap@SuppressWarnings("unchecked")
vào để IDE nó đỡ cảnh báo em ạ.
  –  tvd12 1639789326000
Avatar
monkey Enlightened
Added an answer at: 1639990020000
monkey Enlightened
Added an answer at: 1639990020000
index.html
<span>&lt;!DOCTYPE html&gt;</span>
<span>&lt;<span>html</span> <span>lang</span>=<span>"en"</span>&gt;</span>
<span>&lt;<span>head</span>&gt;</span>
  <span>&lt;<span>meta</span> <span>charset</span>=<span>"UTF-8"</span>&gt;</span>
  <span>&lt;<span>title</span>&gt;</span>NFT Game<span>&lt;/<span>title</span>&gt;</span>
  <span>&lt;<span>link</span> <span>rel</span>=<span>"stylesheet"</span> <span>href</span>=<span>"https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css"</span> <span>integrity</span>=<span>"sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm"</span> <span>crossorigin</span>=<span>"anonymous"</span>&gt;</span>
  <span>&lt;<span>link</span> <span>rel</span>=<span>"stylesheet"</span> <span>href</span>=<span>"/css/style.css"</span>&gt;</span>
<span>&lt;/<span>head</span>&gt;</span>
<span>&lt;<span>body</span>&gt;</span>
<span>&lt;<span>div</span> <span>class</span>=<span>"container"</span>&gt;</span>
  <span>&lt;<span>div</span> <span>class</span>=<span>"row"</span>&gt;</span>
    <span>&lt;<span>div</span> <span>class</span>=<span>"col-md-12 text-center"</span>&gt;</span>
      <span>&lt;<span>h3</span>&gt;</span>Welcome to NFT Game<span>&lt;/<span>h3</span>&gt;</span>
    <span>&lt;/<span>div</span>&gt;</span>
  <span>&lt;/<span>div</span>&gt;</span>
  <span>&lt;<span>div</span> <span>class</span>=<span>"row"</span>&gt;</span>
    <span>&lt;<span>div</span> <span>class</span>=<span>"col-md-12 text-center"</span>&gt;</span>
      <span>&lt;<span>button</span> <span>id</span>=<span>"enableEthereumButton"</span> <span>class</span>=<span>"btn btn-primary"</span>&gt;</span>Enable Ethereum<span>&lt;/<span>button</span>&gt;</span>
    <span>&lt;/<span>div</span>&gt;</span>
  <span>&lt;/<span>div</span>&gt;</span>
<span>&lt;/<span>div</span>&gt;</span>
<span>&lt;<span>script</span> <span>src</span>=<span>"https://code.jquery.com/jquery-3.6.0.js"</span> <span>integrity</span>=<span>"sha256-H+K7U5CnXl1h5ywQfKtSj8PCmoN9aaq30gDh27Xc0jk="</span> <span>crossorigin</span>=<span>"anonymous"</span>&gt;</span><span></span><span>&lt;/<span>script</span>&gt;</span>
<span>&lt;<span>script</span> <span>src</span>=<span>"https://cdnjs.cloudflare.com/ajax/libs/web3/1.6.1/web3.min.js"</span> <span>integrity</span>=<span>"sha512-5erpERW8MxcHDF7Xea9eBQPiRtxbse70pFcaHJuOhdEBQeAxGQjUwgJbuBDWve+xP/u5IoJbKjyJk50qCnMD7A=="</span> <span>crossorigin</span>=<span>"anonymous"</span> <span>referrerpolicy</span>=<span>"no-referrer"</span>&gt;</span><span></span><span>&lt;/<span>script</span>&gt;</span>
<span>&lt;<span>script</span> <span>src</span>=<span>"/js/main.js"</span>&gt;</span><span></span><span>&lt;/<span>script</span>&gt;</span>
<span>&lt;<span>script</span>&gt;</span><span>
<span>const</span> ethereumButton = $(<span>'#enableEthereumButton'</span>);

<span>async</span> <span><span>function</span> <span>getAccount</span>(<span></span>) </span>{
  <span>const</span> accounts = <span>await</span> ethereum.request({ <span>method</span>: <span>'eth_requestAccounts'</span> });
  <span>console</span>.log(<span>JSON</span>.stringify(accounts));
}

(<span><span>function</span>(<span></span>) </span>{
<span>if</span> (<span>typeof</span> <span>window</span>.ethereum === <span>'undefined'</span>) {
  <span>return</span>;
}
<span>console</span>.log(<span>'MetaMask is installed!'</span>);

ethereumButton.on(<span>'click'</span>, () =&gt; {
  getAccount();
});
})();
</span><span>&lt;/<span>script</span>&gt;</span>
<span>&lt;/<span>body</span>&gt;</span>
<span>&lt;/<span>html</span>&gt;</span>
  • 1
  • Reply
Ask A Question
  • Question(s) 1.1K
  • Answer(s) 2.2K
  • Best answer(s) 136
  • User(s) 547

Related Questions

Recent Activities

Show All Activities

Top Members

Trending Tags

.net .net core .net oop #formatdate abstract class access app access token ai android ansible anti-flooding apache poi api app architecture artificial intelligence assembly async asyncawait atomicboolean authentication backend backend nestjs background bash script batch bean big project binding bitcoin blockchain blog boot-nodes branch btree bucket4j buffered build bundle c# c# .net cache caching callback career career path cast câu hỏi centos chat cloud cloud reliability combobox commit communication computer science concurrent config-css connection pool content-disposition contract controllerservice convert date to number cookie cors cosmos cosmos-sdk crawl data cron css database database migration datasource datastructure datetime deadlock debug decentralized exchange deep learning deploy contract design patterns design-pattern dev devops dex di distraction programing dns đồ án tốt nghiệp docker download draw.io du học dữ liệu lớn duration eclip editor elasticsearch email erc20 erc721 error estimation eth ethereum ethereum login excel excel-object-mapper exception exception handle exception handler executor export compliance extensions exyfox ezydata ezyfox ezyfox-boot ezyfox-server ezyfoxserver ezyhttp ezyjpa ezymq-kafka ezyplatform ezyredis facebook fe filter floating point flutter format json freetank front-end frontend fullstack fulltextsearch future gallery game game-box game-room game-server gateway get get file zip git glide go golang gorilla graduation thesis graphql grapql grpc guide h2 database handy terminal hazelcast hibernate hibernateconfig html http https hyperloglog image index indexing integration-test intellij interface io ioc ipfs isolate issue it java java core java spring java web javacore javascript javaw jenkins jetbrains job join jotform jpa jpql jquery js json json file json to object jsonproperty jsp jsp &amp; servlet junit-test jvm jwt kafka keep promise kerberos keycloak kotlin languague laravel library list load balancer load-balancing lock log log4j log4j-core login lỗi font lưu trữ machine learning macos mail mail template main map maria db markdown math maven merge mermaid message queue messaging metamask microservice microservices migration mobile model mongo monitoring mq msgpack multi-threading multiple tenant multithread multithreading mysql n naming naming convention nan netcore netty network networking nft nft game nginx nio node.js nodejs non-blocking io null odoo oop opensource optimize oracle orm otp message paginaiton pagination pancakeswap panic partition pdf pgpool phỏng vấn php plugin pointer postgresql postman pre private_key procedure profile programming programming-language project management promise properties push message android push notification push-noti python python unicode qr qrcode question queue rabbitmq react-native reactive reactjs reactjs download readmoretextview recyclerview redis refactor refresh token regex replica repository request resilence4j resource rest restful resttemplate roadmap room database ropssten ropsten round robin rust rxjava s3 schedule scheduled scheduled spring boot search security send email send mail serialization server servlet session shift jis singleton sjis slack smart contract soap socket socket server soft delete solution sosanh spring spring aop spring boot spring data jpa spring redis spring security spring websocket spring websocket cors spring-boot-test spring-jpa springboot springsecurity springwebflux mysql sql sql server sse ssl ssl email stackask storage stream stream api stress test stresstest structure trong spring boot study synchronize synchronized system environment variables tcp test thiết kế tầng trong dự án thread thread pool threadjava threadpool thymeleaf tomcat totp tracking location transaction transfer transfer git udp ui uniswap unit test unity upload upload file utf-8 file validate validate date vector video call vietqr view volatile vue vue cli vuejs watermark web web3 web3 client webassembly webflux webpack webrtc websocket windows 11 winforms wordpress work xss zip file zookeeper