How serverless debugging (c)

In the last article, we explain how to call our hello-world applications, only need to use the command:

serverless invoke -f hello -l

But we always can not be modified once the code, call it the command of it, or that we need to debug our code, we can not always be deployed to the AWS server-side bar, then this is very inefficient. So we need to tune in the local style is completed, we finally deployed on our AWS server.

1. Terminal modal

We only need to invoke after adding local on it, such as a command: serverless invoke local -f hello -l as follows:

However, as raised type, it is not the best solution, so we need to use the tool to debug just fine. To solve this problem, in serverless also has a similar tool.

2. Use the debugging tool

2.1 Installation serverless-offline command as follows:

npm install serverless-offline -D

2.2 modify serverless.yml

We need to open our serverless.yml under the root directory, add the following configuration information:

events:
      - http:
          path: hello/{name}
          method: get
plugins:
  - serverless-offline

Thus all serverless.yml configuration code is as follows:

service: hello-world 
provider:
  name: aws
  runtime: nodejs10.x

functions:
  hello:
    handler: handler.hello
    events:
      - http:
          path: hello/{name}
          method: get
plugins:
  - serverless-offline

2.3 modify handler.js

Now we add the following code handler.js in:

const {pathParameters = {}} = event;
const {name = 'xxx111'} = pathParameters;
const message = `您好，${ name }.`;

Handler.js complete code is shown below:

'use strict';

module.exports.hello = async (event, context, callback) => {
  
  console.log(event);
  console.log(context);

  const {pathParameters = {}} = event;
  const {name = 'xxx111'} = pathParameters;
  const message = `您好，${ name }.`;
  const html = `
    <html>
     <style>
      h2 {color:red;}
     </style>
     <body>
       <h1>第一个hello world 应用</h1>
       <h2>${message}</h2>
     </body>
    </html>`;
  return {
    statusCode: 200,
    headers: {
      'Content-Type': 'text/html'
    },
    body: html
  }
};

Print code above, we print console.log (event); after, we print the information as follows:

{ headers:
   { Host: 'localhost:3000',
     Connection: 'keep-alive',
     Pragma: 'no-cache',
     'Cache-Control': 'no-cache',
     'Upgrade-Insecure-Requests': '1',
     'User-Agent':
      'Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/75.0.3770.100 Safari/537.36',
     Accept:
      'text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,image/apng,*/*;q=0.8,application/signed-exchange;v=b3',
     'Accept-Encoding': 'gzip, deflate, br',
     'Accept-Language': 'zh-CN,zh;q=0.9,en;q=0.8' },
  multiValueHeaders:
   { Host: [ 'localhost:3000' ],
     Connection: [ 'keep-alive' ],
     Pragma: [ 'no-cache' ],
     'Cache-Control': [ 'no-cache' ],
     'Upgrade-Insecure-Requests': [ '1' ],
     'User-Agent':
      [ 'Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/75.0.3770.100 Safari/537.36' ],
     Accept:
      [ 'text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,image/apng,*/*;q=0.8,application/signed-exchange;v=b3' ],
     'Accept-Encoding': [ 'gzip, deflate, br' ],
     'Accept-Language': [ 'zh-CN,zh;q=0.9,en;q=0.8' ] },
  path: '/hello/2',
  pathParameters: { name: '2' },
  requestContext:
   { accountId: 'offlineContext_accountId',
     resourceId: 'offlineContext_resourceId',
     apiId: 'offlineContext_apiId',
     stage: 'dev',
     requestId: 'offlineContext_requestId_03349087551215857',
     identity:
      { cognitoIdentityPoolId: 'offlineContext_cognitoIdentityPoolId',
        accountId: 'offlineContext_accountId',
        cognitoIdentityId: 'offlineContext_cognitoIdentityId',
        caller: 'offlineContext_caller',
        apiKey: 'offlineContext_apiKey',
        sourceIp: '127.0.0.1',
        cognitoAuthenticationType: 'offlineContext_cognitoAuthenticationType',
        cognitoAuthenticationProvider: 'offlineContext_cognitoAuthenticationProvider',
        userArn: 'offlineContext_userArn',
        userAgent:
         'Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/75.0.3770.100 Safari/537.36',
        user: 'offlineContext_user' },
     authorizer:
      { principalId: 'offlineContext_authorizer_principalId',
        claims: undefined },
     protocol: 'HTTP/1.1',
     resourcePath: '/hello/{name}',
     httpMethod: 'GET',
     requestTimeEpoch: 1561535723603 },
  resource: '/hello/{name}',
  httpMethod: 'GET',
  queryStringParameters: null,
  multiValueQueryStringParameters: null,
  stageVariables: null,
  body: null,
  isOffline: true }

Then we print our console.log (context); after the information is printed as follows:

{ done: [Function],
  fail: [Function: fail],
  succeed: [Function: succeed],
  getRemainingTimeInMillis: [Function: getRemainingTimeInMillis],
  awsRequestId: 'offline_awsRequestId_7749009079208731',
  clientContext: {},
  functionName: 'hello-world-dev-hello',
  functionVersion: 'offline_functionVersion_for_hello-world-dev-hello',
  identity: {},
  invokedFunctionArn: 'offline_invokedFunctionArn_for_hello-world-dev-hello',
  logGroupName: 'offline_logGroupName_for_hello-world-dev-hello',
  logStreamName: 'offline_logStreamName_for_hello-world-dev-hello',
  memoryLimitInMB: undefined }

2.4 Starting Services

After the above configuration code is complete, we can command: sls offline to run, and if a successful start, we will bind port 3000, as shown below:

This time, we in the browser http: // localhost: 3000 / hello / 2 time of the visit, we can see the following information; as follows:

When we change the above address under it, such as http: // localhost: 3000 / hello / kongzhi, so as to become a page, as shown below:

Automatic loading code to save changes 2.5

We always try every possible means to enhance the work efficiency of development, such as webpack and nodemon has reload functionality, of course, serverless-offline too. Run the following command:

sls offline --useSeparateProcesses

As follows:

Now when I modified under handler.js code, and then the command line will be automatically packaged, but without any command line prompt, but when we refresh the page and found that the content is up to date as follows:

github source View

How serverless debugging (c)

Guess you like