+
-
+
Logout
@@ -30,7 +30,7 @@ import { Component, Vue } from 'vue-property-decorator'
import { Message } from 'element-ui'
import { AppModule } from '@/store/modules/app'
import { BlockChain } from '@/utils/blockchain'
-import { loginWithSign } from '@/utils/login'
+import { UserModule } from '@/store/modules/user'
declare module 'vue/types/vue' {
interface Vue {
@@ -62,11 +62,15 @@ export default class extends Vue {
async collectToWallet() {
await this.bc.connect()
- await loginWithSign(this.bc, AppModule.accountId, AppModule.chainId)
+ await UserModule.Login({
+ bcInstance: this.bc,
+ account: AppModule.accountId,
+ chainId: AppModule.chainId
+ })
}
- toggleDrop() {
- this.dropShow = !this.dropShow
+ get logined() {
+ return !!UserModule.token
}
get accountId() {
diff --git a/src/components/main/MainHeader.vue b/src/components/main/MainHeader.vue
index 9e196b6..51054c7 100644
--- a/src/components/main/MainHeader.vue
+++ b/src/components/main/MainHeader.vue
@@ -24,7 +24,7 @@
-
+
Mine
@@ -49,16 +49,16 @@
-
+
Mine
MARKETPLACE
-
+
Logout
-
+
Connect Wallet
@@ -71,6 +71,7 @@ import { Component, Vue } from 'vue-property-decorator'
import { Message } from 'element-ui'
import { AppModule } from '@/store/modules/app'
import { BlockChain } from '@/utils/blockchain'
+import { UserModule } from '@/store/modules/user'
declare module 'vue/types/vue' {
interface Vue {
@@ -101,7 +102,16 @@ export default class extends Vue {
}
async collectToWallet() {
- return this.bc.connect()
+ await this.bc.connect()
+ await UserModule.Login({
+ bcInstance: this.bc,
+ account: AppModule.accountId,
+ chainId: AppModule.chainId
+ })
+ }
+
+ get logined() {
+ return !!UserModule.token
}
toggleDrop() {
diff --git a/src/components/mobile/main/MobileHeader.vue b/src/components/mobile/main/MobileHeader.vue
index 74baf92..efd28c3 100644
--- a/src/components/mobile/main/MobileHeader.vue
+++ b/src/components/mobile/main/MobileHeader.vue
@@ -29,6 +29,7 @@ import { Message } from 'element-ui'
import { BlockChain } from '@/utils/blockchain'
import { loginWithSign } from '@/utils/login'
import { AppModule } from '@/store/modules/app'
+import { UserModule } from '@/store/modules/user'
@Component({
name: 'MobileHeader',
@@ -66,7 +67,16 @@ export default class MobileHeader extends Vue {
async collectToWallet() {
await this.bc.connect()
- await loginWithSign(this.bc, AppModule.accountId, AppModule.chainId)
+ console.log(`AppModule.accountId: ${AppModule.accountId}, chainId: ${AppModule.chainId}`)
+ await UserModule.Login({
+ bcInstance: this.bc,
+ account: AppModule.accountId,
+ chainId: AppModule.chainId
+ })
+ }
+
+ get logined() {
+ return !!UserModule.token
}
get accountId() {
diff --git a/src/store/modules/user.ts b/src/store/modules/user.ts
index 4f5d7ba..1b35ba9 100644
--- a/src/store/modules/user.ts
+++ b/src/store/modules/user.ts
@@ -6,9 +6,14 @@ import {
VuexModule
} from 'vuex-module-decorators'
import { getToken, removeToken, setToken } from '@/utils/cookies'
-import { getUserInfo, login, logout } from '@/api/User'
+import { getNonce, getUserInfo, login } from '@/api/User'
import store from '@/store'
+const EIP721_DOMAIN_DATA = [
+ { name: 'name', type: 'string' },
+ { name: 'version', type: 'string' }
+]
+
export interface IUserState {
token: string
name: string
@@ -36,12 +41,42 @@ class User extends VuexModule implements IUserState {
public account = ''
@Action
- public async Login(userInfo: { username: string, password: string }) {
- let { username, password } = userInfo
- username = username.trim()
- const { data } = await login({ username, password })
- setToken(data.token)
- this.SET_TOKEN(data.token)
+ public async Login({ bcInstance, account, chainId }: {bcInstance: any, account: string, chainId: string | number}) {
+ chainId += ''
+ const preRequest: any = await getNonce({ account, net_id: chainId })
+ const tips = 'This signature is only used for verify your account'
+ const signMsg = {
+ tips,
+ nonce: preRequest.nonce + ''
+ }
+
+ const signObj = {
+ types: {
+ EIP712Domain: EIP721_DOMAIN_DATA,
+ set: [
+ { name: 'tips', type: 'string' },
+ { name: 'nonce', type: 'string' }
+ ]
+ },
+ primaryType: 'set',
+ domain: {
+ name: 'Auth',
+ version: '1'
+ },
+ message: signMsg
+ }
+ const signature = await bcInstance.signData(signObj, account)
+ const authData = {
+ account,
+ nonce: preRequest.nonce,
+ signature,
+ tips,
+ net_id: chainId
+ }
+ console.log('login data: ', authData)
+ const res: any = await login(authData)
+ setToken(res.token)
+ this.SET_TOKEN(res.token)
}
@Action
@@ -82,7 +117,7 @@ class User extends VuexModule implements IUserState {
if (this.token === '') {
throw Error('LogOut: token is undefined!')
}
- await logout()
+ // await logout()
removeToken()
this.SET_TOKEN('')
this.SET_ROLES([])
@@ -146,6 +181,10 @@ class User extends VuexModule implements IUserState {
}
this.permissions = results
}
+
+ get encodeToken() {
+ return encodeURIComponent(this.token)
+ }
}
export const UserModule = getModule(User)
diff --git a/src/utils/blockchain.ts b/src/utils/blockchain.ts
index 9e8ee62..9c47219 100644
--- a/src/utils/blockchain.ts
+++ b/src/utils/blockchain.ts
@@ -6,6 +6,7 @@ import Web3 from 'web3'
import { MessageBox } from 'element-ui'
import { ERC20ABI, MALL_ADDRESS } from '@/utils/config_chain'
import { EventBus, NEED_LOGIN } from '@/utils/event-bus'
+import { UserModule } from '@/store/modules/user'
const EIP721_DOMAIN_DATA = [
{ name: 'name', type: 'string' },
@@ -87,13 +88,14 @@ export class BlockChain {
return this.disconnect()
}
}
- console.log('chainId: ', chainId)
- console.log('accountsLogin: ', accounts)
if (accounts && accounts.length > 0) {
AppModule.updateAccount(accounts[0])
}
AppModule.updateWalletStatus(true)
+ console.log('chainId: ', chainId)
+ console.log('accountsLogin: ', accounts, AppModule.accountId)
+ return { account: accounts[0], chainId }
} catch (err) {
}
}
@@ -118,6 +120,7 @@ export class BlockChain {
public async disconnect() {
try {
+ await UserModule.LogOut()
await this.provider?.disconnect()
} catch (err) {
}
diff --git a/src/utils/cookies.ts b/src/utils/cookies.ts
index 9c3e954..a0104c3 100644
--- a/src/utils/cookies.ts
+++ b/src/utils/cookies.ts
@@ -14,6 +14,6 @@ export const setMini = (mini: string) => Cookies.set(miniKey, mini)
// User
const tokenKey = 'vue_typescript_access_token'
-export const getToken = () => Cookies.get(tokenKey)
-export const setToken = (token: string) => Cookies.set(tokenKey, token)
-export const removeToken = () => Cookies.remove(tokenKey)
+export const getToken = () => localStorage.getItem(tokenKey)
+export const setToken = (token: string) => localStorage.setItem(tokenKey, token)
+export const removeToken = () => localStorage.removeItem(tokenKey)
diff --git a/src/utils/request.ts b/src/utils/request.ts
index 4727cb5..e9f10e7 100644
--- a/src/utils/request.ts
+++ b/src/utils/request.ts
@@ -12,7 +12,13 @@ service.interceptors.request.use(
(config) => {
// Add X-Access-Token header to every request, you can add other custom headers here
if (UserModule.token) {
- config.headers.authorization = 'Bearer ' + UserModule.token
+ if (config.url) {
+ if (config.url.indexOf('?') > 0) {
+ config.url += `&token=${UserModule.encodeToken}`
+ } else {
+ config.url += `?token=${UserModule.encodeToken}`
+ }
+ }
}
config.headers['Content-Type'] = 'application/json'
return config