Introduction
In this tutorial you will learn how to implement some popular tools at various stages of the application build process through a single stage pipeline.
This article was written for the Festive Tech Calendar 2021.
Familiarity with Azure DevOps is assumed and don’t worry, I’ll keep this really high level π
Follow the tutorial here to create an Azure Web App with a CI/CD pipeline as a baseline to experiment with the various tooling that will be introduced in the post: Automate Node.js Deployments with Azure Pipelines
We can refer to the OWASP Vulnerable Web Applications Directory for intentionally insecure applications to test with. For this, I have used OWASP JuiceShop which is a vulnerable Node Application.
I have configured to run as an Azure Static WebApp and have a simple pipeline created that deploys the site.
# Starter JuiceShop pipeline
# Deploy OWASP JuiceShop to Azure Static Apps
trigger:
- main
pool:
vmImage: ubuntu-latest
steps:
- checkout: self
submodules: true
- task: NodeTool@0
inputs:
versionSpec: '16.x'
displayName: 'Install Node.js'
- task: AzureStaticWebApp@0
inputs:
app_location: '/frontend/dist/frontend'
output_location: ''
skip_app_build: true
azure_static_web_apps_api_token: $(deployment_token)
Secrets Scanning
Often in projects we want to be aware of any secrets in our codebase, and catch any sensitive information being submitted as a PR. Utilising tools like gitleaks, we can achieve this.
You can run gitleaks locally on your own using this command in the current directory to output as a csv file.
gitleaks -p . -v --report=gitleaksReport.csv --format=csv
This will allow you to find any secrets – you will need to rotate any that you find!
You can then install gitleaks into the pipeline – you should install it from the marketplace first into your devops organisation.

The code snippet:
- task: Gitleaks@2
inputs:
scanlocation: '$(Build.SourcesDirectory)'
configtype: 'default'
reportformat: 'sarif'
There is another method of adding in gitleak itno your github Actions workflow, which will monitor PRs for any secrets that you are scanning. You’ll want to set the switch of --depth=0
to avoid scanning the entire codebase history each time a PR is made.
Software Composition Analysis (SCA)
Tools & software are built standing on the shoulders of giants. Our JuiceShop application is no different. It is built on Node.js and imports some third party packages to add features to the app. The trouble is, how do we keep track of these third party modules to check for vulnerabilities and to keep them up to date?
We can use applications like OWASP Dependency Check in the pipeline to scan our app and it’s libraries for any vulnerable components. By incorporating it in our pipeline, we can use it to create reports.

You can incorporate Dependency Check into your pipeline with the following snippet
- task: dependency-check-build-task@6
displayName: 'Dependency Check'
inputs:
projectName: 'JuiceShop'
scanPath: $(System.DefaultWorkingDirectory)
format: HTML
reportsDirectory: '$(System.DefaultWorkingDirectory)/Reports'
reportFilename: 'dependencyCheckReport.html'
Another really neat tool for this is Dependabot, which can plug into the GitHub project as a security plugin, which will report on any dependencies with security issues and advise on how to fix them. If you are so inclined, you can get Dependabot to create a PR to update the outdated dependency.

Static App Security Test (SAST)
SAST tools can analyse the code used in the app to quickly identify any vulnerabilities, such as SQL Injection, XSS, directory traversal & more. You can incorporate the tool locally, have it run on PRs and in the pipeline.
For this, we will use AppThreat SAST Scan to perform SAST in our pipeline.
- task: Bash@3
displayName: 'Run AppThreat SAST-Scan'
inputs:
targetType: 'inline'
failOnStderr: false
script: |
docker run --rm -e "WORKSPACE=${PWD}" \
-v "$PWD:/app:cached" quay.io/appthreat/sast-scan scan \
--src / \
--type nodejs --out_dir ${pwd}/Reports
Dynamic App Security Test (DAST)
Now that we have our web-app built – we should run some tests on it using OWASP ZAP to pick up on any vulnerabilities that couldn’t be picked up in the previous stages. You can add OWASP ZAP extension in from the Visual Studio marketplace, much like you did with Gitleaks earlier in the article.

- task: owaspzap@1
inputs:
scantype: 'targetedScan'
url: 'https://calm-river-08e990c03.azurestaticapps.net/'
port: '443'
Conclusion
DevOps technologies have simplified the application build process, and in turn have done the same for security integration. With an awareness of the tools and where they fit into the SDLC, you should be well equipped to start thinking about integrating security into your projects and pipelines during the inception of the project, even before a line of code is touched. This kind of thinking is known as Shift-Left.
By introducing such tooling can be a valuable education to the developers of the project and encourage good security practices throughout.
Hoping you have a Happy (& Secure) Christmas 2021 π