Custom websocket endpint

Serverless Framework
,
1

I’m trying to custom my websocket endpoint because I need to initialize it for cloudfront which is deployed before websocket.
The initialize code is below:

    ApiGatewayWebsocketApi: 
      Type: AWS::ApiGatewayV2::Api
      Properties:
        Name: ${self:provider.stage}-${self:provider.variant}-WebsocketApi
        ProtocolType: WEBSOCKET
        RouteSelectionExpression: "$request.body.action"
        Description: "WebSocket API for ${self:provider.variant}"

And I exported it as an output:

    ApiGatewayWebsocketApiId:
          Value: 
            Ref: ApiGatewayWebsocketApi
          Export:
            Name: ${self:custom.configFile.appCode}-${self:provider.stage}-${self:provider.variant}-ApiGatewayWebsocketApiId

Then I can get it in websocket serverless.yml:

  WebSocketApiId:
    Fn::ImportValue: ${self:custom.configFile.appCode}-${self:provider.stage}-${self:provider.variant}-ApiGatewayWebsocketApiId

But how can I import it to my function such as connectionHandler so that this websocket can use the endpoint imported above:

  connectionHandler:
    name: ${self:provider.stage}-${self:provider.variant}-${self:custom.configFile.appCode}-ws-connection
    handler: WebsocketTestHandler
    events:
      - websocket:
          route: $connect
      - websocket:
          route: $disconnect