Visual Studio Team Services – Creating a build pipeline (Part 6)

Published Feb 12 2019 02:25 PM 104 Views
Occasional Contributor
First published on MSDN on Nov 09, 2016

Authored by Jeffrey Chilberto


In part 1 a basic Azure Web App website was built and deployed using VSTS Build and Part 2 illustrated how additional files could be included when building a web project. Part 3 demonstrated how Gulp could be added to the VSTS Build pipeline.  In part 4 Load Testing was added to the build pipeline and part 5 added slots to help smooth the build process and limit downtime.  This post will look into using service hooks in VSTS, and as an example, will integrate with an existing Slack team in order to post messages when a build fails.

Service Hooks


VSTS provides service hooks for reporting events to external systems.  The events and supported actions vary depending on the external system.  For example, when integrating with Trello , a popular on-line collaboration tool, the following events and actions are supported:

Events



Actions


Build completedCreate a card Code pushedCreate a list Pull request created Pull request updated Team room message posted Work item commented on Work item created Work item updated

There are many services built in and additional services that can be targeted by service hooks are available in the Visual Studio Marketplace .  Service Hooks are well documented and each service shows the sequence of steps required to configure them:


References



Slack


As an illustration of service hooks, let's add a slack notification when a

The first step is to configure slack for integration with VSTS.   Within the slack team, select the Apps & integration option:



Search and find the Visual Studio Team Services application and Install:



In the option to Post to Channel, an existing channel or the ability to create a channel can be selected.



After the application is configured, slack provides control for removing or disabling the integration as well as setup instructions.



Note: in the setup instructions and in the Integration Settings is the Webhook URL which is needed in the VSTS setup:




Setting up a Service Hook in Visual Studio


Slack and VisualStudio.com both provide setup instructions so in order to make this post a bit more interesting, let's setup a service hook only for when a build ends.  In VSTS, select the Service Hooks menu from within the build project:



After selecting Slack, you can then specify the event and filters.  In this example, only Failed builds will generate a message:



The final step in the wizard requires the Slack webhook address and a convenient way to test the integration:


Summary


Service Hooks is a great feature for integrating the activity of VSTS into external applications.  There are many out of the box services available as well as the ability to subscribe to VSTS to receive notifications about build events .  Service Hooks and other features allow teams to handle events as they happen and not just when reported or stumbled upon.  For example, with the Slack application running, alerts in the Action Center are immediately brought to the attention of the devops as illustrated below:









