yuyongdong/UAW
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

bug fix: 登录流程

Browse Source
This commit is contained in:
CounterFire2023 2024-04-10 18:00:55 +08:00
parent b4defed779
commit 2581973219
6 changed files with 103 additions and 145 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
.env.development
View File

@ -13,3 +13,5 @@ VUE_APP_NFT_URL = '0x59e751c2037B710090035B6ea928e0cce80aC03f'
VUE_APP_BEB_URL = '0x1304E6AA241eE3C9ea44Db9e593e85Ae76eC41F1'
VUE_APP_CHAIN_ID = '5611'
VUE_APP_APP_NAME = 'CF UAW'

2
.env.production
View File

@ -12,3 +12,5 @@ VUE_APP_NFT_URL = '0x59e751c2037B710090035B6ea928e0cce80aC03f'
VUE_APP_BEB_URL = '0x1304E6AA241eE3C9ea44Db9e593e85Ae76eC41F1'
VUE_APP_CHAIN_ID = '5611'
VUE_APP_APP_NAME = 'CF UAW'

1
public/index.html
View File

@ -14,7 +14,6 @@
</noscript>
<div id="app"></div>
<!-- built files will be auto injected -->
<script src="https://www.google.com/recaptcha/api.js?render=6Ld3xoIpAAAAABW7f5ImgAC6GcWLeDCbt5HPXqe2"></script>
<script th:inline="javascript">
/**
* 加载外部js

156
src/components/walletDialog/index.vue
View File

@ -9,18 +9,8 @@
</div>
<div class="dialog-content">
<p>Connect your wallet to start your Counter Fire journey</p>
<div class="wallet-content" v-if="isWallet != null">
<li v-for="(item, index) in walletList" :key="index" @click="getLinkWallet(item.value)">
<div class="disconnect" v-if="index == 2">
<span>{{ item.name }}</span>
</div>
<div v-else>
<img :src="item.imgUrl" alt />
<span>{{ item.name }}</span>
</div>
</li>
</div>
<div class="wallet-content" v-else>
<div class="wallet-content">
<li
v-for="(item, index1) in isWalletList"
:key="index1"
@ -31,6 +21,11 @@
<span>{{ item.name }}</span>
</div>
</li>
<li @click="disconnect" v-if="isWallet">
<div class="disconnect">
<span>Disconnect</span>
</div>
</li>
</div>
</div>
</el-dialog>
@ -38,12 +33,7 @@
</template>
<script>
import Web3 from 'web3';
import { loginNonce, hexToBase58, aesEncrypt, loginWithSignature } from './../../utils/webapi.js'
import { isWalletConnected, linkWallet, disconnectLink, addNetwork } from './../../wallet/index.js';
import { SiweMessage } from './../../utils/siwe.js'
import { GlobalData } from './../../utils/GlobalData.js'
import { parseTokenData } from './../../utils/utils.js'
import { isWalletConnected, linkWallet, disconnectLink, loginWithEthereum } from './../../wallet/index.js';
import { setToken, getToken } from './../../utils/cookies.js'
export default {
@ -52,27 +42,6 @@ export default {
},
data() {
return {
walletList: [
{
name: "MetaMask",
value: "ethereum",
imgUrl: require("./../../assets/home/icon_metaMask.png")
},
{
name: "OKXwallet",
value: "okxwallet",
imgUrl: require("./../../assets/home/icon_OKXwallet.png")
// },
// {
// name: "WalletConnect",
// value: "connect",
// imgUrl: require("./../../assets/home/icon_ConnectWallet.png")
},
{
name: "Disconnect",
value: "disconnect"
}
],
isWalletList: [
{
name: "MetaMask",
@ -90,7 +59,7 @@ export default {
// imgUrl: require("./../../assets/home/icon_ConnectWallet.png")
}
],
isWallet: localStorage.getItem('walletName'),
isWallet: !!localStorage.getItem('walletName'),
myAddress: '',
activity: 'uaw_activity',
};
@ -100,97 +69,30 @@ export default {
methods: {
// 链接钱包
async getLinkWallet(val) {
// await addNetwork(val)
// return
if(localStorage.getItem('walletName')) {
let res = await linkWallet(val)
this.myAddress = res
localStorage.setItem('walletName',val)
localStorage.setItem('myAddress',res)
this.handleClose()
this.getWalletConnected()
} else {
disconnectLink(val)
if(val == 'connect') {
this.handleClose()
let res = await linkWallet(val)
localStorage.setItem('walletName',val)
localStorage.setItem('myAddress',res)
this.myAddress = res
} else if(val == "disconnect") {
this.logOut()
} else {
let res = await linkWallet(val)
this.handleClose()
localStorage.setItem('walletName',val)
localStorage.setItem('myAddress',res)
this.myAddress = res
await this.getWalletConnected()
}
}
// const currentWalletName = localStorage.getItem('walletName')
// if(currentWalletName) {
// await disconnectLink(currentWalletName)
// }
let res = await linkWallet(val)
this.handleClose()
localStorage.setItem('walletName',val)
localStorage.setItem('myAddress',res)
this.myAddress = res
await this.getWalletConnected()
},
async disconnect() {
let walletName = localStorage.getItem('walletName')
await disconnectLink(walletName)
this.logOut()
this.isWallet = false
location.reload()
},
// 登录
async getWalletConnected() {
const provider = window.ethereum;
let ethereum = window.ethereum;
var web3 = new Web3(provider);
if (ethereum) {
if(localStorage.getItem("walletName") == 'ethereum') {
ethereum.request({ method: "eth_requestAccounts" });
} else if(localStorage.getItem("walletName") == 'okxwallet') {
okxwallet.request({ method: "eth_requestAccounts" });
console.log('这里')
}
const address = web3.utils.toChecksumAddress(this.myAddress);
// return
let chainId = await web3.eth.getChainId();
chainId = parseInt(chainId);
// console.log(chainId, "----");
const nonce = await loginNonce(address);
// console.log(nonce, "nonce-------------");
const nonceStr = `${nonce}|okx`;
const nonceEncrypt = hexToBase58(
aesEncrypt(nonceStr, "uaw_activity")
);
const message = new SiweMessage({
domain: document.location.host,
address: address,
chainId,
uri: document.location.origin,
version: "1",
statement: "Tasks test",
nonce: nonceEncrypt
});
let msgSign = message.toMessage();
let signature = await provider.request({
method: "personal_sign",
params: [web3.utils.utf8ToHex(msgSign), address]
});
let resLogin = await loginWithSignature(
message,
signature,
this.activity
);
console.log(resLogin.errcode,'61')
if (!resLogin.errcode) {
new GlobalData().token = resLogin.data.token;
this.token = resLogin.data.token;
localStorage.setItem("token", resLogin.data.token);
localStorage.setItem(
`${this.TOKEN_KEY}+ ${address}`,
resLogin.data.token
);
setToken(resLogin.data.token)
// console.log(resLogin.data.token);
console.log(parseTokenData(resLogin.data.token),'------------------');
this.getUserState(resLogin.data.token)
}
} else {
console.log("Please install the MetaMask plugin");
}
let token = await loginWithEthereum(this.activity)
await this.getUserState(token)
},
// 获取用户状态
getUserState(token) {

15
src/views/home/index.vue
View File

@ -112,7 +112,7 @@
</li>
</div>
<div class="wallet" @click="onWalletLogin">
<span v-if="!myAddress">X Connected</span>
<span v-if="!token">X Connected</span>
<div
class="wallet-address"
v-else
@ -164,7 +164,7 @@
<p>{{ item.desc }}</p>
</div>
</div>
<div v-if="token" class="btn">
<div v-if="token != null" class="btn">
<div class="is-btn" v-if="item.task == 'TwitterConnect'">
<div v-if="item.status == 0 || item.status == 1" class="started" @click="toPost(item)">Connect</div>
<div v-if="item.status == 2" class="claim" @click="getTaskClaim(item.id)">Claim</div>
@ -181,7 +181,7 @@
<div v-if="item.status == 3" class="success">+{{ item.score }} <img src="./../../assets/home/Checkmark.png" alt=""></div>
</div>
</div>
<LinkBtn v-else text="Connect Wallet" />
<div class='light-btn' v-else @click="onWalletLogin">Connect Wallet</div>
</li>
</div>
<div class="tips">
@ -488,9 +488,7 @@ import Calen from "./calenView.vue";
import BoxBtm from './boxBtm.vue'
// import ImgView from './../../components/imgView.vue'
import gameView from "./gameView.vue";
import LinkBtn from "@/components/linkButton/linkBtnView.vue";
import WalletDialog from "./../../components/walletDialog/index.vue";
import Web3 from "web3";
import { getToken } from './../../utils/cookies.js'
import { getWalletAddress, isWalletConnected, linkWallet } from "./../../wallet/index.js";
import {
@ -506,14 +504,12 @@ import {
checkReCaptcha,
retweetTwitter,
} from "./../../utils/webapi.js";
import { sendDailyCheckIn, sendClaimTask, sendHelp, sendExplore } from "./../../utils/chainapi.js";
import CryptoJS from "crypto-js";
import { sendDailyCheckIn, sendClaimTask, sendHelp } from "./../../utils/chainapi.js";
export default {
components: {
// Zillionaire,
Calen,
LinkBtn,
gameView,
WalletDialog,
BoxBtm,
@ -2161,6 +2157,9 @@ export default {
}
}
}
.light-btn{
cursor: pointer;
}
.Explore-dialog {
}

70
src/wallet/index.js
View File

@ -1,6 +1,12 @@
import Web3 from 'web3'
import { toHexChainId } from '@/utils/utils'
import { loginNonce, hexToBase58, aesEncrypt, loginWithSignature } from '@/utils/webapi.js'
import { SiweMessage } from '@/utils/siwe.js'
import { GlobalData } from '@/utils/GlobalData.js'
import { parseTokenData } from '@/utils/utils.js'
import { setToken } from '@/utils/cookies.js'
// Wallet Connect初始化
@ -47,18 +53,18 @@ const connectWc = async() => {
});
return wc
}
let provider = null
let provider = window.provider || null
export async function getWalletAddress() {
const web3 = await provider.request({
const res = await provider.request({
method: 'eth_accounts'
})
if (web3 !== 'undefined') {
if (web3[0] == '') {
if (res !== 'undefined') {
if (res[0] == '') {
return false
} else {
return await web3[0]
return await res[0]
}
}
}
@ -146,7 +152,7 @@ export const changeChain = async() => {
};
// 链接钱包
export const linkWallet = async(name) => {
export async function linkWallet(name){
if(name == "ethereum") {
provider = window.ethereum
} else if(name == "okxwallet") {
@ -154,10 +160,12 @@ export const linkWallet = async(name) => {
} else if(name == "connect") {
provider = await connectWc()
}
window.provider = provider
let res = await provider.request({ method: "eth_requestAccounts" })
return res[0]
// location.reload()
};
}
// 断开链接
export async function disconnectLink(name) {
@ -197,6 +205,52 @@ export async function isWalletConnected() {
// 添加网络
export async function addNetwork(name) {
export async function addNetwork() {
changeChain()
}
export async function loginWithEthereum(activity) {
const web3 = new Web3(provider)
let address = await getWalletAddress()
address = web3.utils.toChecksumAddress(address);
// return
let chainId = await web3.eth.getChainId();
chainId = parseInt(chainId);
// console.log(chainId, "----");
const nonce = await loginNonce(address);
// console.log(nonce, "nonce-------------");
const nonceStr = `${nonce}|okx`;
const nonceEncrypt = hexToBase58(
aesEncrypt(nonceStr, "uaw_activity")
);
const message = new SiweMessage({
domain: document.location.host,
address: address,
chainId,
uri: document.location.origin,
version: "1",
statement: process.env.VUE_APP_APP_NAME,
nonce: nonceEncrypt
});
let msgSign = message.toMessage();
let signature = await provider.request({
method: "personal_sign",
params: [web3.utils.utf8ToHex(msgSign), address]
});
let resLogin = await loginWithSignature(
message,
signature,
activity
);
console.log(resLogin.errcode,'61')
if (!resLogin.errcode) {
new GlobalData().token = resLogin.data.token;
localStorage.setItem("token", resLogin.data.token);
setToken(resLogin.data.token)
// console.log(resLogin.data.token);
console.log(parseTokenData(resLogin.data.token),'------------------');
return resLogin.data.token;
} else {
throw new Error(resLogin.errmsg);
}
}