Gate面试真题 / Gate Interview Questions

Web3相关 / Web3 Related

1. web3工作中你主要负责了哪些工作？大致介绍一下 / What were your main responsibilities in Web3 work? Give a brief introduction.

答案要点 / Key Points:

根据个人实际经验回答，可从以下角度阐述： Answer based on personal experience, from the following perspectives:

• DApp前端开发 / DApp Frontend Development：使用React/Vue等框架构建去中心化应用界面 / Building decentralized application interfaces using React/Vue frameworks
• 钱包集成 / Wallet Integration：MetaMask、WalletConnect等钱包的连接与交互 / Connecting and interacting with wallets like MetaMask and WalletConnect
• 智能合约交互 / Smart Contract Interaction：使用ethers.js/web3.js与合约进行读写操作 / Reading and writing to contracts using ethers.js/web3.js
• 交易处理 / Transaction Processing：交易发送、状态监听、错误处理 / Transaction sending, status monitoring, error handling
• Swap功能开发 / Swap Feature Development：代币兑换界面与逻辑实现 / Token swap interface and logic implementation
• NFT相关 / NFT Related：NFT铸造、展示、交易等功能 / NFT minting, display, trading features

2. 主要使用到的链是什么，有没有接触到Solana链？ / What chains did you mainly use? Have you worked with Solana?

答案要点 / Key Points:

• EVM兼容链 / EVM Compatible Chains：Ethereum、BSC、Polygon、Arbitrum、Optimism等 / Ethereum, BSC, Polygon, Arbitrum, Optimism, etc.
• Solana：
  • 使用Rust编写智能合约（程序）/ Smart contracts (programs) written in Rust
  • 前端使用@solana/web3.js进行交互 / Frontend interaction using @solana/web3.js
  • 账户模型与EVM不同，采用Program Derived Address (PDA) / Account model differs from EVM, uses Program Derived Address (PDA)
  • 交易确认速度快，但网络偶尔不稳定 / Fast transaction confirmation, but network occasionally unstable
  • 使用Phantom、Solflare等钱包 / Uses wallets like Phantom, Solflare

3. 你们Swap里面主要支持什么链？L1还是L2？L2的话有哪些？ / What chains does your Swap mainly support? L1 or L2? Which L2s?

答案要点 / Key Points:

• L1链 / L1 Chains：Ethereum、BSC、Solana等 / Ethereum, BSC, Solana, etc.
• L2链 / L2 Chains：
  • Optimistic Rollups：Arbitrum、Optimism、Base
  • ZK Rollups：zkSync、StarkNet、Polygon zkEVM
• 跨链支持 / Cross-chain Support：可能涉及跨链桥接功能 / May involve cross-chain bridging functionality

4. 在L2上发送交易的时候，有没有遇到过很长时间都没有反应的情况，怎么解决的呢？ / When sending transactions on L2, have you encountered situations where there was no response for a long time? How did you solve it?

答案要点 / Key Points:

问题原因分析 / Problem Analysis:

• L2网络拥堵 / L2 network congestion
• Gas价格设置过低 / Gas price set too low
• Sequencer故障或延迟 / Sequencer failure or delay
• RPC节点响应慢 / Slow RPC node response

解决方案 / Solutions:

• 设置合理的超时机制 / Set reasonable timeout mechanisms：前端增加超时提示和重试逻辑 / Add timeout prompts and retry logic on frontend
• 动态Gas调整 / Dynamic Gas Adjustment：根据网络状况动态调整Gas Price / Dynamically adjust Gas Price based on network conditions
• 交易加速 / Transaction Acceleration：支持用户通过提高Gas重新发送交易（Replace-By-Fee）/ Support users to resend transactions with higher Gas (Replace-By-Fee)
• 多RPC备份 / Multiple RPC Backup：配置多个RPC节点，自动切换 / Configure multiple RPC nodes with automatic switching
• 状态轮询优化 / Status Polling Optimization：合理设置轮询间隔，避免频繁请求 / Set reasonable polling intervals to avoid frequent requests
• 用户提示 / User Notification：明确告知用户L2确认可能需要等待，提供交易hash查询入口 / Clearly inform users that L2 confirmation may take time, provide transaction hash query entry

5. 从一个消息签名开始，到签名结束整个流程说一下 / Describe the entire process from message signing start to finish.