%3CLINGO-SUB%20id%3D%22lingo-sub-336008%22%20slang%3D%22en-US%22%3EVisual%20Studio%20Team%20Services%20%E2%80%93%20Creating%20a%20build%20pipeline%20(Part%206)%3C%2FLINGO-SUB%3E%3CLINGO-BODY%20id%3D%22lingo-body-336008%22%20slang%3D%22en-US%22%3E%0A%20%26lt%3Bmeta%20http-equiv%3D%22Content-Type%22%20content%3D%22text%2Fhtml%3B%20charset%3DUTF-8%22%20%2F%26gt%3B%3CSTRONG%3E%20First%20published%20on%20MSDN%20on%20Nov%2009%2C%202016%20%3C%2FSTRONG%3E%20%3CBR%20%2F%3E%3CP%3E%3CI%3E%20Authored%20by%20Jeffrey%20Chilberto%20%3C%2FI%3E%3C%2FP%3E%3CBR%20%2F%3E%20In%20%3CA%20href%3D%22https%3A%2F%2Fblogs.msdn.microsoft.com%2Fazuredev%2F2016%2F07%2F31%2Fvisual-studio-team-services-creating-a-build-pipeline-part-1%2F%22%20target%3D%22_blank%22%20rel%3D%22noopener%20noreferrer%22%3E%20part%201%20%3C%2FA%3E%20a%20basic%20Azure%20Web%20App%20website%20was%20built%20and%20deployed%20using%20%3CA%20href%3D%22https%3A%2F%2Fwww.visualstudio.com%2Fen-us%2Ffeatures%2Fcontinuous-integration-vs.aspx%22%20target%3D%22_blank%22%20rel%3D%22noopener%20noreferrer%22%3E%20VSTS%20Build%20%3C%2FA%3E%20and%20%3CA%20href%3D%22https%3A%2F%2Fblogs.msdn.microsoft.com%2Fazuredev%2F2016%2F08%2F02%2Fvisual-studio-team-services-creating-a-build-pipeline-part-2%2F%22%20target%3D%22_blank%22%20rel%3D%22noopener%20noreferrer%22%3E%20Part%202%20%3C%2FA%3E%20illustrated%20how%26nbsp%3Badditional%20files%20could%20be%20included%20when%20building%20a%20web%20project.%20%3CA%20href%3D%22https%3A%2F%2Fblogs.msdn.microsoft.com%2Fazuredev%2F2016%2F08%2F06%2Fvisual-studio-team-services-creating-a-build-pipeline-part-3%2F%22%20target%3D%22_blank%22%20rel%3D%22noopener%20noreferrer%22%3EPart%203%20%3C%2FA%3E%20demonstrated%20how%20%3CA%20href%3D%22http%3A%2F%2Fgulpjs.com%2F%22%20target%3D%22_blank%22%20rel%3D%22nofollow%20noopener%20noreferrer%22%3E%20Gulp%20%3C%2FA%3E%20could%20be%20added%20to%20the%20%3CA%20href%3D%22https%3A%2F%2Fwww.visualstudio.com%2Fen-us%2Ffeatures%2Fcontinuous-integration-vs.aspx%22%20target%3D%22_blank%22%20rel%3D%22noopener%20noreferrer%22%3E%20VSTS%20Build%20%3C%2FA%3E%20pipeline.%20%26nbsp%3BIn%20%3CA%20href%3D%22https%3A%2F%2Fblogs.msdn.microsoft.com%2Fazuredev%2F2016%2F08%2F22%2Fvisual-studio-team-services-creating-a-build-pipeline-part-4%2F%22%20target%3D%22_blank%22%20rel%3D%22noopener%20noreferrer%22%3E%20part%204%20%3C%2FA%3E%20Load%20Testing%20was%20added%20to%20the%20build%20pipeline%20and%20%3CA%20href%3D%22https%3A%2F%2Fblogs.msdn.microsoft.com%2Fazuredev%2F2016%2F09%2F19%2Fvisual-studio-team-services-creating-a-build-pipeline-part-5%2F%22%20target%3D%22_blank%22%20rel%3D%22noopener%20noreferrer%22%3E%20part%205%20%3C%2FA%3E%20added%20slots%20to%20help%20%3CEM%3E%20smooth%20%3C%2FEM%3E%20the%20build%20process%20and%20limit%20downtime.%20%26nbsp%3BThis%20post%20will%20look%20into%20using%20service%20hooks%20in%20VSTS%2C%20and%20as%20an%20example%2C%20will%20integrate%20with%20an%20existing%20Slack%20team%20in%20order%20to%20post%20messages%20when%20a%20build%20fails.%20%3CBR%20%2F%3E%3CH2%20id%3D%22toc-hId-1820205856%22%20id%3D%22toc-hId--1380444259%22%3EService%20Hooks%3C%2FH2%3E%3CBR%20%2F%3E%20VSTS%20provides%20service%20hooks%20for%20reporting%20events%20to%20external%20systems.%20%26nbsp%3BThe%20events%20and%20supported%20actions%20vary%20depending%20on%20the%20external%20system.%20%26nbsp%3BFor%20example%2C%20when%20integrating%20with%20%3CA%20href%3D%22https%3A%2F%2Ftrello.com%2F%22%20target%3D%22_blank%22%20rel%3D%22nofollow%20noopener%20noreferrer%22%3E%20Trello%20%3C%2FA%3E%20%2C%20a%20popular%20on-line%20collaboration%20tool%2C%20the%20following%20events%20and%20actions%20are%20supported%3A%20%3CBR%20%2F%3E%3CTABLE%3E%0A%20%20%20%3CTBODY%3E%3CTR%3E%3CBR%20%2F%3E%3CH3%20id%3D%22toc-hId--928464610%22%20id%3D%22toc-hId--689882785%22%3EEvents%3C%2FH3%3E%3CBR%20%2F%3E%20%3CBR%20%2F%3E%3CH3%20id%3D%22toc-hId-814345725%22%20id%3D%22toc-hId-1797630048%22%3EActions%3C%2FH3%3E%3CBR%20%2F%3E%3C%2FTR%3E%0A%20%20%20%3CTR%3EBuild%20completedCreate%20a%20card%3C%2FTR%3E%0A%20%20%20%3CTR%3ECode%20pushedCreate%20a%20list%3C%2FTR%3E%0A%20%20%20%3CTR%3EPull%20request%20created%3C%2FTR%3E%0A%20%20%20%3CTR%3EPull%20request%20updated%3C%2FTR%3E%0A%20%20%20%3CTR%3ETeam%20room%20message%20posted%3C%2FTR%3E%0A%20%20%20%3CTR%3EWork%20item%20commented%20on%3C%2FTR%3E%0A%20%20%20%3CTR%3EWork%20item%20created%3C%2FTR%3E%0A%20%20%20%3CTR%3EWork%20item%20updated%3C%2FTR%3E%0A%20%20%3C%2FTBODY%3E%3C%2FTABLE%3E%3CBR%20%2F%3E%20There%20are%20many%20%3CA%20href%3D%22https%3A%2F%2Fwww.visualstudio.com%2Fen-us%2Fdocs%2Fintegrate%2Fget-started%2Fservice-hooks%2Fget-started%23available-services%22%20target%3D%22_blank%22%20rel%3D%22noopener%20noreferrer%22%3E%20services%20%3C%2FA%3E%20built%20in%20and%20additional%20services%20that%20can%20be%20targeted%20by%20service%20hooks%20are%20available%20in%20the%20%3CA%20href%3D%22https%3A%2F%2Fmarketplace.visualstudio.com%2F%23VSTS%22%20target%3D%22_blank%22%20rel%3D%22noopener%20noreferrer%22%3E%20Visual%20Studio%20Marketplace%20%3C%2FA%3E%20.%20%26nbsp%3BService%20Hooks%20are%20well%20documented%20and%20each%20service%20shows%20the%20sequence%20of%20steps%20required%20to%20configure%20them%3A%20%3CBR%20%2F%3E%20%3CBR%20%2F%3E%20%3CIMG%20src%3D%22https%3A%2F%2Ftechcommunity.microsoft.com%2Ft5%2Fimage%2Fserverpage%2Fimage-id%2F73295i69211A319033801E%22%20%2F%3E%20%3CBR%20%2F%3E%3CH3%20id%3D%22toc-hId--1737811236%22%20id%3D%22toc-hId--9824415%22%3EReferences%3C%2FH3%3E%3CBR%20%2F%3E%3CUL%3E%3CBR%20%2F%3E%3CLI%3E%3CA%20href%3D%22https%3A%2F%2Fwww.visualstudio.com%2Fen-us%2Fdocs%2Fintegrate%2Fget-started%2Fservice-hooks%2Fget-started%22%20target%3D%22_blank%22%20rel%3D%22noopener%20noreferrer%22%3E%20Integrate%20with%20service%20hooks%20%3C%2FA%3E%3C%2FLI%3E%3CBR%20%2F%3E%3C%2FUL%3E%3CBR%20%2F%3E%3CH2%20id%3D%22toc-hId-201512604%22%20id%3D%22toc-hId--20327519%22%3ESlack%3C%2FH2%3E%3CBR%20%2F%3E%20As%20an%20illustration%20of%20service%20hooks%2C%20let's%20add%20a%20slack%20notification%20when%20a%20%3CBR%20%2F%3E%20%3CBR%20%2F%3E%20The%20first%20step%20is%20to%20configure%20slack%20for%20integration%20with%20VSTS.%20%26nbsp%3B%20Within%20the%20slack%20team%2C%20select%20the%20Apps%20%26amp%3B%20integration%20option%3A%20%3CBR%20%2F%3E%20%3CBR%20%2F%3E%20%3CIMG%20src%3D%22https%3A%2F%2Ftechcommunity.microsoft.com%2Ft5%2Fimage%2Fserverpage%2Fimage-id%2F73296i713DE1F2D2D11A2D%22%20%2F%3E%20%3CBR%20%2F%3E%20%3CBR%20%2F%3E%20Search%20and%20find%20the%20Visual%20Studio%20Team%20Services%20application%20and%20Install%3A%20%3CBR%20%2F%3E%20%3CBR%20%2F%3E%20%3CIMG%20src%3D%22https%3A%2F%2Ftechcommunity.microsoft.com%2Ft5%2Fimage%2Fserverpage%2Fimage-id%2F73297i6F1BCF6BEE39B443%22%20%2F%3E%20%3CBR%20%2F%3E%20%3CBR%20%2F%3E%20In%20the%20option%20to%20Post%20to%20Channel%2C%20an%20existing%20channel%20or%20the%20ability%20to%20create%20a%20channel%20can%20be%20selected.%20%3CBR%20%2F%3E%3CBR%20%2F%3E%3CIMG%20src%3D%22https%3A%2F%2Ftechcommunity.microsoft.com%2Ft5%2Fimage%2Fserverpage%2Fimage-id%2F73298i4C066D951664564B%22%20%2F%3E%3CBR%20%2F%3E%3CBR%20%2F%3EAfter%20the%20application%20is%20configured%2C%20slack%20provides%20control%20for%20removing%20or%20disabling%20the%20integration%20as%20well%20as%20setup%20instructions.%20%3CBR%20%2F%3E%3CBR%20%2F%3E%3CIMG%20src%3D%22https%3A%2F%2Ftechcommunity.microsoft.com%2Ft5%2Fimage%2Fserverpage%2Fimage-id%2F73299i83CD6D11EE41C8FD%22%20%2F%3E%3CBR%20%2F%3E%3CBR%20%2F%3E%3CEM%3ENote%3A%20in%20the%20setup%20instructions%20and%20in%20the%20Integration%20Settings%20is%20the%20Webhook%20URL%20which%20is%20needed%20in%20the%20VSTS%20setup%3A%20%3C%2FEM%3E%20%3CBR%20%2F%3E%20%3CBR%20%2F%3E%20%3CIMG%20src%3D%22https%3A%2F%2Ftechcommunity.microsoft.com%2Ft5%2Fimage%2Fserverpage%2Fimage-id%2F73300iA14DACBA4BAF1C83%22%20%2F%3E%20%3CBR%20%2F%3E%20%3CBR%20%2F%3E%20%3CBR%20%2F%3E%3CH2%20id%3D%22toc-hId-1944322939%22%20id%3D%22toc-hId--1827781982%22%3ESetting%20up%20a%20Service%20Hook%20in%20Visual%20Studio%3C%2FH2%3E%3CBR%20%2F%3E%20Slack%20and%20VisualStudio.com%20both%20provide%20setup%20instructions%20so%20in%20order%20to%20make%20this%20post%20a%20bit%20more%20interesting%2C%20let's%20setup%20a%20service%20hook%20only%20for%20when%20a%20build%20ends.%20%26nbsp%3BIn%20VSTS%2C%20select%20the%20Service%20Hooks%20menu%20from%20within%20the%20build%20project%3A%20%3CBR%20%2F%3E%20%3CBR%20%2F%3E%20%3CIMG%20src%3D%22https%3A%2F%2Ftechcommunity.microsoft.com%2Ft5%2Fimage%2Fserverpage%2Fimage-id%2F73301i4565864A4EBF8120%22%20%2F%3E%20%3CBR%20%2F%3E%20%3CBR%20%2F%3E%20After%20selecting%20Slack%2C%20you%20can%20then%20specify%20the%20event%20and%20filters.%20%26nbsp%3BIn%20this%20example%2C%20only%20Failed%20builds%20will%20generate%20a%20message%3A%20%3CBR%20%2F%3E%20%3CBR%20%2F%3E%20%3CIMG%20src%3D%22https%3A%2F%2Ftechcommunity.microsoft.com%2Ft5%2Fimage%2Fserverpage%2Fimage-id%2F73302iC65F3E193F6A2F77%22%20%2F%3E%20%3CBR%20%2F%3E%20%3CBR%20%2F%3E%20The%20final%20step%20in%20the%20wizard%20requires%20the%20Slack%20webhook%20address%20and%20a%20convenient%20way%20to%20test%20the%20integration%3A%20%3CBR%20%2F%3E%20%3CBR%20%2F%3E%20%3CIMG%20src%3D%22https%3A%2F%2Ftechcommunity.microsoft.com%2Ft5%2Fimage%2Fserverpage%2Fimage-id%2F73303iDF77AAB6ED8BE9E6%22%20%2F%3E%20%3CBR%20%2F%3E%3CH2%20id%3D%22toc-hId--607834022%22%20id%3D%22toc-hId-659730851%22%3ESummary%3C%2FH2%3E%3CBR%20%2F%3E%20Service%20Hooks%20is%20a%20great%20feature%20for%20integrating%20the%20activity%20of%20VSTS%20into%20external%20applications.%20%26nbsp%3BThere%20are%20many%20out%20of%20the%20box%20services%20available%20as%20well%20as%20the%20ability%20to%20%3CA%20href%3D%22https%3A%2F%2Fwww.visualstudio.com%2Fen-us%2Fdocs%2Fintegrate%2Fget-started%2Fservice-hooks%2Fcreate-subscription%22%20target%3D%22_blank%22%20rel%3D%22noopener%20noreferrer%22%3E%20subscribe%20to%20VSTS%26nbsp%3Bto%20receive%20notifications%20about%20build%20events%20%3C%2FA%3E%20.%20%26nbsp%3BService%20Hooks%20and%20other%20features%20allow%20teams%20to%20handle%20events%20as%20they%20happen%20and%20not%20just%20when%20reported%20or%20stumbled%20upon.%20%26nbsp%3BFor%20example%2C%20with%20the%20Slack%20application%20running%2C%20alerts%20in%20the%20Action%20Center%20are%20immediately%20brought%20to%20the%20attention%20of%20the%20devops%20as%20illustrated%20below%3A%20%3CBR%20%2F%3E%20%3CBR%20%2F%3E%20%3CIMG%20src%3D%22https%3A%2F%2Ftechcommunity.microsoft.com%2Ft5%2Fimage%2Fserverpage%2Fimage-id%2F73304i8FCA9B0129DDAACC%22%20%2F%3E%20%3CBR%20%2F%3E%20%3CBR%20%2F%3E%20%3CBR%20%2F%3E%20%3CBR%20%2F%3E%20%3CBR%20%2F%3E%20%3CBR%20%2F%3E%20%3CBR%20%2F%3E%20%3CBR%20%2F%3E%3C%2FLINGO-BODY%3E%3CLINGO-TEASER%20id%3D%22lingo-teaser-336008%22%20slang%3D%22en-US%22%3EFirst%20published%20on%20MSDN%20on%20Nov%2009%2C%202016%20Authored%20by%20Jeffrey%20ChilbertoIn%20part%201%26nbsp%3Ba%20basic%20Azure%20Web%20App%20website%20was%20built%20and%20deployed%20using%20VSTS%20Build%26nbsp%3Band%26nbsp%3BPart%202%20illustrated%20how%26nbsp%3Badditional%20files%20could%20be%20included%20when%20building%20a%20web%20project.%3C%2FLINGO-TEASER%3E
Version history
Last update:
‎Feb 12 2019 02:25 PM
Updated by: