please help with passing authorization token to http header from Vue.js

[ai2soft]

with the default demo project of VS2019 C# gRpc Service. i create a VS Code Vue project and want to call the method sayHello with a valid token which is generated by JWT . but i don't know how to pass it , and which library should be referenced to.

<template>
  <div id="app">
    <img src="./assets/logo.png">
    <i class="el-icon-edit"></i>
    <i class="el-icon-share"></i>
    <i class="el-icon-delete"></i>
    <el-button type="primary" icon="el-icon-search">搜索</el-button>
    <p>
      <el-button type="primary" @click="get1"> 简单rpc [可测试] </el-button>
      <el-button type="primary" @click="get2"> 服务端流rpc [无效] </el-button>
    </p>
    <p>
      <el-button type="primary" @click="loginSys"> login </el-button>
      <el-button type="primary" @click="getToken"> Request token </el-button>
    </p>
    <router-view/>
  </div>
</template>

<script>
// import { HelloRequest, RepeatHelloRequest, HelloReply } from './proto/greet_pb'
import { HelloRequest } from './proto/greet_pb'
import { GreeterClient } from './proto/greet_grpc_web_pb'
import { AppClient } from './proto/app_grpc_web_pb'
import grpc from '@grpc/grpc-js'
// import { Metadata, MetadataValue } from './metadata'
import { CallCredentials } from '@grpc/grpc-js/build/src/call-credentials'
// import { Metadata } from '@grpc/grpc-js/build/src/metadata'

export default {
  name: 'App',
  created () {
    this.client = new GreeterClient('https://localhost:5001', CallCredentials.createFromPlugin, null)
    this.appClient = new AppClient('https://localhost:5001', null, null)
  },
  methods: {
    get1 () {
      var token = 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJodHRwOi8vc2NoZW1hcy54bWxzb2FwLm9yZy93cy8yMDA1LzA1L2lkZW50aXR5L2NsYWltcy9uYW1lIjoiY2xpZW50SWQiLCJodHRwOi8vc2NoZW1hcy54bWxzb2FwLm9yZy93cy8yMDA1LzA1L2lkZW50aXR5L2NsYWltcy9uYW1laWRlbnRpZmllciI6ImNsaWVudElkIiwibmJmIjoxNjI5MDM0MzkxLCJleHAiOjE2MjkwMzQ0NTEsImlzcyI6IkFpMi5XZWIiLCJhdWQiOiJBaTIuV2ViIn0.1QpFsvzRvlBvTPNQ4hzETIDaLfmUsxmVvXaRyXVskjI'
      var metadata = new grpc.Metadata()
      metadata.add('Authorization', 'Bearer ' + token)
      // debugger
      var request = new HelloRequest()
      request.setName('World')
      this.client.sayHello(request, metadata, (err, response) => {
        if (err) {
          console.log(`Unexpected error for sayHello: code = ${err.code}, message = "${err.message}"`)
        } else {
          console.log(response.getMessage())
        }
      })
    }
  }
}
</script>

<style>
#app {
  font-family: 'Avenir', Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-align: center;
  color: #2c3e50;
  margin-top: 60px;
}
</style>

[stanley-cheung]

In general you pass any authentication token as part of the metadata parameter with your RPC method, which is usually the 2nd parameter.

[ai2soft]

In general you pass any authentication token as part of the metadata parameter with your RPC method, which is usually the 2nd parameter.

thanks for the answer, and can you pass some demo code ?