答案要点 / Key Points:

// 1. 构造待签名消息 / Construct message to sign
const message = "Login to DApp at timestamp: " + Date.now();

// 2. 请求用户签名（以ethers.js为例）/ Request user signature (using ethers.js)
const signer = provider.getSigner();
const signature = await signer.signMessage(message);

// 3. 签名流程细节 / Signature process details:
// - 消息会被添加前缀 / Message gets prefix added: "\x19Ethereum Signed Message:\n" + message.length + message
// - 对前缀后的消息进行Keccak256哈希 / Keccak256 hash of prefixed message
// - 使用用户私钥对哈希进行ECDSA签名 / ECDSA sign the hash with user's private key
// - 生成65字节签名 / Generate 65-byte signature (r: 32 bytes, s: 32 bytes, v: 1 byte)

// 4. 后端/合约验证签名 / Backend/contract signature verification
// - 使用ecrecover从签名恢复签名者地址 / Use ecrecover to recover signer address from signature
// - 对比恢复的地址与声称的地址是否一致 / Compare recovered address with claimed address

完整流程 / Complete Process:

1. 前端构造消息 / Frontend constructs message
2. 调用钱包签名API / Call wallet signing API
3. 钱包弹窗请求用户确认 / Wallet popup requests user confirmation
4. 用户确认后钱包用私钥签名 / Wallet signs with private key after user confirms
5. 返回签名结果 / Return signature result
6. 前端将签名发送给后端 / Frontend sends signature to backend
7. 后端验证签名有效性 / Backend verifies signature validity

6. 有没有遇到过在ETH转小币种的时候，合约告诉用户已经成功了，但是用户钱包里没有显示，怎么处理呢？ / Have you encountered situations where swapping ETH to small tokens shows success but tokens don't appear in wallet? How to handle it?

答案要点 / Key Points:

问题原因 / Problem Causes:

• 钱包未添加该代币（ERC20需要手动添加Token地址）/ Wallet hasn't added the token (ERC20 requires manual token address addition)
• 区块确认数不够，钱包尚未同步 / Not enough block confirmations, wallet not synced yet
• 钱包RPC节点数据延迟 / Wallet RPC node data delay

解决方案 / Solutions:

• 自动添加代币 / Auto-add Token：交易成功后调用wallet_watchAsset方法，提示用户添加代币 / Call wallet_watchAsset method after successful transaction to prompt user to add token

await window.ethereum.request({
  method: 'wallet_watchAsset',
  params: {
    type: 'ERC20',
    options: {
      address: tokenAddress,
      symbol: 'TOKEN',
      decimals: 18,
    },
  },
});

• 提供手动添加指引 / Provide Manual Add Guide：在UI中展示代币合约地址，引导用户手动添加 / Display token contract address in UI, guide users to add manually
• 区块确认提示 / Block Confirmation Notice：明确告知用户需等待几个区块确认 / Clearly inform users to wait for several block confirmations
• 提供区块浏览器链接 / Provide Block Explorer Link：让用户可以直接在Etherscan等浏览器查看交易详情 / Allow users to view transaction details directly on Etherscan

7. 基本上都是和合约进行交互是吗？有没有做过复杂的逻辑，签名的合并啥的？ / Is it mainly contract interaction? Have you done complex logic like signature aggregation?

答案要点 / Key Points:

多签（MultiSig）/ Multi-signature:

• Gnosis Safe等多签钱包的交互 / Interaction with multi-sig wallets like Gnosis Safe
• 收集多个签名后一次性提交 / Collect multiple signatures then submit at once

批量签名/交易 / Batch Signing/Transactions:

• 使用Multicall合约批量执行多个调用 / Use Multicall contract to batch execute multiple calls
• EIP-712结构化数据签名 / EIP-712 structured data signing

Permit签名（EIP-2612）/ Permit Signing (EIP-2612):

// 无需approve，直接通过签名授权 / No approve needed, authorize directly through signature
const permit = await signTypedData({
  domain: { name, version, chainId, verifyingContract },
  types: { Permit: [...] },
  value: { owner, spender, value, nonce, deadline }
});
// 合约调用时传入permit签名参数 / Pass permit signature params when calling contract

签名聚合 / Signature Aggregation:

