qq登录

  const handleOpenQQLogin = useCallback(() => {
    if (!accept) {
      MessagePlugin.error('请先阅读并同意用户协议');
      return;
    }
    setLoginType(LOGIN_TYPE.QQ);
    const { host } = window.location;
    window.open(`https://graph.qq.com/oauth2.0/authorize?client_id=102800978&response_type=code&scope=all&redirect_uri=${encodeURIComponent(`https://${host}/qqcallback)}`, '_blank');
  }, [accept, isPic]);
  
  设置回调地址： `https://${host}/qqcallback)}` 这个地址需要在qq申请登录的地方配置一下
    

路由设置接受https://${host}/qqcallback)}

这个文件接受回调路由返回的参数和登录处理
import CryptoJs from 'crypto-js';
import dayjs from 'dayjs';
import { isEmpty } from 'lodash';
import { useEffect } from 'react';
import { useSearchParams } from 'react-router-dom';
import { MessagePlugin } from 'tdesign-react';

import { customReport, CustomReportType } from '@/report/tam';
import { fetchLogin } from '@/services/auth';
import { CgiErrorCode } from '@/services/cgi';
import { loginServer } from '@/services/login';
import { LOGIN_STATUS, LOGIN_TYPE, setLoginStatus } from '@/store/modules/user';

import { clearLoginCookies, getLoginCookies, setLoginCookie, setLoginGuidCookies } from '../login';

const LoginQQ = () => {
  // const navigator = useNavigate();
  const [searchParams] = useSearchParams();
  const code = searchParams.get('code') || '';
  // const isFromPic = searchParams.get('isPic') || '';

  useEffect(() => {
    if (code) {
      handleLogin(code);
    }
  }, [code]);

  const handleLogin = async (code: string) => {
    try {
      if (code) {
        const random = `${dayjs().valueOf()}_${code}`;
        const guid = CryptoJs.MD5(random).toString();
        setLoginGuidCookies(guid);

        const res = await loginServer(code, guid, LOGIN_TYPE.QQ);
        if (!isEmpty(res?.data)) {
          setLoginCookie(res?.data, LOGIN_TYPE.QQ);
          const loginCookies = getLoginCookies();
          const { code } = await fetchLogin({
            appType: 5,
            baseInfo: {
              id: `${loginCookies?.vuser}`,
            },
            userInfo: {
              head: loginCookies?.avatar || '',
              nick: loginCookies?.name || '',
            },
          });
          if (code === CgiErrorCode.NO_ERROR) {
            window.close();
          } else {
            customReport(CustomReportType.CLEAR_COOKIE_FROM, {
              from: 'clear-6',
              code,
            });
            clearLoginCookies();
            MessagePlugin.error(res?.msg || '登录失败，请重试');
          }
     
        } else {
          setLoginStatus(LOGIN_STATUS.FAIL);
          window.close();
        }
      }
    } catch (error) {
      setLoginStatus(LOGIN_STATUS.FAIL);
      window.close();
    }
  };
  return null;
};

export default LoginQQ;