vue3 pc Line登录

最新推荐文章于 2023-12-25 00:30:23 发布

江-月*夜

最新推荐文章于 2023-12-25 00:30:23 发布

阅读量123

点赞数

文章标签： vue

本文链接：https://blog.csdn.net/qq_36529240/article/details/134459431

版权

在这里插入图片描述
申请 Line 创建自己运用我就不做了，需要梯子，
1.代码

<template>
  <div>
  
        <div class="login-scan-bg login-scan-weixin dis-box" @click="lineClick">
          line 登录
        </div>
    </div>
   </template>

2、点击登录时验证用户并发出授权申请跳转到登录然后回调

const lineClick = () => {
  const line_auth = "https://access.line.me/oauth2/v2.1/authorize";
  const auth_params = {
    response_type: "code",
    client_id: "2000565797",
    redirect_uri: window.location.href, // 在LINE Developers Console上注册的回调 URL 的 URL 编码字符串。您可以添加任何查询参数。
    state: "STATE" + new Date().getTime(), // 用于防止跨站点请求伪造的唯一字母数字字符串. 您的网络应用应为每个登录会话生成一个随机值。这不能是 URL 编码的字符串。
    scope: "profile openid email", // 向用户请求的权限,查询范围可以看官网(https://developers.line.biz/en/docs/line-login/integrate-line-login/#scopes)
    switch_amr: true
  };
  // 这里使用了qs处理参数
  const paramsString = qs.stringify(auth_params);
  window.location.href = `${line_auth}?${paramsString}`;
  console.log(`${line_auth}?${paramsString}`);
};