项目用企微登录的几种方式

nys013 2026/2/3 企微

# 前言

以下几种方式，核心都是拿到code在应用页面实现登录

# 1.企微内打开登录

用户在企业微信APP内打开H5页面、企微桌面端打开页面，实现自动登录，则需构造oauth2链接

文档：https://developer.work.weixin.qq.com/document/path/91022 (opens new window)

具体过程：

构造oauth2网页授权链接，如在企微中配置相应的redirect_uri，则构造出 https://open.weixin.qq.com/connect/oauth2/authorize?appid=CORPID&redirect_uri=REDIRECT_URI&response_type=code&scope=snsapi_base&state=STATE&agentid=AGENTID#wechat_redirect 点击应用，企微自动授权后，页面将跳转至redirect_uri?code=CODE，其中redirect_uri为项目地址
跳转项目链接后，query参数中有code，前端拿到code调用后端登录接口，登录成功后跳转首页即可

# 2.外部浏览器打开登录

用户在外部浏览器打开页面，希望出现企微登录面板，实现快捷登录。适用于pc端，因为登录面板都是获取的桌面端，或者是出现二维码，所以更适用于pc浏览器场景

文档：https://developer.work.weixin.qq.com/document/path/98152 (opens new window)

# 2.1 createWWLoginPanel

使用企业微信 JS-SDK，调用createWWLoginPanel，在应用中创建面板，传入预留好面板出现位置的元素wecomRef.value，然后onLoginSuccess中拿到code调用登录接口即可

 createWWLoginPanel({
    el: wecomRef.value,
    params: {
      login_type: WWLoginType.corpApp,
      appid,
      agentid,
      redirect_uri: `https://${location.host}`,
      state: 'loginState',
      redirect_type: WWLoginRedirectType.callback,
      panel_size: WWLoginPanelSizeType.small,
    },
    async onLoginSuccess({ code }) {
      // 拿到code调用登录接口

    },

  })
})

# 2.2 构造企业微信登录链接

构造如https://login.work.weixin.qq.com/wwlogin/sso/login?login_type=LOGIN_TYPE&appid=APPID&redirect_uri=REDIRECT_URI&state=STATE链接

然后需要企微登录时打开构造的链接，该链接页面显示企微登录面板，用户授权登录后，同1一样，跳转redirect_uri?code=CODE，拿到code登录即可

同1的区别是：

1是企微应用内打开，构造的是oauth2链接，实现自动登录，pc和移动端都适合
2.2是随便哪个浏览器打开，构造的是企微登录链接，出现登录面板，需用户手动点击登录，更适合pc

nys013主页

Choose mode