• BLS签名聚合（多个签名合并为一个）/ BLS signature aggregation (merge multiple signatures into one)
• 用于降低验证成本，常见于L2方案 / Used to reduce verification costs, common in L2 solutions

8. 如果有多笔合约交易同时进行，需要注意什么？ / What should you pay attention to when multiple contract transactions are happening simultaneously?

答案要点 / Key Points:

Nonce管理 / Nonce Management:

• 每笔交易需要唯一且递增的nonce / Each transaction needs a unique and incremental nonce
• 并发发送时需手动管理nonce，避免冲突 / Manually manage nonce when sending concurrently to avoid conflicts

let nonce = await provider.getTransactionCount(address);
// 发送多笔交易时 / When sending multiple transactions
await contract.method1({ nonce: nonce });
await contract.method2({ nonce: nonce + 1 });
await contract.method3({ nonce: nonce + 2 });

交易顺序依赖 / Transaction Order Dependencies:

• 如果交易有依赖关系（如先approve再swap），必须顺序执行 / If transactions have dependencies (like approve before swap), must execute sequentially
• 使用Promise链或await确保顺序 / Use Promise chain or await to ensure order

Gas Price竞争 / Gas Price Competition:

• 并发交易可能导致Gas Price竞争 / Concurrent transactions may lead to Gas Price competition
• 设置合理的Gas策略 / Set reasonable Gas strategy

状态管理 / State Management:

• 跟踪每笔交易的pending/confirmed/failed状态 / Track pending/confirmed/failed status of each transaction
• 处理部分成功的情况 / Handle partial success scenarios

使用Multicall / Using Multicall:

• 将多个只读调用合并为一次请求 / Merge multiple read-only calls into one request
• 减少RPC请求次数，提高性能 / Reduce RPC requests, improve performance

Web2相关 / Web2 Related

1. React的生命周期 / React Lifecycle

答案要点 / Key Points:

类组件生命周期 / Class Component Lifecycle:

• 挂载阶段 / Mounting：constructor → getDerivedStateFromProps → render → componentDidMount
• 更新阶段 / Updating：getDerivedStateFromProps → shouldComponentUpdate → render → getSnapshotBeforeUpdate → componentDidUpdate
• 卸载阶段 / Unmounting：componentWillUnmount

函数组件（Hooks）/ Function Components (Hooks):

• 挂载/更新 / Mount/Update：useEffect(() => {}, [deps])
• 卸载 / Unmount：useEffect返回的清理函数 / Cleanup function returned by useEffect
• 模拟componentDidMount / Simulate componentDidMount：useEffect(() => {}, [])
• 模拟componentDidUpdate / Simulate componentDidUpdate：useEffect(() => {}, [deps])

2. 调用useState的更新函数后，React具体的渲染阶段 / What are the specific rendering phases after calling useState update function?

答案要点 / Key Points:

1. 触发更新 / Trigger Update：调用setState，将更新加入队列 / Call setState, add update to queue
2. 调度阶段（Scheduler）/ Scheduling Phase：React决定何时处理更新 / React decides when to process updates
3. Reconciliation阶段（Render Phase）/ Reconciliation Phase:
   • 创建新的Fiber树 / Create new Fiber tree
   • Diff算法比较新旧节点 / Diff algorithm compares old and new nodes
   • 标记需要更新的节点 / Mark nodes that need updating
   • 这个阶段是纯计算，可中断 / This phase is pure computation, interruptible
4. Commit阶段 / Commit Phase:
   • 将变更应用到真实DOM / Apply changes to real DOM
   • 执行副作用（useEffect等）/ Execute side effects (useEffect, etc.)
   • 这个阶段不可中断 / This phase is not interruptible

批量更新 / Batch Updates：React 18默认开启自动批处理，多次setState会合并为一次渲染 / React 18 enables automatic batching by default, multiple setStates are merged into one render

3. useLayoutEffect和useEffect的区别，useLayoutEffect会不会阻塞渲染？ / What's the difference between useLayoutEffect and useEffect? Does useLayoutEffect block rendering?

答案要点 / Key Points:

useLayoutEffect会阻塞渲染 / useLayoutEffect blocks rendering:

• 在浏览器绘制之前同步执行 / Executes synchronously before browser paint
• 适用于需要在用户看到更新前同步修改DOM的场景 / Suitable for scenarios requiring sync DOM modifications before user sees updates
• 避免闪烁问题（如测量元素尺寸后调整位置）/ Prevents flickering (e.g., measuring element size then adjusting position)

