Skip to content

W
wechat-common
Commit 264981a7 by zhangleyuan
Options

Merge branch 'feature/zhangleyuan/20210105/wechat-authorize' into 'master' 

Feature/zhangleyuan/20210105/wechat authorize

See merge request !1
parents ba92d52e 87c041fd
Showing with 134 additions and 53 deletions
package.json
...@@ -59,6 +59,7 @@ ...@@ -59,6 +59,7 @@
"postcss-normalize": "8.0.1", "postcss-normalize": "8.0.1",
"postcss-preset-env": "6.7.0", "postcss-preset-env": "6.7.0",
"postcss-safe-parser": "4.0.1", "postcss-safe-parser": "4.0.1",
"query-string": "^6.13.8",
"react": "^16.13.1", "react": "^16.13.1",
"react-app-polyfill": "^1.0.6", "react-app-polyfill": "^1.0.6",
"react-dev-utils": "^10.2.1", "react-dev-utils": "^10.2.1",
......
public/index.html
<!-- <!--
* @Author: 吴文洁 * @Author: 吴文洁
* @Date: 2020-08-24 12:20:57 * @Date: 2020-08-24 12:20:57
* @LastEditors: 吴文洁 * @LastEditors: zhangleyuan
* @LastEditTime: 2020-08-27 10:10:06 * @LastEditTime: 2021-01-12 10:11:39
* @Description: * @Description:
* @Copyright: 杭州杰竞科技有限公司 版权所有 * @Copyright: 杭州杰竞科技有限公司 版权所有
--> -->
...@@ -32,7 +32,7 @@ ...@@ -32,7 +32,7 @@
work correctly both with client-side routing and a non-root public URL. work correctly both with client-side routing and a non-root public URL.
Learn how to configure a non-root public URL by running `npm run build`. Learn how to configure a non-root public URL by running `npm run build`.
--> -->
<title>React App</title> <title>登录</title>
<script type="text/javascript" src="https://image.xiaomaiketang.com/xm/PhotoClip.js"></script> <script type="text/javascript" src="https://image.xiaomaiketang.com/xm/PhotoClip.js"></script>
</head> </head>
<body> <body>
......
src/common/js/axios.ts
/* /*
* @Author: 吴文洁 * @Author: 吴文洁
* @Date: 2020-08-31 09:34:31 * @Date: 2020-08-31 09:34:31
* @LastEditors: 吴文洁 * @LastEditors: zhangleyuan
* @LastEditTime: 2020-08-31 09:35:36 * @LastEditTime: 2021-01-05 15:43:31
* @Description: * @Description:
* @Copyright: 杭州杰竞科技有限公司 版权所有 * @Copyright: 杭州杰竞科技有限公司 版权所有
*/ */
...@@ -32,27 +32,12 @@ class Axios { ...@@ -32,27 +32,12 @@ class Axios {
params: any, params: any,
options: FetchOptions = { requestType: 'json' } options: FetchOptions = { requestType: 'json' }
): Promise<any> { ): Promise<any> {
const _url = `${url}?p=w&v=v${VERSION}&userType=${USER_TYPE}&token=${User.getToken()}&uid=${User.getUid()}&tid=${User.getTid()}&aid=${User.getAid()}`; const _url = `${url}`;
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
const { NewVersion, currentUserInstInfo } = window;
const { instId } = currentUserInstInfo;
const instance: AxiosInstance = axios.create({ const instance: AxiosInstance = axios.create({
timeout: TIME_OUT, timeout: TIME_OUT,
responseType: 'json', responseType: 'json',
headers: { headers: {
instId,
p: 'w',
v: 'VERSION',
vn: `v${VERSION}`,
project: PROJECT,
userType: USER_TYPE,
cid: User.getCid(),
uid: User.getUid(),
tid: User.getTid(),
token: User.getToken(),
bizAccountId: User.getAid(),
xmVersion: NewVersion ? '5.0' : '4.0',
'Content-Type': options.requestType === 'json' ? 'application/json; charset=UTF-8' : 'application/x-www-form-urlencoded', 'Content-Type': options.requestType === 'json' ? 'application/json; charset=UTF-8' : 'application/x-www-form-urlencoded',
} }
}); });
......
src/common/js/config.ts
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
* @Author: zhangleyuan * @Author: zhangleyuan
* @Date: 2021-01-05 10:55:02 * @Date: 2021-01-05 10:55:02
* @LastEditors: zhangleyuan * @LastEditors: zhangleyuan
* @LastEditTime: 2021-01-05 11:02:06 * @LastEditTime: 2021-01-18 21:18:52
* @Description: 描述一下 * @Description: 描述一下
* @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有 * @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
*/ */
...@@ -17,11 +17,11 @@ ...@@ -17,11 +17,11 @@
const APP_ID_MAP = { const APP_ID_MAP = {
dev: 'wx3ea60e78ddfa277e', dev: 'wx3ea60e78ddfa277e',
rc:'wx5c5a1fb71ecab7bc', rc:'wx5c5a1fb71ecab7bc',
gray:'wxe9f022ccb4d24a51', gray:'wx3dda02036493ada6',
prod:'wx5098ed9a6e115469' prod:'wx3dda02036493ada6'
} }
// 调试环境，默认dev // 调试环境，默认dev
const ENV = 'dev'; const ENV = 'prod';
export const AppId = APP_ID_MAP[ENV]; export const AppId = APP_ID_MAP[ENV];
src/common/js/function.js 0 → 100644
/*
* @Author: zhangleyuan
* @Date: 2021-01-05 17:30:54
* @LastEditors: zhangleyuan
* @LastEditTime: 2021-01-05 17:34:34
* @Description: 描述一下
* @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
*/
window.getParameterByName = function (name) {
name = name.replace(/[\\[]/, '\\[').replace(/[\]]/, '\\]');
const regex = new RegExp('[\\?&]' + name + '=([^&#]*)');
const results = regex.exec(window.location.href);
return results === null ? '' : decodeURIComponent(results[1].replace(/\+/g, ' '));
};
\ No newline at end of file
src/common/js/service.ts
/* /*
* @Author: 吴文洁 * @Author: 吴文洁
* @Date: 2020-08-31 09:34:51 * @Date: 2020-08-31 09:34:51
* @LastEditors: 吴文洁 * @LastEditors: zhangleyuan
* @LastEditTime: 2020-08-31 09:35:25 * @LastEditTime: 2021-01-05 15:33:19
* @Description: * @Description:
* @Copyright: 杭州杰竞科技有限公司 版权所有 * @Copyright: 杭州杰竞科技有限公司 版权所有
*/ */
...@@ -22,10 +22,13 @@ class Service { ...@@ -22,10 +22,13 @@ class Service {
static Sales(url: string, params: any, option: any) { static Sales(url: string, params: any, option: any) {
return Axios.post('POST', `sales/${url}`, params, option); return Axios.post('POST', `sales/${url}`, params, option);
} }
static hades(url: string, params: any, option: any) {
return Axios.post('POST', `hades/${url}`, params, option);
}
static post(url: string, params: any, option: any) { static post(url: string, params: any, option: any) {
return Axios.post('POST', url, params, option); return Axios.post('POST', url, params, option);
} }
} }
export default Service; export default Service;
\ No newline at end of file
src/domains/basic-domain/upload.ts
/* /*
* @Author: 吴文洁 * @Author: 吴文洁
* @Date: 2020-10-27 18:53:43 * @Date: 2020-10-27 18:53:43
* @LastEditors: 吴文洁 * @LastEditors: zhangleyuan
* @LastEditTime: 2020-12-21 17:42:22 * @LastEditTime: 2021-01-14 10:45:21
* @Description: * @Description:
* @Copyright: 杭州杰竞科技有限公司 版权所有 * @Copyright: 杭州杰竞科技有限公司 版权所有
*/ */
...@@ -11,17 +11,17 @@ import Service from '@/common/js/service'; ...@@ -11,17 +11,17 @@ import Service from '@/common/js/service';
class Upload { class Upload {
static uploadBlobToOSS(Blob: any, name: string, dataType: string = 'url') { static uploadBlobToOSS(Blob: any, name: string, dataType: string = 'url') {
const { instId } = window.currentUserInstInfo; // const { instId } = window.currentUserInstInfo;
return Service.MFS('anon/mfs/webTokenWithAccessUrl', { // return Service.MFS('anon/mfs/webTokenWithAccessUrl', {
instId, // instId,
resourceName: name, // resourceName: name,
}).then((res) => { // }).then((res) => {
const signInfo = res.result; // const signInfo = res.result;
const { url } = res.result // const { url } = res.result
return this.uploadBlobToNewOSS(Blob, name, signInfo.signatureVO || signInfo).then(() => { // return this.uploadBlobToNewOSS(Blob, name, signInfo.signatureVO || signInfo).then(() => {
return dataType === 'url' ? url : signInfo // return dataType === 'url' ? url : signInfo
}); // });
}) // })
}; };
static uploadBlobToNewOSS(Blob: any, name: string, signInfo: any) { static uploadBlobToNewOSS(Blob: any, name: string, signInfo: any) {
......
src/index.tsx
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
* @Author: 吴文洁 * @Author: 吴文洁
* @Date: 2020-04-27 20:35:34 * @Date: 2020-04-27 20:35:34
* @LastEditors: zhangleyuan * @LastEditors: zhangleyuan
* @LastEditTime: 2021-01-04 18:23:21 * @LastEditTime: 2021-01-14 10:48:59
* @Description: * @Description:
*/ */
...@@ -20,6 +20,7 @@ import { VerifyInfo } from '@/domains/basic-domain/interface'; ...@@ -20,6 +20,7 @@ import { VerifyInfo } from '@/domains/basic-domain/interface';
import 'antd/dist/antd.less'; import 'antd/dist/antd.less';
import '@/common/less/index.less'; import '@/common/less/index.less';
import '@/common/js/function';
import App from './App'; import App from './App';
...@@ -44,7 +45,7 @@ window.RCHistory = _.extend({}, history, { ...@@ -44,7 +45,7 @@ window.RCHistory = _.extend({}, history, {
} }
}); });
export async function mount(props: any) { export async function mount() {
ReactDOM.render(( ReactDOM.render((
<HashRouter {...history} > <HashRouter {...history} >
<ConfigProvider locale={zh_CN}> <ConfigProvider locale={zh_CN}>
......
src/modules/authorize/index.jsx
import React from 'react'; import React from 'react';
import Service from '@/common/js/service'; import Service from '@/common/js/service';
import { AppId } from '@/common/js/config' import { AppId } from '@/common/js/config'
import queryString from 'query-string';
import './index.less'; import './index.less';
class Authorize extends React.Component { class Authorize extends React.Component {
constructor(props) { constructor(props) {
super(props); super(props);
this.state = { this.state = {
code:'',
ticket:'',
hasBindWechat:false,
headImgUrl:''
} }
} }
componentDidMount() { componentDidMount() {
const code = window.getParameterByName('code');
const ticket = window.getParameterByName('ticket');
this.setState({
code,
ticket
})
if(!code){
this.setState({
ticketState:"SCAN_SUCCESS"
},()=>this.changeCodeState())
}else{
this.getWechatUserInfo();
}
}
changeCodeState = ()=>{
let {ticket,ticketState} = this.state;
const params = {
ticket,
ticketState
}
Service.hades('/anon/hades/changeTicketState',params).then(
)
} }
wechatLogin = () => { wechatAuthorize = () => {
let path = window.location.origin + window.location.pathname; let path = window.location.href;
let htmlUrl = 'https://open.weixin.qq.com/connect/oauth2/authorize?appid=' + AppId + let htmlUrl = 'https://open.weixin.qq.com/connect/oauth2/authorize?appid=' + AppId +
'&redirect_uri=' + encodeURIComponent(path) + '&redirect_uri=' + encodeURIComponent(path) +
'&response_type=code&scope=snsapi_userinfo&state=state#wechat_redirect'; '&response_type=code&scope=snsapi_userinfo&state=state#wechat_redirect';
window.location.href = htmlUrl; window.location.href = htmlUrl;
} }
getWechatUserInfo = ()=>{
const code = window.getParameterByName('code');
const ticket = window.getParameterByName('ticket');
const storeId = window.getParameterByName('storeId');
const params = {
appTermEnum: "XIAOMAI_CLOUD_CLASS_PC_WEB_CUSTOMER",
code,
storeId,
ticket
}
Service.hades('/anon/hades/bindWeChat',params).then((res)=>{
if(res.success){
this.setState({
hasBindWechat:true,
headImgUrl:res.result.headImgUrl,
ticketState:"AUTH_SUCCESS"
},()=>{this.changeCodeState()})
}
})
}
render() { render() {
const { hasBindWechat , headImgUrl} = this.state
return ( return (
<div className="authorize-page"> <div className="authorize-page">
<div> <div>
<img src="https://image.xiaomaiketang.com/xm/HsCjyKTbWw.png" className="avatar-img"></img> { !hasBindWechat &&
</div> <div>
<div> <div>
<button className="login-btn" onClick={this.wechatLogin}>微信登录</button> <img src="https://image.xiaomaiketang.com/xm/HsCjyKTbWw.png" className="avatar-img"></img>
</div>
<button className="login-btn" onClick={this.wechatAuthorize}>微信登录</button>
</div>
}
{ hasBindWechat &&
<div>
<div>
<img src={headImgUrl} className="avatar-img"></img>
</div>
<div className="login-success-text">微信登录成功</div>
<div className="login-success-instro">已完成微信登录操作，去网页端继续学习吧</div>
</div>
}
</div> </div>
</div> </div>
) )
} }
} }
......
src/modules/authorize/index.less
...@@ -19,4 +19,14 @@ ...@@ -19,4 +19,14 @@
margin-top:10.6vw; margin-top:10.6vw;
font-size:4vw; font-size:4vw;
} }
.login-success-text{
margin-top:10.6vw;
font-size:4vw;
color:#333333;
}
.login-success-instro{
font-size:13px;
color:#999;
margin-top:5px;
}
} }
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment