尝试微信登录

vueapp.client/package-lock.json

@@ -10,7 +10,8 @@
       "dependencies": {
         "sass": "^1.77.8",
         "vue": "^3.4.29",
-        "vue-router": "^4.4.0"
+        "vue-router": "^4.4.0",
+        "weixin-js-sdk": "^1.6.5"
       },
       "devDependencies": {
         "@rushstack/eslint-patch": "^1.8.0",
@@ -3028,6 +3029,11 @@
         "typescript": ">=5.0.0"
       }
     },
+    "node_modules/weixin-js-sdk": {
+      "version": "1.6.5",
+      "resolved": "https://registry.npmmirror.com/weixin-js-sdk/-/weixin-js-sdk-1.6.5.tgz",
+      "integrity": "sha512-Gph1WAWB2YN/lMOFB/ymb+hbU/wYazzJgu6PMMktCy9cSCeW5wA6Zwt0dpahJbJ+RJEwtTv2x9iIu0U4enuVSQ=="
+    },
     "node_modules/which": {
       "version": "2.0.2",
       "resolved": "https://registry.npmmirror.com/which/-/which-2.0.2.tgz",

vueapp.client/package.json

@@ -14,7 +14,8 @@
   "dependencies": {
     "sass": "^1.77.8",
     "vue": "^3.4.29",
-    "vue-router": "^4.4.0"
+    "vue-router": "^4.4.0",
+    "weixin-js-sdk": "^1.6.5"
   },
   "devDependencies": {
     "@rushstack/eslint-patch": "^1.8.0",

vueapp.client/src/pages/Welcome.vue

@@ -1,5 +1,19 @@
 <script setup lang="ts">
+import {onMounted} from "vue";
+import wx from "weixin-js-sdk";
 
+const appId="wx1bbe5c15d28b500c"
+const redirect_uri="https://localhost:5173/welcome"
+const scope="snsapi_userinfo"
+const state="123"
+onMounted(()=>{
+
+})
+const login=()=>{
+  //引导至 https://open.weixin.qq.com/connect/oauth2/authorize?appid=APPID&redirect_uri=REDIRECT_URI&response_type=code&scope=SCOPE&state=STATE#wechat_redirect
+  window.open(`https://open.weixin.qq.com/connect/oauth2/authorize?appid=${appId}&redirect_uri=${redirect_uri}&response_type=code&scope=${scope}&state=STATE#wechat_redirect`)
+
+}
 </script>
 
 <template>
@@ -11,7 +25,7 @@
           With management based on priority and daily tasks, it will give you convenience in managing and determining the tasks that must be done first
         </h3>
       </div>
-      <button>Get Started</button>
+      <button @click="login">Get Started</button>
     </div>
 </template>