// 避免闪烁的例子 / Example to prevent flickering
useLayoutEffect(() => {
  // 测量DOM并立即调整，用户看不到中间状态
  // Measure DOM and adjust immediately, user doesn't see intermediate state
  const height = ref.current.getBoundingClientRect().height;
  setHeight(height);
}, []);

4. 服务端渲染有没有做过，SSR、SSG的区别 / Have you done server-side rendering? What's the difference between SSR and SSG?

答案要点 / Key Points:

Next.js中的实现 / Implementation in Next.js:

// SSR
export async function getServerSideProps(context) {
  const data = await fetchData();
  return { props: { data } };
}

// SSG
export async function getStaticProps() {
  const data = await fetchData();
  return { props: { data } };
}

// ISR（增量静态再生成）/ ISR (Incremental Static Regeneration)
export async function getStaticProps() {
  return { props: { data }, revalidate: 60 }; // 60秒后重新生成 / Regenerate after 60 seconds
}

项目经验相关 / Project Experience Related

1. 给我介绍一下这个低代码平台，怎么实现的？ / Introduce this low-code platform, how was it implemented?

答案要点 / Key Points:

核心架构 / Core Architecture:

• Schema驱动 / Schema-driven：使用JSON Schema描述页面结构和组件配置 / Use JSON Schema to describe page structure and component configuration
• 组件库 / Component Library：预置可拖拽的基础组件和业务组件 / Pre-built draggable base and business components
• 渲染引擎 / Rendering Engine：根据Schema动态渲染页面 / Dynamically render pages based on Schema

主要模块 / Main Modules:

• 可视化编辑器 / Visual Editor：拖拽式页面搭建 / Drag-and-drop page building
• 属性配置面板 / Property Configuration Panel：组件属性的表单化配置 / Form-based component property configuration
• Schema管理 / Schema Management：Schema的存储、版本管理 / Schema storage, version management
• 预览与发布 / Preview and Publish：实时预览、一键发布 / Real-time preview, one-click publish

技术实现 / Technical Implementation:

// Schema结构示例 / Schema structure example
{
  "type": "page",
  "children": [
    {
      "type": "form",
      "props": { "layout": "vertical" },
      "children": [
        { "type": "input", "props": { "label": "姓名", "field": "name" } }
      ]
    }
  ]
}

2. Schema JSON获取到了后，在小程序是如何处理的？ / How is the Schema JSON processed in mini programs after retrieval?

答案要点 / Key Points:

Schema解析 / Schema Parsing:

• 获取JSON Schema后进行解析和校验 / Parse and validate after retrieving JSON Schema
• 处理组件映射关系 / Handle component mapping relationships

动态渲染 / Dynamic Rendering:

// 小程序端动态渲染 / Mini program dynamic rendering
const componentMap = {
  'input': 'custom-input',
  'button': 'custom-button',
  // ...
};

function renderComponent(schema) {
  const componentName = componentMap[schema.type];
  return {
    name: componentName,
    props: schema.props,
    children: schema.children?.map(renderComponent)
  };
}

注意事项 / Considerations:

• 小程序不支持动态组件，需预注册所有可能用到的组件 / Mini programs don't support dynamic components, need to pre-register all possible components
• 使用template或自定义组件实现条件渲染 / Use template or custom components for conditional rendering
• 性能优化：大型Schema需要分片渲染 / Performance optimization: large Schema needs chunked rendering

3. Web3实现上有什么需要特别注意的？ / What needs special attention in Web3 implementation?

答案要点 / Key Points:

安全性 / Security:

• 永远不要在前端暴露私钥 / Never expose private keys on frontend
• 签名前展示清晰的交易信息 / Display clear transaction info before signing
• 防范钓鱼攻击和恶意合约 / Guard against phishing attacks and malicious contracts

用户体验 / User Experience:

• 钱包未安装时的引导 / Guidance when wallet not installed
• 网络切换的处理 / Network switching handling
• 交易状态的实时反馈 / Real-time transaction status feedback
• 错误信息的友好展示 / User-friendly error message display

网络处理 / Network Handling:

• 多链支持和切换 / Multi-chain support and switching
• RPC节点的容错处理 / RPC node fault tolerance
• Gas估算和动态调整 / Gas estimation and dynamic adjustment

