LinkedIn符号

Vue 3

它的客户端软件包用于渲染在按钮中的任何vue应用程序中的链接。

要了解有关OAuth2中链接的更多信息（https://developer.linkedin.com/）

安装

npm install linkinedin-auth

现场演示

检查组件中的live demo。

道具

prop	默认	描述
客户端	*必需	client您注册Linkinedin开发人员帐户并创建应用程序时提供的客户端。
CSS		覆盖默认按钮类
redirecturi	默认值是Origin App URL `window.location.origin`	有效的重定向URI关注LinkedIn开发人员文档
范围	`r_emailaddress r_liteprofile`	要了解更多关注LinkedIn开发人员文档
状态	默认值为当前日期时间戳	您选择的独特字符串值很难猜测。用于防止CSRF。例如，状态= DCEEFWF45A53SDFKEF424。

怎么运行的？

导入软件包并将按钮添加到您的组件
确保所有道具都是有效的。
有人单击该按钮，它将重定向到LinkedIn帐户为您获取代码，然后重定向到重定向URI。然后是查询字符串。
获取代码并将其传递给您的后端以验证并获取用户信息。

用法

<template>
    <LinkedInSignin
        :client-id="linkediInClientId"
        css="flex justify-center py-2 px-2 border border-slate-300 rounded shadow-sm bg-white text-sm font-medium text-slate-500 hover:!bg-slate-50 cursor-pointer"
    />
</template>

<script setup>
    import { LinkedInSignin } from "linkedin-auth";
    const linkediInClientId = process.env.LINKINED_AUTH_CLIENT_ID;
</script>

用法 - 更新默认插槽

<template>
    <LinkedInSignin
        :client-id="linkediInClientId"
        css="flex justify-center py-2 px-2 border border-slate-300 rounded shadow-sm bg-white text-sm font-medium text-slate-500 hover:!bg-slate-50 cursor-pointer"
    >
        Login with LinkedIn
    </LinkedInSignin>
</template>

<script setup>
    import { LinkedInSignin } from "linkedin-auth";
    const linkediInClientId = process.env.LINKINED_AUTH_CLIENT_ID;
</script>

支持我

你可以给我买咖啡
https://www.buymeacoffee.com/mayankjhawar

在Patreon支持我
https://patreon.com/mayank120

执照

什么