状态管理 / State Management:

• 钱包连接状态 / Wallet connection status
• 账户余额缓存与更新 / Account balance caching and updating
• 交易历史记录 / Transaction history

4. 使用web3-react对项目进行封装Provider怎么实现的？ / How to implement Provider encapsulation using web3-react?

答案要点 / Key Points:

import { Web3ReactProvider } from '@web3-react/core';
import { InjectedConnector } from '@web3-react/injected-connector';
import { WalletConnectConnector } from '@web3-react/walletconnect-connector';

// 1. 配置连接器 / Configure connectors
const injected = new InjectedConnector({
  supportedChainIds: [1, 56, 137]
});

const walletconnect = new WalletConnectConnector({
  rpc: { 1: 'https://mainnet.infura.io/v3/xxx' },
  qrcode: true
});

// 2. 创建connectors配置 / Create connectors configuration
const connectors = {
  injected,
  walletconnect
};

// 3. 封装Provider / Encapsulate Provider
function Web3Provider({ children }) {
  return (
    <Web3ReactProvider connectors={connectors}>
      {children}
    </Web3ReactProvider>
  );
}

// 4. 使用Hook获取状态 / Use Hook to get status
function useWallet() {
  const { account, chainId, connector, activate, deactivate } = useWeb3React();

  const connect = async (connectorName) => {
    await activate(connectors[connectorName]);
  };

  return { account, chainId, connect, disconnect: deactivate };
}

5. AWS中Serverless的Lambda你也有所了解，介绍一下 / You also understand AWS Serverless Lambda, introduce it.

答案要点 / Key Points:

Lambda基本概念 / Lambda Basic Concepts:

• 无服务器计算服务，按调用次数和执行时间计费 / Serverless compute service, charged by invocation count and execution time
• 自动扩缩容，无需管理服务器 / Auto-scaling, no server management needed

触发方式 / Trigger Methods:

• API Gateway（HTTP请求）/ API Gateway (HTTP requests)
• S3事件（文件上传）/ S3 events (file uploads)
• DynamoDB Streams
• CloudWatch Events（定时任务）/ CloudWatch Events (scheduled tasks)
• SQS/SNS消息 / SQS/SNS messages

使用示例 / Usage Example:

// Lambda函数示例 / Lambda function example
exports.handler = async (event) => {
  const body = JSON.parse(event.body);
  // 业务逻辑 / Business logic
  return {
    statusCode: 200,
    body: JSON.stringify({ message: 'Success' })
  };
};

注意事项 / Considerations:

• 冷启动问题：首次调用或长时间未调用会有延迟 / Cold start issue: delay on first invocation or after long idle time
• 执行时间限制：最长15分钟 / Execution time limit: max 15 minutes
• 内存配置影响CPU分配 / Memory configuration affects CPU allocation
• 无状态设计，状态需存储在外部（DynamoDB、S3等）/ Stateless design, state needs external storage (DynamoDB, S3, etc.)

6. 项目发布介绍一下，发布流程CI/CD / Introduce project release, CI/CD process.

答案要点 / Key Points:

CI（持续集成）/ CI (Continuous Integration):

# GitHub Actions示例 / GitHub Actions example
name: CI
on: [push, pull_request]
jobs:
  build:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v2
      - name: Install dependencies
        run: npm install
      - name: Lint
        run: npm run lint
      - name: Test
        run: npm run test
      - name: Build
        run: npm run build

CD（持续部署）/ CD (Continuous Deployment):

• 开发环境 / Dev Environment：push到develop分支自动部署 / Auto-deploy on push to develop branch
• 测试环境 / Test Environment：PR合并后自动部署 / Auto-deploy after PR merge
• 生产环境 / Production Environment：打tag或手动触发部署 / Deploy on tag or manual trigger

常用工具 / Common Tools:

• GitHub Actions / GitLab CI
• Jenkins
• AWS CodePipeline
• Vercel / Netlify（前端 / Frontend）

流程设计 / Process Design:

代码提交 / Code Commit → 代码检查(ESLint) / Code Check → 单元测试 / Unit Test → 构建 / Build →
部署到测试环境 / Deploy to Test → E2E测试 / E2E Test → 人工审核 / Manual Review → 部署到生产环境 / Deploy to Production