CINXE.COM

<!DOCTYPE html><html lang="en"><head><meta charSet="utf-8"/><meta name="viewport" content="width=device-width"/><title>Use the Run Function widget in Studio | Twilio</title><meta name="description" content="Serverless Functions"/><link rel="canonical" href="https://www.twilio.com/docs/serverless/functions-assets/quickstart/run-function-studio-widget"/><meta name="next-head-count" content="5"/><link rel="preconnect" href="https://assets.twilio.com"/><script async="" defer="" src="https://consent.trustarc.com/notice?domain=twilio.com&c=teconsent&gtm=1&js=nj&noticeType=bb"></script><meta name="x-twilio-docs-source" content="primary"/><link rel="preload" href="/_next/static/css/12418e876151f57e.css?dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe" as="style"/><link rel="stylesheet" href="/_next/static/css/12418e876151f57e.css?dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe" data-n-g=""/><noscript data-n-css=""></noscript><script defer="" nomodule="" src="/_next/static/chunks/polyfills-42372ed130431b0a.js?dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe"></script><script src="/_next/static/chunks/webpack-d3ec386faefbf024.js?dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe" defer=""></script><script src="/_next/static/chunks/framework-d65b0fe30fbe55da.js?dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe" defer=""></script><script src="/_next/static/chunks/main-67108fd261318eed.js?dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe" defer=""></script><script src="/_next/static/chunks/pages/_app-b2bc32db37b22173.js?dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe" defer=""></script><script src="/_next/static/chunks/398-ebbc0d3c0be7d4a4.js?dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe" defer=""></script><script src="/_next/static/chunks/741-af6e3e21307ad8e9.js?dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe" defer=""></script><script src="/_next/static/chunks/pages/docs/%5B...path%5D-c5c89aaab05f1efc.js?dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe" defer=""></script><script src="/_next/static/nWtU_5WJsvLGK2x62E_3J/_buildManifest.js?dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe" defer=""></script><script src="/_next/static/nWtU_5WJsvLGK2x62E_3J/_ssgManifest.js?dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe" defer=""></script></head><body><div id="__next"><style data-emotion="css-global lbobjb">html{font-size:100%;font-family:'TwilioSansText','Inter var experimental','Inter var',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Oxygen-Sans,Ubuntu,Cantarell,'Helvetica Neue',sans-serif;}html:lang(ja) .paste-theme-provider,html:lang(ja-JP) .paste-theme-provider{font-family:'Inter var experimental','Inter var',Hiragino Sans,'ヒラギノ角ゴ ProN W3','Hiragino Kaku Gothic ProN','メイリオ',Meiryo,Osaka,'MS PGothic',sans-serif;}html:lang(zh-CN) .paste-theme-provider{font-family:'Inter var experimental','Inter var','Microsoft YaHei New',微软雅黑,'Microsoft Yahei','Microsoft JhengHei',宋体,SimSun,sans-serif;}html:lang(zh-TW) .paste-theme-provider,html:lang(zh-HK) .paste-theme-provider{font-family:'Inter var experimental','Inter var','Microsoft JhengHei',微軟正黑體,'Microsoft JhengHei UI','Microsoft YaHei',微軟雅黑,宋体,SimSun,sans-serif;}html:lang(ko) .paste-theme-provider{font-family:'Inter var experimental','Inter var','Microsoft JhengHei',微軟正黑體,'Microsoft JhengHei UI','Microsoft YaHei',微軟雅黑,宋体,SimSun,sans-serif;}body{background-color:rgb(255, 255, 255);margin:0;}*,*::after,*::before{box-sizing:border-box;}@media (prefers-reduced-motion: reduce){*{-webkit-animation-duration:0!important;animation-duration:0!important;-webkit-animation-iteration-count:1!important;animation-iteration-count:1!important;transition-duration:0!important;scroll-behavior:auto!important;}}:root{--reach-dialog:1;}</style><style data-emotion="css-global 1uje5tv">@font-face{font-family:'Inter var';font-weight:100 900;font-display:swap;font-style:normal;font-named-instance:'Regular';src:url("https://assets.twilio.com/public_assets/paste-fonts/1.5.2/Inter-roman.var.woff2?v=3.19") format("woff2");}@font-face{font-family:'Inter var';font-weight:100 900;font-display:swap;font-style:italic;font-named-instance:'Italic';src:url("https://assets.twilio.com/public_assets/paste-fonts/1.5.2/Inter-italic.var.woff2?v=3.19") format("woff2");}@font-face{font-family:'Inter var experimental';font-weight:100 900;font-display:swap;font-style:oblique 0deg 8deg;src:url("https://assets.twilio.com/public_assets/paste-fonts/1.5.2/Inter.var.woff2?v=3.19") format("woff2");}@font-face{font-family:'TwilioSansMono';font-style:normal;font-display:swap;font-weight:400;src:local(''),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansMono-Regular.woff2') format('woff2'),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansMono-Regular.woff') format('woff');}@font-face{font-family:'TwilioSansMono';font-style:italic;font-display:swap;font-weight:400;src:local(''),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansMono-RegularItl.woff2') format('woff2'),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansMono-RegularItl.woff') format('woff');}@font-face{font-family:'TwilioSansMono';font-style:normal;font-display:swap;font-weight:700;src:local(''),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansMono-Bold.woff2') format('woff2'),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansMono-Bold.woff') format('woff');}@font-face{font-family:'TwilioSansMono';font-style:italic;font-display:swap;font-weight:700;src:local(''),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansMono-BoldItl.woff2') format('woff2'),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansMono-BoldItl.woff') format('woff');}@font-face{font-family:'TwilioSansMono';font-style:normal;font-display:swap;font-weight:500;src:local(''),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansMono-Medium.woff2') format('woff2'),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansMono-Medium.woff') format('woff');}@font-face{font-family:'TwilioSansMono';font-style:italic;font-display:swap;font-weight:500;src:local(''),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansMono-MediumItl.woff2') format('woff2'),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansMono-MediumItl.woff') format('woff');}@font-face{font-family:'TwilioSansText';font-style:normal;font-display:swap;font-weight:300;src:local(''),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansText-Light.woff2') format('woff2'),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansText-Light.woff') format('woff');}@font-face{font-family:'TwilioSansText';font-style:italic;font-display:swap;font-weight:300;src:local(''),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansText-LightItl.woff2') format('woff2'),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansText-LightItl.woff') format('woff');}@font-face{font-family:'TwilioSansText';font-style:normal;font-display:swap;font-weight:400;src:local(''),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansText-Regular.woff2') format('woff2'),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansText-Regular.woff') format('woff');}@font-face{font-family:'TwilioSansText';font-style:italic;font-display:swap;font-weight:400;src:local(''),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansText-RegularItl.woff2') format('woff2'),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansText-RegularItl.woff') format('woff');}@font-face{font-family:'TwilioSansText';font-style:normal;font-display:swap;font-weight:500;src:local(''),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansText-Medium.woff2') format('woff2'),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansText-Medium.woff') format('woff');}@font-face{font-family:'TwilioSansText';font-style:italic;font-display:swap;font-weight:500;src:local(''),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansText-MediumItl.woff2') format('woff2'),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansText-MediumItl.woff') format('woff');}@font-face{font-family:'TwilioSansText';font-style:normal;font-display:swap;font-weight:600;src:local(''),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansText-Semibold.woff2') format('woff2'),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansText-Semibold.woff') format('woff');}@font-face{font-family:'TwilioSansText';font-style:italic;font-display:swap;font-weight:600;src:local(''),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansText-SemiboldItl.woff2') format('woff2'),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansText-SemiboldItl.woff') format('woff');}@font-face{font-family:'TwilioSansText';font-style:normal;font-display:swap;font-weight:700;src:local(''),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansText-Bold.woff2') format('woff2'),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansText-Bold.woff') format('woff');}@font-face{font-family:'TwilioSansText';font-style:italic;font-display:swap;font-weight:700;src:local(''),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansText-BoldItl.woff2') format('woff2'),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansText-BoldItl.woff') format('woff');}@font-face{font-family:'TwilioSansText';font-style:normal;font-display:swap;font-weight:800;src:local(''),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansText-Extrabold.woff2') format('woff2'),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansText-Extrabold.woff') format('woff');}@font-face{font-family:'TwilioSansText';font-style:italic;font-display:swap;font-weight:800;src:local(''),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansText-ExtraboldItl.woff2') format('woff2'),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansText-ExtraboldItl.woff') format('woff');}@font-face{font-family:'TwilioSansDisplay';font-style:normal;font-display:swap;font-weight:300;src:local(''),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansDisplay-Light.woff2') format('woff2'),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansDisplay-Light.woff') format('woff');}@font-face{font-family:'TwilioSansDisplay';font-style:italic;font-display:swap;font-weight:300;src:local(''),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansDisplay-LightItl.woff2') format('woff2'),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansDisplay-LightItl.woff') format('woff');}@font-face{font-family:'TwilioSansDisplay';font-style:normal;font-display:swap;font-weight:400;src:local(''),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansDisplay-Regular.woff2') format('woff2'),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansDisplay-Regular.woff') format('woff');}@font-face{font-family:'TwilioSansDisplay';font-style:italic;font-display:swap;font-weight:400;src:local(''),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansDisplay-RegularItl.woff2') format('woff2'),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansDisplay-RegularItl.woff') format('woff');}@font-face{font-family:'TwilioSansDisplay';font-style:normal;font-display:swap;font-weight:500;src:local(''),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansDisplay-Medium.woff2') format('woff2'),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansDisplay-Medium.woff') format('woff');}@font-face{font-family:'TwilioSansDisplay';font-style:italic;font-display:swap;font-weight:500;src:local(''),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansDisplay-MediumItl.woff2') format('woff2'),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansDisplay-MediumItl.woff') format('woff');}@font-face{font-family:'TwilioSansDisplay';font-style:normal;font-display:swap;font-weight:600;src:local(''),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansDisplay-Semibold.woff2') format('woff2'),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansDisplay-Semibold.woff') format('woff');}@font-face{font-family:'TwilioSansDisplay';font-style:italic;font-display:swap;font-weight:600;src:local(''),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansDisplay-SemiboldItl.woff2') format('woff2'),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansDisplay-SemiboldItl.woff') format('woff');}@font-face{font-family:'TwilioSansDisplay';font-style:normal;font-display:swap;font-weight:700;src:local(''),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansDisplay-Bold.woff2') format('woff2'),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansDisplay-Bold.woff') format('woff');}@font-face{font-family:'TwilioSansDisplay';font-style:italic;font-display:swap;font-weight:700;src:local(''),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansDisplay-BoldItl.woff2') format('woff2'),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansDisplay-BoldItl.woff') format('woff');}@font-face{font-family:'TwilioSansDisplay';font-style:normal;font-display:swap;font-weight:800;src:local(''),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansDisplay-Extrabold.woff2') format('woff2'),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansDisplay-Extrabold.woff') format('woff');}@font-face{font-family:'TwilioSansDisplay';font-style:italic;font-display:swap;font-weight:800;src:local(''),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansDisplay-ExtraboldItl.woff2') format('woff2'),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansDisplay-ExtraboldItl.woff') format('woff');}</style><style data-emotion="css 1pzojz9">.css-1pzojz9{color:rgb(18, 28, 45);-webkit-print-color-scheme:light;color-scheme:light;font-size:0.875rem;font-family:'TwilioSansText','Inter var experimental','Inter var',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Oxygen-Sans,Ubuntu,Cantarell,'Helvetica Neue',sans-serif;line-height:1.25rem;font-weight:400;font-variant-numeric:tabular-nums;}</style><div class="paste-theme-provider css-1pzojz9"><style data-emotion="css-global lbobjb">html{font-size:100%;font-family:'TwilioSansText','Inter var experimental','Inter var',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Oxygen-Sans,Ubuntu,Cantarell,'Helvetica Neue',sans-serif;}html:lang(ja) .paste-theme-provider,html:lang(ja-JP) .paste-theme-provider{font-family:'Inter var experimental','Inter var',Hiragino Sans,'ヒラギノ角ゴ ProN W3','Hiragino Kaku Gothic ProN','メイリオ',Meiryo,Osaka,'MS PGothic',sans-serif;}html:lang(zh-CN) .paste-theme-provider{font-family:'Inter var experimental','Inter var','Microsoft YaHei New',微软雅黑,'Microsoft Yahei','Microsoft JhengHei',宋体,SimSun,sans-serif;}html:lang(zh-TW) .paste-theme-provider,html:lang(zh-HK) .paste-theme-provider{font-family:'Inter var experimental','Inter var','Microsoft JhengHei',微軟正黑體,'Microsoft JhengHei UI','Microsoft YaHei',微軟雅黑,宋体,SimSun,sans-serif;}html:lang(ko) .paste-theme-provider{font-family:'Inter var experimental','Inter var','Microsoft JhengHei',微軟正黑體,'Microsoft JhengHei UI','Microsoft YaHei',微軟雅黑,宋体,SimSun,sans-serif;}body{background-color:rgb(255, 255, 255);margin:0;}*,*::after,*::before{box-sizing:border-box;}@media (prefers-reduced-motion: reduce){*{-webkit-animation-duration:0!important;animation-duration:0!important;-webkit-animation-iteration-count:1!important;animation-iteration-count:1!important;transition-duration:0!important;scroll-behavior:auto!important;}}:root{--reach-dialog:1;}</style><div class="css-1pzojz9"><style data-emotion="css-global 10ozouv">*{font-variant-ligatures:none;font-feature-settings:"liga" 0;}.DocSearch-Button{background-color:rgb(255, 255, 255);border-radius:4px;box-shadow:0 0 0 1px #8891aa;color:rgb(96, 107, 133);padding-left:0.75rem;padding-right:0.75rem;margin:0;width:100%;}.DocSearch-Button:hover{box-shadow:0 0 0 1px #006dfa;}.DocSearch-Button:active,.DocSearch-Button:focus{box-shadow:0 0 0 1px #cacdd8,0 0 0 3px #ffffff,0 0 0 4px #006dfa,0 0 0 6px #cce4ff;}.DocSearch-Button .DocSearch-Search-Icon{color:rgb(96, 107, 133);width:1rem;height:1rem;}.DocSearch-Button-Placeholder{font-size:0.875rem;font-family:'TwilioSansText','Inter var experimental','Inter var',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Oxygen-Sans,Ubuntu,Cantarell,'Helvetica Neue',sans-serif;font-weight:500;font-style:italic;padding-left:0.75rem;padding-right:0.75rem;}.DocSearch-Button-Key{top:0;padding-bottom:0;}.DocSearch-Container{color:rgb(18, 28, 45);-webkit-print-color-scheme:light;color-scheme:light;font-size:0.875rem;font-family:'TwilioSansText','Inter var experimental','Inter var',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Oxygen-Sans,Ubuntu,Cantarell,'Helvetica Neue',sans-serif;line-height:1.25rem;font-weight:400;font-variant-numeric:tabular-nums;}.DocSearch-Dropdown a{color:rgb(2, 99, 224);-webkit-text-decoration:underline;text-decoration:underline;}.DocSearch-Dropdown a:hover{-webkit-text-decoration:none;text-decoration:none;}.DocSearch-SearchBar{padding-bottom:0.25rem;}.DocSearch-Search-Icon{color:rgb(96, 107, 133);}.DocSearch-Input{padding-left:1rem;}.DocSearch-LoadingIndicator svg,.DocSearch-MagnifierLabel svg{width:1rem;height:1rem;}.DocSearch-Hits mark{color:rgb(2, 99, 224);}.DocSearch-Hit{padding-bottom:0.5rem;}.DocSearch-Hit a{border-color:rgb(225, 227, 234);border-style:solid;border-width:2px;-webkit-text-decoration:none;text-decoration:none;}.DocSearch-Hit[aria-selected=true] a{border-color:rgb(3, 11, 93);}.DocSearch-Hit-title{font-size:0.875rem;}.DocSearch-Hit-path{font-size:0.75rem;}.DocSearch-Hit-source{color:rgb(18, 28, 45);font-size:0.875rem;font-weight:500;}.DocSearch-Hit-icon{display:none;}.DocSearch-Prefill{color:rgb(2, 99, 224);-webkit-text-decoration:underline;text-decoration:underline;}.DocSearch-Prefill:hover{-webkit-text-decoration:none;text-decoration:none;}.DocSearch-Commands-Key{padding-bottom:0;}:root{--docsearch-primary-color:rgb(3, 11, 93);--docsearch-text-color:rgb(18, 28, 45);--docsearch-spacing:1rem;--docsearch-icon-stroke-width:2px;--docsearch-highlight-color:rgb(3, 11, 93);--docsearch-muted-color:rgb(96, 107, 133);--docsearch-container-background:rgba(96, 107, 133, 0.5);--docsearch-logo-color:rgb(96, 107, 133);--docsearch-modal-width:44.5rem;--docsearch-modal-height:600px;--docsearch-modal-background:rgb(255, 255, 255);--docsearch-modal-shadow:0 2px 8px 0 rgba(18, 28, 45, 0.1);--docsearch-searchbox-height:46px;--docsearch-searchbox-background:rgb(18, 28, 45);--docsearch-searchbox-focus-background:rgb(255, 255, 255);--docsearch-searchbox-shadow:0 0 0 2px #ffffff,0 0 0 3px #006dfa,0 0 0 5px #cce4ff;--docsearch-hit-height:56px;--docsearch-hit-color:rgb(18, 28, 45);--docsearch-hit-active-color:rgb(255, 255, 255);--docsearch-hit-background:rgb(255, 255, 255);--docsearch-hit-shadow:none;--docsearch-key-gradient:rgb(244, 244, 246);--docsearch-key-shadow:none;--docsearch-footer-height:44px;--docsearch-footer-background:rgb(255, 255, 255);--docsearch-footer-shadow:none;}html{scroll-behavior:smooth;scroll-padding-top:100px;}@media (max-width: 1385px){html{scroll-padding-top:156px;}}.grecaptcha-badge{visibility:hidden;}</style><style data-emotion="css 12lwncy">.css-12lwncy{box-sizing:border-box;opacity:0;transition-delay:50ms;-webkit-transition:opacity 150ms ease;transition:opacity 150ms ease;position:relative;z-index:40;}@media screen and (min-width: 768px){.css-12lwncy{opacity:1;}}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-12lwncy"><style data-emotion="css 1rkak9m">.css-1rkak9m{box-sizing:border-box;background-color:rgb(255, 255, 255);border-radius:4px;box-shadow:0 2px 8px 0 rgba(18, 28, 45, 0.1);left:10px;padding-left:1.25rem;padding-right:1.25rem;padding-top:0.5rem;padding-bottom:0.5rem;position:fixed;top:10px;-webkit-transform:translateY(-150%);-moz-transform:translateY(-150%);-ms-transform:translateY(-150%);transform:translateY(-150%);-webkit-transition:-webkit-transform 0.1s;transition:transform 0.1s;z-index:90;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-column-gap:1.25rem;column-gap:1.25rem;}.css-1rkak9m:focus-within{-webkit-transform:translateY(0%);-moz-transform:translateY(0%);-ms-transform:translateY(0%);transform:translateY(0%);}</style><div data-paste-element="SIDEBAR_SKIPLINKS" data-paste-core-version="20.7.0" class="css-1rkak9m"><style data-emotion="css lpeit6">.css-lpeit6{box-sizing:border-box;color:rgb(2, 99, 224);font-size:inherit;font-weight:inherit;line-height:inherit;outline:none;-webkit-text-decoration:underline;text-decoration:underline;}.css-lpeit6:active,.css-lpeit6[data-active=true]{color:rgb(6, 3, 58);-webkit-text-decoration:none;text-decoration:none;}.css-lpeit6:focus{box-shadow:0 0 0 2px #ffffff,0 0 0 3px #006dfa,0 0 0 5px #cce4ff;color:rgb(2, 99, 224);-webkit-text-decoration:underline;text-decoration:underline;border-radius:4px;}.css-lpeit6:hover{color:rgb(3, 11, 93);-webkit-text-decoration:none;text-decoration:none;}</style><a data-paste-element="SIDEBAR_SKIPLINKS_LINK" data-paste-core-version="20.7.0" href="#twilio-docs-content-area" class="css-lpeit6">Skip to content</a><a data-paste-element="SIDEBAR_SKIPLINKS_LINK" data-paste-core-version="20.7.0" href="#twilio-docs-sidebar-nav" class="css-lpeit6">Skip to navigation</a><a data-paste-element="SIDEBAR_SKIPLINKS_LINK" data-paste-core-version="20.7.0" href="#twilio-docs-topbar" class="css-lpeit6">Skip to topbar</a></div><style data-emotion="css 1ngeyxk">.css-1ngeyxk{box-sizing:border-box;width:100%;overflow:visible;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;border-right-style:solid;border-right-width:1px;border-right-color:rgb(57, 71, 98);background-color:rgb(18, 28, 45);z-index:50;position:fixed;top:0;left:0;bottom:0;}@media screen and (min-width: 768px){.css-1ngeyxk{width:15rem;}}</style><aside data-paste-element="SIDEBAR" data-paste-core-version="20.7.0" style="opacity:1;width:15rem;transform:translateX(0%)" id=":R2lasm:" class="css-1ngeyxk"><style data-emotion="css 144b354">.css-144b354{box-sizing:border-box;padding-left:1.25rem;padding-right:1.25rem;min-height:4.75rem;border-bottom-width:1px;border-bottom-style:solid;border-bottom-color:rgb(57, 71, 98);display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:start;-ms-flex-pack:start;-webkit-justify-content:flex-start;justify-content:flex-start;-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;-webkit-column-gap:1rem;column-gap:1rem;overflow:hidden;}</style><div data-paste-element="SIDEBAR_HEADER" data-paste-core-version="20.7.0" class="css-144b354"><style data-emotion="css 16k9fbc">.css-16k9fbc{box-sizing:border-box;width:auto;-webkit-appearance:none;-moz-appearance:none;-ms-appearance:none;appearance:none;background:none;display:inline-block;border:none;outline:none;-webkit-transition:background-color 100ms ease-in,box-shadow 100ms ease-in,color 100ms ease-in;transition:background-color 100ms ease-in,box-shadow 100ms ease-in,color 100ms ease-in;font-family:inherit;font-weight:600;-webkit-text-decoration:none;text-decoration:none;position:relative;margin:0;border-radius:4px;cursor:pointer;color:rgb(255, 255, 255);background-color:rgb(18, 28, 45);box-shadow:0 0 0 1px #394762;padding:0.5rem;}.css-16k9fbc:hover{-webkit-text-decoration:none;text-decoration:none;color:rgb(255, 255, 255);background-color:rgb(31, 48, 76);box-shadow:0 0 0 1px #f4f4f6;}.css-16k9fbc:focus{-webkit-text-decoration:none;text-decoration:none;box-shadow:0 0 0 1px #394762,0 0 0 3px #121c2d,0 0 0 4px #ffffff,0 0 0 6px rgba(255, 255, 255, 0.2);}.css-16k9fbc:active,.css-16k9fbc[data-active=true]{-webkit-text-decoration:none;text-decoration:none;box-shadow:0 0 0 1px #ffffff;color:rgb(255, 255, 255);background-color:rgb(31, 48, 76);}</style><a data-paste-element="SIDEBAR_HEADER_ICON_BUTTON" data-paste-core-version="20.7.0" href="/docs" type="button" aria-busy="false" class="css-16k9fbc"><style data-emotion="css 1lgr57j">.css-1lgr57j{box-sizing:border-box;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-text-decoration:inherit;text-decoration:inherit;opacity:1;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;-webkit-column-gap:0.25rem;column-gap:0.25rem;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;width:100%;}</style><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><style data-emotion="css pe4vrq">.css-pe4vrq{box-sizing:border-box;line-height:0;display:block;color:currentColor;width:1.25rem;height:1.25rem;-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;}</style><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" viewBox="0 0 20 20" aria-labelledby="LogoTwilioIcon-:R9j6mlasm:"><title id="LogoTwilioIcon-:R9j6mlasm:">Go to the Twilio Docs home page</title><path fill="currentColor" fill-rule="evenodd" d="M10 0C4.477 0 0 4.477 0 10s4.477 10 10 10 10-4.477 10-10A10 10 0 0010 0zm0 17.333a7.333 7.333 0 110-14.666 7.333 7.333 0 010 14.666zm4.533-9.8a2.067 2.067 0 11-2.066-2.066 2.08 2.08 0 012.066 2.066zm0 4.934a2.067 2.067 0 11-2.066-2.067 2.08 2.08 0 012.066 2.067zm-4.933 0A2.067 2.067 0 117.533 10.4 2.08 2.08 0 019.6 12.467zm0-4.934a2.067 2.067 0 11-2.067-2.066A2.08 2.08 0 019.6 7.533z"></path></svg></span></span></a><style data-emotion="css bt2jq2">.css-bt2jq2{box-sizing:border-box;opacity:1;font-size:0.875rem;font-weight:600;line-height:1.25rem;letter-spacing:-.02em;color:rgb(255, 255, 255);white-space:nowrap;text-overflow:ellipsis;overflow:hidden;margin:0;}</style><div data-paste-element="SIDEBAR_HEADER_LABEL" data-paste-core-version="20.7.0" class="css-bt2jq2">Twilio Docs</div></div><style data-emotion="css 1r1miiz">.css-1r1miiz{box-sizing:border-box;max-height:100%;overflow:hidden;-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;}</style><div data-paste-element="SIDEBAR_BODY" data-paste-core-version="20.7.0" class="css-1r1miiz"><style data-emotion="css 1j8kdpc">.css-1j8kdpc{box-sizing:border-box;-webkit-transition:opacity 150ms ease;transition:opacity 150ms ease;max-height:100%;overflow-y:auto;overflow-x:hidden;padding-top:1rem;padding-bottom:1rem;padding-left:1.25rem;padding-right:1.25rem;-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;}</style><style data-emotion="css 1jrfwwl">.css-1jrfwwl{overflow-scrolling:touch;background:linear-gradient(rgb(18, 28, 45) 33%, rgba(20,28,44, 0)),linear-gradient(rgba(20,28,44, 0), rgb(18, 28, 45) 66%) 0 100%,radial-gradient(farthest-side at 50% 100%, rgba(57, 71, 98, 0.5), rgba(0,0,0,0)) 0 100%;background-repeat:no-repeat;-webkit-background-size:100% 15px,100% 15px,100% 5px,100% 5px;background-size:100% 15px,100% 15px,100% 5px,100% 5px;background-attachment:local,local,scroll,scroll;box-sizing:border-box;-webkit-transition:opacity 150ms ease;transition:opacity 150ms ease;max-height:100%;overflow-y:auto;overflow-x:hidden;padding-top:1rem;padding-bottom:1rem;padding-left:1.25rem;padding-right:1.25rem;-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;}.css-1jrfwwl::-webkit-scrollbar{width:6px;}.css-1jrfwwl::-webkit-scrollbar-track{margin-top:8px;background:rgb(18, 28, 45);}.css-1jrfwwl::-webkit-scrollbar-thumb{background:rgb(57, 71, 98);border-radius:10px;}.css-1jrfwwl::-webkit-scrollbar-thumb:hover{background:rgb(57, 71, 98);}</style><nav data-paste-element="SIDEBAR_NAVIGATION" data-paste-core-version="20.7.0" aria-label="main" id="twilio-docs-sidebar-nav" class="css-1jrfwwl"><style data-emotion="css 4zrz0j">.css-4zrz0j{box-sizing:border-box;font-style:normal;font-weight:400;font-size:0.875rem;line-height:1.25rem;color:rgb(202, 205, 216);-webkit-transition:all 120ms ease;transition:all 120ms ease;border-radius:4px;cursor:pointer;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;-webkit-column-gap:0.5rem;column-gap:0.5rem;outline:none;padding-top:0.5rem;padding-bottom:0.5rem;position:relative;-webkit-text-decoration:none;text-decoration:none;background:none;border:none;overflow:hidden;padding-left:1.5rem;padding-right:0.5rem;margin-bottom:0.5rem;width:100%;}.css-4zrz0j:focus{box-shadow:0 0 0 1px #ffffff,inset 0 0 0 3px rgba(255, 255, 255, 0.2);}.css-4zrz0j:hover{-webkit-text-decoration:underline;text-decoration:underline;}</style><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/serverless/functions-assets" class="css-4zrz0j"><style data-emotion="css qxhhlx">.css-qxhhlx{box-sizing:border-box;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:justify;-webkit-justify-content:space-between;justify-content:space-between;-webkit-column-gap:0.25rem;column-gap:0.25rem;-webkit-transition:all 120ms ease;transition:all 120ms ease;-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;float:none;opacity:1;white-space:normal;}</style><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Functions and Assets</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/serverless" class="css-4zrz0j"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Return to Serverless overview</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/serverless/functions-assets/functions" class="css-4zrz0j"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Overview</span></a><style data-emotion="css 17onuso">.css-17onuso{box-sizing:border-box;display:block;margin-bottom:0.5rem;}</style><div data-paste-element="SIDEBAR_NAVIGATION_DISCLOSURE" data-paste-core-version="20.7.0" class="css-17onuso"><style data-emotion="css 1icrb9o">.css-1icrb9o{box-sizing:border-box;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:justify;-webkit-justify-content:space-between;justify-content:space-between;-webkit-column-gap:0.5rem;column-gap:0.5rem;}</style><div data-paste-element="SIDEBAR_NAVIGATION_DISCLOSURE_HEADING_WRAPPER" data-paste-core-version="20.7.0" class="css-1icrb9o"><style data-emotion="css 1vx51jp">.css-1vx51jp{box-sizing:border-box;font-style:normal;font-weight:400;font-size:0.875rem;line-height:1.25rem;color:rgb(202, 205, 216);-webkit-transition:all 120ms ease;transition:all 120ms ease;border-radius:4px;cursor:pointer;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;-webkit-column-gap:0.25rem;column-gap:0.25rem;outline:none;padding-top:0.5rem;padding-bottom:0.5rem;position:relative;-webkit-text-decoration:none;text-decoration:none;}.css-1vx51jp:focus{box-shadow:0 0 0 1px #ffffff,inset 0 0 0 3px rgba(255, 255, 255, 0.2);}</style><div data-paste-element="SIDEBAR_NAVIGATION_DISCLOSURE_HEADING" data-paste-core-version="20.7.0" type="button" aria-expanded="false" aria-controls=":Rqlamlasm:" class="css-1vx51jp"><style data-emotion="css f76d15">.css-f76d15{box-sizing:border-box;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;color:rgb(136, 145, 170);height:1.25rem;width:1.25rem;-webkit-transition:-webkit-transform 150ms ease;transition:transform 150ms ease;-webkit-transform:translateX(0) rotate(0deg);-moz-transform:translateX(0) rotate(0deg);-ms-transform:translateX(0) rotate(0deg);transform:translateX(0) rotate(0deg);}</style><span data-paste-element="SIDEBAR_NAVIGATION_DISCLOSURE_HEADING_EXPAND_ICON" data-paste-core-version="20.7.0" class="css-f76d15"><style data-emotion="css pft8gl">.css-pft8gl{box-sizing:border-box;line-height:0;display:block;color:inherit;width:1.25rem;height:1.25rem;-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;}</style><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pft8gl"><svg role="img" aria-hidden="true" width="100%" height="100%" viewBox="0 0 20 20" fill="none" aria-labelledby="ChevronDisclosureIcon-:Rj9kqlamlasm:"><path fill="currentColor" fill-rule="evenodd" clip-rule="evenodd" d="M9.707 6.293a1 1 0 00-1.497 1.32l.083.094L10.585 10l-2.292 2.293a1 1 0 00-.083 1.32l.083.094a1 1 0 001.32.083l.094-.083 3-3a1 1 0 00.083-1.32l-.083-.094-3-3z"></path></svg></span></span><style data-emotion="css 1m2bqrv">.css-1m2bqrv{box-sizing:border-box;display:block;margin-left:0.25rem;-webkit-transition:all 120ms ease;transition:all 120ms ease;float:none;opacity:1;white-space:normal;}</style><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m2bqrv">Technical concepts</span></div></div><style data-emotion="css 1nm6rmy">.css-1nm6rmy{box-sizing:border-box;padding-left:1.5rem;color:rgb(202, 205, 216);margin-top:0.25rem;}</style><div data-paste-element="SIDEBAR_NAVIGATION_DISCLOSURE_CONTENT" data-paste-core-version="20.7.0" id=":Rqlamlasm:" hidden="" style="display:none" class="css-1nm6rmy"><style data-emotion="css lafmnu">.css-lafmnu{box-sizing:border-box;font-style:normal;font-weight:400;font-size:0.75rem;line-height:1.25rem;color:rgb(202, 205, 216);-webkit-transition:all 120ms ease;transition:all 120ms ease;border-radius:4px;cursor:pointer;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;-webkit-column-gap:0.5rem;column-gap:0.5rem;outline:none;padding-top:0.25rem;padding-bottom:0.25rem;position:relative;-webkit-text-decoration:none;text-decoration:none;background:none;border:none;overflow:hidden;padding-left:1.75rem;padding-right:0.5rem;margin-bottom:0.25rem;width:100%;}.css-lafmnu:focus{box-shadow:0 0 0 1px #ffffff,inset 0 0 0 3px rgba(255, 255, 255, 0.2);}.css-lafmnu:hover{-webkit-text-decoration:underline;text-decoration:underline;}</style><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/serverless/functions-assets/functions/request-flow" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Function request flow</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/serverless/functions-assets/functions/invocation" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Function execution</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/serverless/functions-assets/visibility" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Visibility of Functions and Assets</span></a></div></div><div data-paste-element="SIDEBAR_NAVIGATION_DISCLOSURE" data-paste-core-version="20.7.0" class="css-17onuso"><div data-paste-element="SIDEBAR_NAVIGATION_DISCLOSURE_HEADING_WRAPPER" data-paste-core-version="20.7.0" class="css-1icrb9o"><div data-paste-element="SIDEBAR_NAVIGATION_DISCLOSURE_HEADING" data-paste-core-version="20.7.0" type="button" aria-expanded="false" aria-controls=":R12lamlasm:" class="css-1vx51jp"><span data-paste-element="SIDEBAR_NAVIGATION_DISCLOSURE_HEADING_EXPAND_ICON" data-paste-core-version="20.7.0" class="css-f76d15"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pft8gl"><svg role="img" aria-hidden="true" width="100%" height="100%" viewBox="0 0 20 20" fill="none" aria-labelledby="ChevronDisclosureIcon-:Rj9l2lamlasm:"><path fill="currentColor" fill-rule="evenodd" clip-rule="evenodd" d="M9.707 6.293a1 1 0 00-1.497 1.32l.083.094L10.585 10l-2.292 2.293a1 1 0 00-.083 1.32l.083.094a1 1 0 001.32.083l.094-.083 3-3a1 1 0 00.083-1.32l-.083-.094-3-3z"></path></svg></span></span><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m2bqrv">Get started</span></div></div><div data-paste-element="SIDEBAR_NAVIGATION_DISCLOSURE_CONTENT" data-paste-core-version="20.7.0" id=":R12lamlasm:" hidden="" style="display:none" class="css-1nm6rmy"><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/serverless/functions-assets/functions/create-service" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Create a Service</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/serverless/functions-assets/assets" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Assets</span></a></div></div><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/labs/serverless-toolkit" class="css-4zrz0j"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx"><span>Serverless Toolkit</span><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" viewBox="0 0 20 20" aria-labelledby="LinkExternalIcon-:Rl9alamlasm:"><path fill="currentColor" fill-rule="evenodd" d="M8.4 4.5a.5.5 0 01.5.5v.1a.5.5 0 01-.5.5H5.6v8.8h8.8v-2.8a.5.5 0 01.41-.492l.09-.008h.1a.5.5 0 01.492.41l.008.09V15a.5.5 0 01-.41.492L15 15.5H5a.5.5 0 01-.492-.41L4.5 15V5a.5.5 0 01.41-.492L5 4.5h3.4zm6.6 0a.5.5 0 01.5.5v.1l-.001.01.001 3.29a.5.5 0 01-.5.5h-.1a.5.5 0 01-.5-.5l-.001-1.935-3.967 3.967a.611.611 0 01-.78.07l-.084-.07a.611.611 0 01-.07-.78l.07-.084L13.534 5.6H11.6a.5.5 0 01-.5-.5V5a.5.5 0 01.5-.5H15z"></path></svg></span></span></a><div data-paste-element="SIDEBAR_NAVIGATION_DISCLOSURE" data-paste-core-version="20.7.0" class="css-17onuso"><div data-paste-element="SIDEBAR_NAVIGATION_DISCLOSURE_HEADING_WRAPPER" data-paste-core-version="20.7.0" class="css-1icrb9o"><div data-paste-element="SIDEBAR_NAVIGATION_DISCLOSURE_HEADING" data-paste-core-version="20.7.0" type="button" aria-expanded="false" aria-controls=":R1ilamlasm:" class="css-1vx51jp"><span data-paste-element="SIDEBAR_NAVIGATION_DISCLOSURE_HEADING_EXPAND_ICON" data-paste-core-version="20.7.0" class="css-f76d15"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pft8gl"><svg role="img" aria-hidden="true" width="100%" height="100%" viewBox="0 0 20 20" fill="none" aria-labelledby="ChevronDisclosureIcon-:Rj9lilamlasm:"><path fill="currentColor" fill-rule="evenodd" clip-rule="evenodd" d="M9.707 6.293a1 1 0 00-1.497 1.32l.083.094L10.585 10l-2.292 2.293a1 1 0 00-.083 1.32l.083.094a1 1 0 001.32.083l.094-.083 3-3a1 1 0 00.083-1.32l-.083-.094-3-3z"></path></svg></span></span><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m2bqrv">Developer guides</span></div></div><div data-paste-element="SIDEBAR_NAVIGATION_DISCLOSURE_CONTENT" data-paste-core-version="20.7.0" id=":R1ilamlasm:" hidden="" style="display:none" class="css-1nm6rmy"><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/serverless/functions-assets/client" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Runtime Client</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/serverless/functions-assets/handler" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Runtime Handler</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/serverless/functions-assets/functions/variables" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Environment variables</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/serverless/functions-assets/functions/dependencies" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Dependencies</span></a><div data-paste-element="SIDEBAR_NAVIGATION_DISCLOSURE" data-paste-core-version="20.7.0" class="css-17onuso"><div data-paste-element="SIDEBAR_NAVIGATION_DISCLOSURE_HEADING_WRAPPER" data-paste-core-version="20.7.0" class="css-1icrb9o"><style data-emotion="css q9if6j">.css-q9if6j{box-sizing:border-box;font-style:normal;font-weight:400;font-size:0.75rem;line-height:1.25rem;color:rgb(202, 205, 216);-webkit-transition:all 120ms ease;transition:all 120ms ease;border-radius:4px;cursor:pointer;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;-webkit-column-gap:0.25rem;column-gap:0.25rem;outline:none;padding-top:0.25rem;padding-bottom:0.25rem;position:relative;-webkit-text-decoration:none;text-decoration:none;}.css-q9if6j:focus{box-shadow:0 0 0 1px #ffffff,inset 0 0 0 3px rgba(255, 255, 255, 0.2);}</style><div data-paste-element="SIDEBAR_NAVIGATION_DISCLOSURE_HEADING" data-paste-core-version="20.7.0" type="button" aria-expanded="false" aria-controls=":R2qlilamlasm:" class="css-q9if6j"><span data-paste-element="SIDEBAR_NAVIGATION_DISCLOSURE_HEADING_EXPAND_ICON" data-paste-core-version="20.7.0" class="css-f76d15"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pft8gl"><svg role="img" aria-hidden="true" width="100%" height="100%" viewBox="0 0 20 20" fill="none" aria-labelledby="ChevronDisclosureIcon-:Rj9mqlilamlasm:"><path fill="currentColor" fill-rule="evenodd" clip-rule="evenodd" d="M9.707 6.293a1 1 0 00-1.497 1.32l.083.094L10.585 10l-2.292 2.293a1 1 0 00-.083 1.32l.083.094a1 1 0 001.32.083l.094-.083 3-3a1 1 0 00.083-1.32l-.083-.094-3-3z"></path></svg></span></span><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m2bqrv">Headers and cookies</span></div></div><div data-paste-element="SIDEBAR_NAVIGATION_DISCLOSURE_CONTENT" data-paste-core-version="20.7.0" id=":R2qlilamlasm:" hidden="" style="display:none" class="css-1nm6rmy"><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/serverless/functions-assets/functions/headers-and-cookies" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Overview</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/serverless/functions-assets/functions/headers-and-cookies/access" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Access values</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/serverless/functions-assets/functions/headers-and-cookies/setting-and-modifying" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Set and modify values</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/serverless/functions-assets/functions/headers-and-cookies/limitations" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Limitations</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/serverless/functions-assets/quickstart#learn-how-headers-and-cookies-can-add-extra-functionality-and-security" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Examples</span></a></div></div><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/serverless/functions-assets/functions/debugging" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Debugging</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/serverless/functions-assets/faq" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Frequently asked questions</span></a></div></div><div data-paste-element="SIDEBAR_NAVIGATION_DISCLOSURE" data-paste-core-version="20.7.0" class="css-17onuso"><div data-paste-element="SIDEBAR_NAVIGATION_DISCLOSURE_HEADING_WRAPPER" data-paste-core-version="20.7.0" class="css-1icrb9o"><style data-emotion="css ecye55">.css-ecye55{box-sizing:border-box;font-style:normal;font-weight:600;font-size:0.875rem;line-height:1.25rem;color:rgb(255, 255, 255);-webkit-transition:all 120ms ease;transition:all 120ms ease;border-radius:4px;cursor:pointer;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;-webkit-column-gap:0.25rem;column-gap:0.25rem;outline:none;padding-top:0.5rem;padding-bottom:0.5rem;position:relative;-webkit-text-decoration:none;text-decoration:none;}.css-ecye55:focus{box-shadow:0 0 0 1px #ffffff,inset 0 0 0 3px rgba(255, 255, 255, 0.2);}</style><div data-paste-element="SIDEBAR_NAVIGATION_DISCLOSURE_HEADING" data-paste-core-version="20.7.0" type="button" aria-expanded="true" aria-controls=":R1qlamlasm:" class="css-ecye55"><style data-emotion="css 127bfmf">.css-127bfmf{box-sizing:border-box;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;color:rgb(136, 145, 170);height:1.25rem;width:1.25rem;-webkit-transition:-webkit-transform 150ms ease;transition:transform 150ms ease;-webkit-transform:translateX(0) rotate(90deg);-moz-transform:translateX(0) rotate(90deg);-ms-transform:translateX(0) rotate(90deg);transform:translateX(0) rotate(90deg);}</style><span data-paste-element="SIDEBAR_NAVIGATION_DISCLOSURE_HEADING_EXPAND_ICON" data-paste-core-version="20.7.0" class="css-127bfmf"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pft8gl"><svg role="img" aria-hidden="true" width="100%" height="100%" viewBox="0 0 20 20" fill="none" aria-labelledby="ChevronDisclosureIcon-:Rj9lqlamlasm:"><path fill="currentColor" fill-rule="evenodd" clip-rule="evenodd" d="M9.707 6.293a1 1 0 00-1.497 1.32l.083.094L10.585 10l-2.292 2.293a1 1 0 00-.083 1.32l.083.094a1 1 0 001.32.083l.094-.083 3-3a1 1 0 00.083-1.32l-.083-.094-3-3z"></path></svg></span></span><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m2bqrv">Examples</span></div></div><div data-paste-element="SIDEBAR_NAVIGATION_DISCLOSURE_CONTENT" data-paste-core-version="20.7.0" id=":R1qlamlasm:" class="css-1nm6rmy"><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/serverless/functions-assets/quickstart/receive-sms" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Receive an inbound SMS</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/serverless/functions-assets/quickstart/send-sms-and-mms" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Send SMS and MMS</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/serverless/functions-assets/quickstart/receive-call" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Receive an incoming phone call</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/serverless/functions-assets/quickstart/make-a-call" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Make a Call</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/serverless/functions-assets/quickstart/api-request" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Make an API request</span></a><style data-emotion="css bxygmn">.css-bxygmn{box-sizing:border-box;font-style:normal;font-weight:600;font-size:0.75rem;line-height:1.25rem;color:rgb(255, 255, 255);-webkit-transition:all 120ms ease;transition:all 120ms ease;border-radius:4px;cursor:pointer;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;-webkit-column-gap:0.5rem;column-gap:0.5rem;outline:none;padding-top:0.25rem;padding-bottom:0.25rem;position:relative;-webkit-text-decoration:none;text-decoration:none;background:none;border:none;overflow:hidden;padding-left:1.75rem;padding-right:0.5rem;margin-bottom:0.25rem;width:100%;background-color:rgb(31, 48, 76);}.css-bxygmn:focus{box-shadow:0 0 0 1px #ffffff,inset 0 0 0 3px rgba(255, 255, 255, 0.2);}.css-bxygmn:hover{-webkit-text-decoration:underline;text-decoration:underline;}</style><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/serverless/functions-assets/quickstart/run-function-studio-widget" aria-current="page" class="css-bxygmn"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Use the Run Function widget in Studio</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/serverless/functions-assets/quickstart/real-time-data-sync" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Handle real-time data with Twilio Sync</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/serverless/functions-assets/quickstart/basic-auth" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Protect your Function with Basic Auth</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/serverless/functions-assets/quickstart/json-web-token" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Protect your Function with JSON Web Token</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/serverless/functions-assets/quickstart/cookies-state" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Manage application state with cookies</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/serverless/functions-assets/quickstart/validate-webhook-requests-from-sendgrid" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Validate Webhook requests from SendGrid</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/serverless/functions-assets/quickstart/enabling-cors-between-flex-plugins-and-functions" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Enable CORS between Flex Plugins and Functions</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/serverless/functions-assets/quickstart/add-delay" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Add delay</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/serverless/functions-assets/quickstart/lookup-carrier-and-caller-info" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Determine carrier, phone number type, and caller info</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/serverless/functions-assets/quickstart/time-of-day-routing" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Time of day routing with Functions</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/serverless/functions-assets/quickstart/normalize-telephone-numbers" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Normalize telephone numbers</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/serverless/functions-assets/quickstart/blocked-numbers" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Prevent blocked numbers from calling your application</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/serverless/functions-assets/quickstart/display-versions" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Display Node.js and Twilio Helper Library versions</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/serverless/functions-assets/quickstart/how-to-call-twilio-functions-android" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">How to call Functions from Android</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/serverless/functions-assets/quickstart/how-to-call-twilio-functions-ios" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">How to call Functions from iOS</span></a></div></div><div data-paste-element="SIDEBAR_NAVIGATION_DISCLOSURE" data-paste-core-version="20.7.0" class="css-17onuso"><div data-paste-element="SIDEBAR_NAVIGATION_DISCLOSURE_HEADING_WRAPPER" data-paste-core-version="20.7.0" class="css-1icrb9o"><div data-paste-element="SIDEBAR_NAVIGATION_DISCLOSURE_HEADING" data-paste-core-version="20.7.0" type="button" aria-expanded="false" aria-controls=":R22lamlasm:" class="css-1vx51jp"><span data-paste-element="SIDEBAR_NAVIGATION_DISCLOSURE_HEADING_EXPAND_ICON" data-paste-core-version="20.7.0" class="css-f76d15"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pft8gl"><svg role="img" aria-hidden="true" width="100%" height="100%" viewBox="0 0 20 20" fill="none" aria-labelledby="ChevronDisclosureIcon-:Rj9m2lamlasm:"><path fill="currentColor" fill-rule="evenodd" clip-rule="evenodd" d="M9.707 6.293a1 1 0 00-1.497 1.32l.083.094L10.585 10l-2.292 2.293a1 1 0 00-.083 1.32l.083.094a1 1 0 001.32.083l.094-.083 3-3a1 1 0 00.083-1.32l-.083-.094-3-3z"></path></svg></span></span><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m2bqrv">Migration guides</span></div></div><div data-paste-element="SIDEBAR_NAVIGATION_DISCLOSURE_CONTENT" data-paste-core-version="20.7.0" id=":R22lamlasm:" hidden="" style="display:none" class="css-1nm6rmy"><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/serverless/functions-assets/functions/migrating-functionsclassic-new-functions-editor" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Migrating from Functions(Classic) to the new Functions Editor</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/serverless/functions-assets/node-upgrade" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Node.js v18 upgrade</span></a></div></div></nav></div></aside></div><style data-emotion="css 1tfs3ue">.css-1tfs3ue{box-sizing:border-box;margin-left:0;position:relative;background-color:rgb(255, 255, 255);}@media screen and (min-width: 768px){.css-1tfs3ue{margin-left:15rem;}}</style><div data-paste-element="SIDEBAR_PUSH_CONTENT_WRAPPER" data-paste-core-version="20.7.0" class="css-1tfs3ue"><style data-emotion="css 14kurmn">.css-14kurmn{box-sizing:border-box;width:100%;min-height:4.75rem;background-color:rgb(249, 249, 250);border-bottom-width:1px;border-bottom-style:solid;border-bottom-color:rgb(225, 227, 234);padding-left:1.5rem;padding-right:1.5rem;position:-webkit-sticky;position:sticky;top:0;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-webkit-justify-content:space-between;justify-content:space-between;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-column-gap:1.5rem;column-gap:1.5rem;z-index:40;}</style><div data-paste-element="TOPBAR" data-paste-core-version="20.7.0" id="twilio-docs-topbar" class="css-14kurmn"><style data-emotion="css 1dkvjfb">.css-1dkvjfb{box-sizing:border-box;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:start;-ms-flex-pack:start;-webkit-justify-content:flex-start;justify-content:flex-start;-webkit-box-flex-wrap:wrap;-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;-webkit-column-gap:1rem;column-gap:1rem;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}@media screen and (min-width: 768px){.css-1dkvjfb{display:none;}}</style><div data-paste-element="TOPBAR_ACTIONS" data-paste-core-version="20.7.0" class="css-1dkvjfb"><style data-emotion="css 1nye0dd">.css-1nye0dd{box-sizing:border-box;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;min-width:0;}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1nye0dd"><style data-emotion="css 19wcrnc">.css-19wcrnc{position:relative;-webkit-text-decoration:none;text-decoration:none;color:rgb(255, 255, 255);}.css-19wcrnc:hover{-webkit-text-decoration:underline;text-decoration:underline;}.css-19wcrnc:focus{outline:none;box-shadow:0 0 0 2px #ffffff,0 0 0 3px #006dfa,0 0 0 5px #cce4ff;border-radius:2px;}</style><a class="css-19wcrnc" href="/docs"><style data-emotion="css 8jah14">.css-8jah14{box-sizing:border-box;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}</style><span data-paste-element="MEDIA_OBJECT" data-paste-core-version="20.7.0" class="css-8jah14"><style data-emotion="css and4r">.css-and4r{box-sizing:border-box;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;margin-right:0.75rem;}</style><span data-paste-element="MEDIA_FIGURE" data-paste-core-version="20.7.0" class="css-and4r"><style data-emotion="css jsh2a3">.css-jsh2a3{box-sizing:border-box;line-height:0;display:block;color:rgb(242, 47, 70);width:2.5rem;height:2.5rem;-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;}</style><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-jsh2a3"><svg role="img" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" viewBox="0 0 20 20" aria-labelledby="LogoTwilioIcon-:R2da66tasm:"><title id="LogoTwilioIcon-:R2da66tasm:">Twilio Logo</title><path fill="currentColor" fill-rule="evenodd" d="M10 0C4.477 0 0 4.477 0 10s4.477 10 10 10 10-4.477 10-10A10 10 0 0010 0zm0 17.333a7.333 7.333 0 110-14.666 7.333 7.333 0 010 14.666zm4.533-9.8a2.067 2.067 0 11-2.066-2.066 2.08 2.08 0 012.066 2.066zm0 4.934a2.067 2.067 0 11-2.066-2.067 2.08 2.08 0 012.066 2.067zm-4.933 0A2.067 2.067 0 117.533 10.4 2.08 2.08 0 019.6 12.467zm0-4.934a2.067 2.067 0 11-2.067-2.066A2.08 2.08 0 019.6 7.533z"></path></svg></span></span><style data-emotion="css 1i39mnm">.css-1i39mnm{box-sizing:border-box;-webkit-flex:1;-ms-flex:1;flex:1;min-width:0;}</style><span data-paste-element="MEDIA_BODY" data-paste-core-version="20.7.0" class="css-1i39mnm"><style data-emotion="css 7aad9x">.css-7aad9x{margin:0;padding:0;color:rgb(18, 28, 45);font-size:1rem;line-height:1.25rem;}</style><div data-paste-element="TEXT" data-paste-core-version="20.6.0" class="css-7aad9x">Twilio Docs</div></span></span></a></div></div><style data-emotion="css 8o6zg9">.css-8o6zg9{box-sizing:border-box;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:end;-ms-flex-pack:end;-webkit-justify-content:flex-end;justify-content:flex-end;-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;-webkit-box-flex-wrap:wrap;-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;-webkit-column-gap:1rem;column-gap:1rem;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}@media screen and (min-width: 768px){.css-8o6zg9{display:none;}}</style><div data-paste-element="TOPBAR_ACTIONS" data-paste-core-version="20.7.0" class="css-8o6zg9"><style data-emotion="css miaxae">.css-miaxae{box-sizing:border-box;min-width:2.25rem;}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-miaxae"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search" disabled=""><span class="DocSearch-Button-Container"><svg width="20" height="20" class="DocSearch-Search-Icon" viewBox="0 0 20 20" aria-hidden="true"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"></span></button></div><style data-emotion="css 1b15v5e">.css-1b15v5e{box-sizing:border-box;width:auto;-webkit-appearance:none;-moz-appearance:none;-ms-appearance:none;appearance:none;background:none;display:inline-block;border:none;outline:none;-webkit-transition:background-color 150ms ease-in,box-shadow 150ms ease-in,color 150ms ease-in;transition:background-color 150ms ease-in,box-shadow 150ms ease-in,color 150ms ease-in;font-family:inherit;font-weight:600;-webkit-text-decoration:none;text-decoration:none;position:relative;margin:0;border-radius:4px;cursor:pointer;color:rgb(18, 28, 45);background-color:rgb(255, 255, 255);box-shadow:0 0 0 1px #cacdd8;padding:0.25rem;}.css-1b15v5e:hover{background-color:rgb(255, 255, 255);box-shadow:0 0 0 1px #006dfa;color:rgb(2, 99, 224);}.css-1b15v5e:focus{-webkit-text-decoration:none;text-decoration:none;box-shadow:0 0 0 1px #cacdd8,0 0 0 3px #ffffff,0 0 0 4px #006dfa,0 0 0 6px #cce4ff;}.css-1b15v5e:active,.css-1b15v5e[data-active=true]{background-color:rgb(255, 255, 255);box-shadow:0 0 0 1px #06033a;color:rgb(6, 3, 58);}.css-1b15v5e:disabled,.css-1b15v5e:disabled:focus,.css-1b15v5e:disabled:hover,.css-1b15v5e[aria-disabled=true],.css-1b15v5e[aria-disabled=true]:focus,.css-1b15v5e[aria-disabled=true]:hover{background-color:rgb(255, 255, 255);box-shadow:0 0 0 1px #e1e3ea;color:rgb(174, 178, 193);}.css-1b15v5e[aria-pressed=true]{background-color:rgb(244, 249, 255);box-shadow:0 0 0 1px #006dfa;color:rgb(2, 99, 224);}.css-1b15v5e[aria-pressed=true]:hover{background-color:rgb(244, 249, 255);box-shadow:0 0 0 1px #030b5d;color:rgb(3, 11, 93);}.css-1b15v5e[aria-pressed=true]:active,.css-1b15v5e[aria-pressed=true][data-active=true]{background-color:rgb(244, 249, 255);box-shadow:0 0 0 1px #06033a;color:rgb(6, 3, 58);}.css-1b15v5e[aria-pressed=true]:focus{background-color:rgb(244, 249, 255);box-shadow:0 0 0 1px #cacdd8,0 0 0 3px #ffffff,0 0 0 4px #006dfa,0 0 0 6px #cce4ff;color:rgb(2, 99, 224);}.css-1b15v5e[aria-pressed=true]:disabled,.css-1b15v5e[aria-pressed=true][aria-disabled=true]{background-color:rgb(225, 227, 234);box-shadow:0 0 0 1px #e1e3ea;color:rgb(255, 255, 255);}</style><button data-paste-element="BUTTON" data-paste-core-version="20.7.0" aria-pressed="true" aria-label="Open main navigation" type="button" aria-busy="false" class="css-1b15v5e"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><style data-emotion="css 15m1pao">.css-15m1pao{box-sizing:border-box;width:1.75rem;height:1.75rem;position:relative;}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-15m1pao"><style data-emotion="css pwk8hy">.css-pwk8hy{position:absolute;width:1rem;height:3px;border-radius:8px;-webkit-transition:-webkit-transform 0.25s ease-in-out,opacity 0.25s ease-in-out;transition:transform 0.25s ease-in-out,opacity 0.25s ease-in-out;transform-origin:left center;background-color:rgb(96, 107, 133);top:7px;left:6px;-webkit-transform:translateX(6px) translateY(4px) rotate(45deg);-moz-transform:translateX(6px) translateY(4px) rotate(45deg);-ms-transform:translateX(6px) translateY(4px) rotate(45deg);transform:translateX(6px) translateY(4px) rotate(45deg);opacity:0;}</style><span color="colorTextIcon" transform="translateX(6px) translateY(4px) rotate(45deg)" opacity="0" class="css-pwk8hy"></span><style data-emotion="css 11r4jzp">.css-11r4jzp{position:absolute;width:1rem;height:3px;border-radius:8px;-webkit-transition:-webkit-transform 0.25s ease-in-out,opacity 0.25s ease-in-out;transition:transform 0.25s ease-in-out,opacity 0.25s ease-in-out;transform-origin:left center;background-color:rgb(96, 107, 133);top:13px;left:6px;-webkit-transform:translateX(2px) translateY(-5px) rotate(45deg);-moz-transform:translateX(2px) translateY(-5px) rotate(45deg);-ms-transform:translateX(2px) translateY(-5px) rotate(45deg);transform:translateX(2px) translateY(-5px) rotate(45deg);}</style><span color="colorTextIcon" transform="translateX(2px) translateY(-5px) rotate(45deg)" class="css-11r4jzp"></span><style data-emotion="css 1j6de5r">.css-1j6de5r{position:absolute;width:1rem;height:3px;border-radius:8px;-webkit-transition:-webkit-transform 0.25s ease-in-out,opacity 0.25s ease-in-out;transition:transform 0.25s ease-in-out,opacity 0.25s ease-in-out;transform-origin:left center;background-color:rgb(96, 107, 133);top:13px;left:6px;-webkit-transform:translateX(2px) translateY(6px) rotate(-45deg);-moz-transform:translateX(2px) translateY(6px) rotate(-45deg);-ms-transform:translateX(2px) translateY(6px) rotate(-45deg);transform:translateX(2px) translateY(6px) rotate(-45deg);}</style><span color="colorTextIcon" transform="translateX(2px) translateY(6px) rotate(-45deg)" class="css-1j6de5r"></span><style data-emotion="css 1odqdkr">.css-1odqdkr{position:absolute;width:1rem;height:3px;border-radius:8px;-webkit-transition:-webkit-transform 0.25s ease-in-out,opacity 0.25s ease-in-out;transition:transform 0.25s ease-in-out,opacity 0.25s ease-in-out;transform-origin:left center;background-color:rgb(96, 107, 133);top:19px;left:6px;-webkit-transform:translateX(6px) translateY(-4px) rotate(-45deg);-moz-transform:translateX(6px) translateY(-4px) rotate(-45deg);-ms-transform:translateX(6px) translateY(-4px) rotate(-45deg);transform:translateX(6px) translateY(-4px) rotate(-45deg);opacity:0;}</style><span color="colorTextIcon" transform="translateX(6px) translateY(-4px) rotate(-45deg)" opacity="0" class="css-1odqdkr"></span></div></span></button></div><style data-emotion="css hemv1x">.css-hemv1x{box-sizing:border-box;display:none;-webkit-box-pack:end;-ms-flex-pack:end;-webkit-justify-content:flex-end;justify-content:flex-end;-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;-webkit-box-flex-wrap:wrap;-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;-webkit-column-gap:1rem;column-gap:1rem;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}@media screen and (min-width: 768px){.css-hemv1x{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}}@media screen and (min-width: 1024px){.css-hemv1x{display:none;}}</style><div data-paste-element="TOPBAR_ACTIONS" data-paste-core-version="20.7.0" class="css-hemv1x"><style data-emotion="css 1grha7z">.css-1grha7z{box-sizing:border-box;min-width:150px;}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1grha7z"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search" disabled=""><span class="DocSearch-Button-Container"><svg width="20" height="20" class="DocSearch-Search-Icon" viewBox="0 0 20 20" aria-hidden="true"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"></span></button></div></div><style data-emotion="css iqez3g">.css-iqez3g{box-sizing:border-box;display:none;-webkit-box-pack:start;-ms-flex-pack:start;-webkit-justify-content:flex-start;justify-content:flex-start;-webkit-box-flex-wrap:wrap;-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;-webkit-column-gap:1rem;column-gap:1rem;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}@media screen and (min-width: 768px){.css-iqez3g{display:none;}}@media screen and (min-width: 1024px){.css-iqez3g{display:none;}}@media screen and (min-width: 1385px){.css-iqez3g{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}}</style><div data-paste-element="TOPBAR_ACTIONS" data-paste-core-version="20.7.0" class="css-iqez3g"><style data-emotion="css dnwo4n">.css-dnwo4n{box-sizing:border-box;margin-bottom:0;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;overflow:hidden;}</style><nav data-paste-element="IN_PAGE_NAVIGATION" data-paste-core-version="20.7.0" aria-label="Twilio products" class="css-dnwo4n"><style data-emotion="css ts22oj">.css-ts22oj{box-sizing:border-box;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-flex-wrap:nowrap;-webkit-flex-wrap:nowrap;-ms-flex-wrap:nowrap;flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;}</style><style data-emotion="css 1ywodxz">.css-1ywodxz{overflow-x:auto;overflow-y:hidden;overflow-scrolling:touch;box-sizing:border-box;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-flex-wrap:nowrap;-webkit-flex-wrap:nowrap;-ms-flex-wrap:nowrap;flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;}@supports (-moz-appearance:none){.css-1ywodxz{padding-bottom:0px;scrollbar-width:none;}}.css-1ywodxz::-webkit-scrollbar{height:0;}.css-1ywodxz::-webkit-scrollbar-track{background:transparent;}</style><div data-paste-element="IN_PAGE_NAVIGATION_SCROLL_WRAPPER" data-paste-core-version="20.7.0" class="css-1ywodxz"><style data-emotion="css v2gylz">.css-v2gylz{box-sizing:border-box;list-style-type:none;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;-webkit-box-pack:start;-ms-flex-pack:start;-webkit-justify-content:flex-start;justify-content:flex-start;padding:0;margin:0;-webkit-column-gap:1rem;column-gap:1rem;border-bottom-width:0;border-bottom-style:none;border-bottom-color:rgb(225, 227, 234);}</style><ul data-paste-element="IN_PAGE_NAVIGATION_ITEMS" data-paste-core-version="20.7.0" class="css-v2gylz"><style data-emotion="css m5glei">.css-m5glei{box-sizing:border-box;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;min-width:0;}</style><li data-paste-element="TOPBAR_NAV_ITEM" data-paste-core-version="20.7.0" class="css-m5glei"><style data-emotion="css 1jrsz7z">.css-1jrsz7z{box-sizing:border-box;color:rgb(96, 107, 133);min-width:3rem;text-align:center;font-size:0.875rem;font-weight:500;overflow:hidden;position:relative;text-overflow:ellipsis;-webkit-transition:border-color 100ms ease,color 100ms ease;transition:border-color 100ms ease,color 100ms ease;white-space:nowrap;-webkit-text-decoration:none;text-decoration:none;width:100%;display:block;border-bottom-color:transparent;border-bottom-style:solid;border-bottom-width:1px;padding-bottom:0.75rem;padding-left:0.5rem;padding-right:0.5rem;padding-top:0.75rem;border-top-left-radius:8px;border-top-right-radius:8px;color:rgb(18, 28, 45);}.css-1jrsz7z:hover{border-bottom-color:rgb(3, 11, 93);border-left-color:rgb(3, 11, 93);color:rgb(3, 11, 93);}.css-1jrsz7z:focus{border-top-left-radius:8px;border-top-right-radius:8px;box-shadow:inset 0 0 0 1px #006dfa,inset 0 0 0 3px #cce4ff;outline:none;}</style><a data-paste-element="TOPBAR_NAV_ITEM_ANCHOR" data-paste-core-version="20.7.0" href="/docs/messaging" class="css-1jrsz7z">Messaging</a></li><li data-paste-element="TOPBAR_NAV_ITEM" data-paste-core-version="20.7.0" class="css-m5glei"><a data-paste-element="TOPBAR_NAV_ITEM_ANCHOR" data-paste-core-version="20.7.0" href="/docs/voice" class="css-1jrsz7z">Voice</a></li><li data-paste-element="TOPBAR_NAV_ITEM" data-paste-core-version="20.7.0" class="css-m5glei"><a data-paste-element="TOPBAR_NAV_ITEM_ANCHOR" data-paste-core-version="20.7.0" href="/docs/serverless" class="css-1jrsz7z">Serverless</a></li><li data-paste-element="TOPBAR_NAV_ITEM" data-paste-core-version="20.7.0" class="css-m5glei"><a data-paste-element="TOPBAR_NAV_ITEM_ANCHOR" data-paste-core-version="20.7.0" href="/docs/flex" class="css-1jrsz7z">Flex</a></li><li data-paste-element="TOPBAR_NAV_ITEM" data-paste-core-version="20.7.0" class="css-m5glei"><a data-paste-element="TOPBAR_NAV_ITEM_ANCHOR" data-paste-core-version="20.7.0" href="/docs/studio" class="css-1jrsz7z">Studio</a></li><li data-paste-element="TOPBAR_NAV_ITEM" data-paste-core-version="20.7.0" class="css-m5glei"><a data-paste-element="TOPBAR_NAV_ITEM_ANCHOR" data-paste-core-version="20.7.0" href="/docs" class="css-1jrsz7z">All docs...</a></li></ul></div></nav></div><style data-emotion="css sljj2y">.css-sljj2y{box-sizing:border-box;display:none;-webkit-box-pack:end;-ms-flex-pack:end;-webkit-justify-content:flex-end;justify-content:flex-end;-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;-webkit-box-flex-wrap:wrap;-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;-webkit-column-gap:1rem;column-gap:1rem;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}@media screen and (min-width: 768px){.css-sljj2y{display:none;}}@media screen and (min-width: 1024px){.css-sljj2y{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}}</style><div data-paste-element="TOPBAR_ACTIONS" data-paste-core-version="20.7.0" class="css-sljj2y"><nav data-paste-element="IN_PAGE_NAVIGATION" data-paste-core-version="20.7.0" aria-label="Libraries and help" class="css-dnwo4n"><div data-paste-element="IN_PAGE_NAVIGATION_SCROLL_WRAPPER" data-paste-core-version="20.7.0" class="css-1ywodxz"><ul data-paste-element="IN_PAGE_NAVIGATION_ITEMS" data-paste-core-version="20.7.0" class="css-v2gylz"><li data-paste-element="TOPBAR_NAV_ITEM" data-paste-core-version="20.7.0" class="css-m5glei"><a data-paste-element="TOPBAR_NAV_ITEM_ANCHOR" data-paste-core-version="20.7.0" href="/docs/libraries" class="css-1jrsz7z">SDKs</a></li><li data-paste-element="TOPBAR_NAV_ITEM" data-paste-core-version="20.7.0" class="css-m5glei"><a data-paste-element="TOPBAR_NAV_ITEM_ANCHOR" data-paste-core-version="20.7.0" rel="noreferrer noopener" target="_blank" href="https://help.twilio.com" class="css-1jrsz7z"><style data-emotion="css sncxrr">.css-sncxrr{box-sizing:border-box;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-sncxrr">Help<span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" viewBox="0 0 20 20" aria-labelledby="LinkExternalIcon-:Ralal6m6tasm:"><title id="LinkExternalIcon-:Ralal6m6tasm:">Help</title><path fill="currentColor" fill-rule="evenodd" d="M8.4 4.5a.5.5 0 01.5.5v.1a.5.5 0 01-.5.5H5.6v8.8h8.8v-2.8a.5.5 0 01.41-.492l.09-.008h.1a.5.5 0 01.492.41l.008.09V15a.5.5 0 01-.41.492L15 15.5H5a.5.5 0 01-.492-.41L4.5 15V5a.5.5 0 01.41-.492L5 4.5h3.4zm6.6 0a.5.5 0 01.5.5v.1l-.001.01.001 3.29a.5.5 0 01-.5.5h-.1a.5.5 0 01-.5-.5l-.001-1.935-3.967 3.967a.611.611 0 01-.78.07l-.084-.07a.611.611 0 01-.07-.78l.07-.084L13.534 5.6H11.6a.5.5 0 01-.5-.5V5a.5.5 0 01.5-.5H15z"></path></svg></span></div></a></li></ul></div></nav><style data-emotion="css inbhe0">.css-inbhe0{box-sizing:border-box;margin-left:1rem;margin-right:1rem;min-width:12rem;}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-inbhe0"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search" disabled=""><span class="DocSearch-Button-Container"><svg width="20" height="20" class="DocSearch-Search-Icon" viewBox="0 0 20 20" aria-hidden="true"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"></span></button></div><nav data-paste-element="IN_PAGE_NAVIGATION" data-paste-core-version="20.7.0" aria-label="Log in or sign up" class="css-dnwo4n"><div data-paste-element="IN_PAGE_NAVIGATION_SCROLL_WRAPPER" data-paste-core-version="20.7.0" class="css-1ywodxz"><ul data-paste-element="IN_PAGE_NAVIGATION_ITEMS" data-paste-core-version="20.7.0" class="css-v2gylz"><li data-paste-element="TOPBAR_NAV_ITEM" data-paste-core-version="20.7.0" class="css-m5glei"><a data-paste-element="TOPBAR_NAV_ITEM_ANCHOR" data-paste-core-version="20.7.0" rel="noreferrer noopener" target="_blank" href="https://www.twilio.com/login" class="css-1jrsz7z">Log in</a></li><li data-paste-element="TOPBAR_NAV_ITEM" data-paste-core-version="20.7.0" class="css-m5glei"><a data-paste-element="TOPBAR_NAV_ITEM_ANCHOR" data-paste-core-version="20.7.0" rel="noreferrer noopener" target="_blank" href="https://www.twilio.com/try-twilio" class="css-1jrsz7z">Sign up</a></li></ul></div></nav></div></div><style data-emotion="css m2wd1f">.css-m2wd1f{box-sizing:border-box;padding-top:5.75rem;padding-left:1.5rem;padding-right:1.5rem;background-color:rgb(255, 255, 255);position:relative;margin-left:auto;margin-right:auto;max-width:77rem;box-sizing:content-box;}@media screen and (min-width: 768px){.css-m2wd1f{padding-top:5.75rem;padding-left:1.5rem;padding-right:1.5rem;}}@media screen and (min-width: 1024px){.css-m2wd1f{padding-top:5.75rem;padding-left:3.25rem;padding-right:3.25rem;}}@media screen and (min-width: 1385px){.css-m2wd1f{padding-top:2.25rem;}}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" id="twilio-docs-content-area" class="css-m2wd1f"><style data-emotion="css 146sg2s">.css-146sg2s{box-sizing:border-box;display:block;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;}@media screen and (min-width: 768px){.css-146sg2s{display:block;}}@media screen and (min-width: 1024px){.css-146sg2s{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-146sg2s"><style data-emotion="css 1jcpq9j">.css-1jcpq9j{box-sizing:border-box;display:none;-webkit-order:2;-ms-flex-order:2;order:2;margin-left:4.25rem;width:18.5rem;}@media screen and (min-width: 768px){.css-1jcpq9j{display:none;}}@media screen and (min-width: 1024px){.css-1jcpq9j{display:none;}}@media screen and (min-width: 1385px){.css-1jcpq9j{display:block;}}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" id="twilio-docs-content-aside-area" class="css-1jcpq9j"><style data-emotion="css 5v6lp">.css-5v6lp{box-sizing:border-box;position:-webkit-sticky;position:sticky;top:100px;}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-5v6lp"><style data-emotion="css 1j4yy0t">.css-1j4yy0t{box-sizing:border-box;max-height:calc(100vh - 76px - 24px - 9rem);display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1j4yy0t"><style data-emotion="css 1vgbamy">.css-1vgbamy{margin:0;padding:0;color:rgb(18, 28, 45);font-size:0.875rem;line-height:1.25rem;margin-bottom:0.5rem;font-weight:600;letter-spacing:-.02em;display:block;}</style><span data-paste-element="HEADING" data-paste-core-version="20.6.0" class="css-1vgbamy">On this page</span><style data-emotion="css zs6taj">.css-zs6taj{box-sizing:border-box;overflow:auto;margin-bottom:1.75rem;-webkit-flex:auto;-ms-flex:auto;flex:auto;}</style><nav data-paste-element="BOX" data-paste-core-version="20.7.0" aria-label="document outline" class="css-zs6taj"><style data-emotion="css 15sthfg">.css-15sthfg{margin:0;padding:0;list-style:none;border-left-width:1px;border-left-style:solid;border-left-color:rgb(202, 205, 216);}</style><ul class="css-15sthfg"><style data-emotion="css 7tz84n">.css-7tz84n{display:block;margin-top:1rem;font-size:0.875rem;line-height:1.5rem;border-radius:2px;}.css-7tz84n.is-current{font-weight:600;}.css-7tz84n.is-current a{color:rgb(2, 99, 224);border-color:rgb(0, 109, 250);}.css-7tz84n:focus-within{box-shadow:0 0 0 2px #ffffff,0 0 0 3px #006dfa,0 0 0 5px #cce4ff;}</style><li class="is-current css-7tz84n"><style data-emotion="css yczov4">.css-yczov4{box-sizing:border-box;padding-left:2rem;color:rgb(96, 107, 133);-webkit-text-decoration:none;text-decoration:none;display:inline-block;width:100%;border-left-color:transparent;border-left-style:solid;border-left-width:2px;}.css-yczov4:focus{outline:none;border-left-color:rgb(3, 11, 93);color:rgb(3, 11, 93);}.css-yczov4:hover{border-left-color:rgb(3, 11, 93);color:rgb(3, 11, 93);}</style><a data-paste-element="BOX" data-paste-core-version="20.7.0" href="#create-a-studio-flow-and-a-user-prompt" class="css-yczov4">Create a Studio Flow and a user prompt</a></li><li class=" css-7tz84n"><a data-paste-element="BOX" data-paste-core-version="20.7.0" href="#create-and-host-a-function" class="css-yczov4">Create and host a Function</a></li><li class=" css-7tz84n"><a data-paste-element="BOX" data-paste-core-version="20.7.0" href="#install-dependencies-and-define-the-function-body" class="css-yczov4">Install Dependencies and define the Function body</a></li><li class=" css-7tz84n"><a data-paste-element="BOX" data-paste-core-version="20.7.0" href="#use-the-run-function-widget" class="css-yczov4">Use the Run Function widget</a></li><li class=" css-7tz84n"><a data-paste-element="BOX" data-paste-core-version="20.7.0" href="#consume-the-output-of-the-run-function-widget" class="css-yczov4">Consume the output of the Run Function widget</a></li><li class=" css-7tz84n"><a data-paste-element="BOX" data-paste-core-version="20.7.0" href="#test-it" class="css-yczov4">Test it</a></li><li class=" css-7tz84n"><a data-paste-element="BOX" data-paste-core-version="20.7.0" href="#go-further-with-loops-and-failure-flows" class="css-yczov4">Go further with loops and failure flows</a></li></ul></nav></div></div></div><style data-emotion="css 1gmyo3z">.css-1gmyo3z{position:relative;min-width:0;width:100%;word-wrap:break-word;max-width:57.5rem;}.css-1gmyo3z div+hr+section>hr{display:none;}.css-1gmyo3z div+hr+style+section>hr{display:none;}.css-1gmyo3z div+hr+hr{display:none;}</style><style data-emotion="css ykb4uo">.css-ykb4uo{box-sizing:border-box;position:relative;min-width:0;width:100%;word-wrap:break-word;max-width:57.5rem;}.css-ykb4uo div+hr+section>hr{display:none;}.css-ykb4uo div+hr+style+section>hr{display:none;}.css-ykb4uo div+hr+hr{display:none;}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-ykb4uo"><style data-emotion="css 2g10on">.css-2g10on{box-sizing:border-box;display:block;}@media screen and (min-width: 768px){.css-2g10on{display:block;}}@media screen and (min-width: 1024px){.css-2g10on{display:block;}}@media screen and (min-width: 1385px){.css-2g10on{display:none;}}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-2g10on"><style data-emotion="css 6yc7tt">.css-6yc7tt{box-sizing:border-box;display:block;position:fixed;top:76px;margin-left:-1.5rem;margin-right:-1.5rem;padding-left:1.5rem;padding-top:1.5rem;padding-bottom:1.5rem;background-color:rgb(255, 255, 255);width:-webkit-fill-available;width:-moz-available;width:fill-available;z-index:20;}</style><nav data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-6yc7tt"><style data-emotion="css zv9zrj">.css-zv9zrj{box-sizing:border-box;width:auto;-webkit-appearance:none;-moz-appearance:none;-ms-appearance:none;appearance:none;background:none;display:inline-block;border:none;outline:none;-webkit-transition:background-color 100ms ease-in,box-shadow 100ms ease-in,color 100ms ease-in;transition:background-color 100ms ease-in,box-shadow 100ms ease-in,color 100ms ease-in;font-family:inherit;font-weight:600;-webkit-text-decoration:none;text-decoration:none;position:relative;margin:0;border-radius:4px;cursor:pointer;color:rgb(18, 28, 45);background-color:rgb(255, 255, 255);box-shadow:0 0 0 1px #cacdd8;padding-top:0.5rem;padding-bottom:0.5rem;padding-left:0.75rem;padding-right:0.75rem;font-size:0.875rem;line-height:1.25rem;}.css-zv9zrj:hover{-webkit-text-decoration:none;text-decoration:none;color:rgb(2, 99, 224);background-color:rgb(255, 255, 255);box-shadow:0 0 0 1px #006dfa;}.css-zv9zrj:focus{-webkit-text-decoration:none;text-decoration:none;box-shadow:0 0 0 1px #cacdd8,0 0 0 3px #ffffff,0 0 0 4px #006dfa,0 0 0 6px #cce4ff;}.css-zv9zrj:active,.css-zv9zrj[data-active=true]{-webkit-text-decoration:none;text-decoration:none;box-shadow:0 0 0 1px #001489;color:rgb(0, 20, 137);background-color:rgb(244, 249, 255);}</style><button data-paste-element="MENU_BUTTON" data-paste-core-version="20.7.0" type="button" aria-expanded="false" aria-controls=":Rhlaatasm:" aria-haspopup="menu" aria-busy="false" class="css-zv9zrj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j">On this page<span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" viewBox="0 0 20 20" aria-labelledby="ChevronDownIcon-:R56dhlaatasm:"><path fill="currentColor" fill-rule="evenodd" d="M6.293 8.293a1 1 0 011.32-.083l.094.083L10 10.585l2.293-2.292a1 1 0 011.32-.083l.094.083a1 1 0 01.083 1.32l-.083.094-3 3a1 1 0 01-1.32.083l-.094-.083-3-3a1 1 0 010-1.414z"></path></svg></span></span></button><style data-emotion="css 31h1qt">.css-31h1qt{box-sizing:border-box;background-color:rgb(255, 255, 255);border-style:solid;border-width:1px;border-color:rgb(225, 227, 234);border-radius:8px;box-shadow:0 4px 16px 0 rgba(18, 28, 45, 0.2);max-width:18.5rem;min-width:12rem;z-index:20;padding-top:0.5rem;padding-bottom:0.5rem;overflow-y:scroll;max-height:18.5rem;}.css-31h1qt:focus{outline:none;}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" id=":Rhlaatasm:" hidden="" style="display:none;position:fixed;left:100%;top:100%" role="menu" tabindex="-1" data-dialog="true" aria-orientation="vertical" aria-label="document outline" class="css-31h1qt"><style data-emotion="css oa1jzu">.css-oa1jzu{box-sizing:border-box;-webkit-appearance:none;-moz-appearance:none;-ms-appearance:none;appearance:none;background:none;border:none;display:block;text-align:left;font-family:inherit;font-size:0.875rem;font-weight:400;line-height:1.25rem;margin:0;outline:none;padding-top:0.5rem;padding-bottom:0.5rem;border-left-style:solid;border-left-width:2px;border-color:transparent;cursor:pointer;padding-left:1.5rem;padding-right:1.5rem;width:100%;color:rgb(18, 28, 45);-webkit-text-decoration:none;text-decoration:none;color:rgb(2, 99, 224);background-color:rgb(244, 249, 255);border-color:rgb(0, 109, 250);}.css-oa1jzu:hover{color:rgb(2, 99, 224);background-color:rgb(244, 249, 255);border-color:rgb(0, 109, 250);}.css-oa1jzu:focus{color:rgb(2, 99, 224);background-color:rgb(244, 249, 255);border-color:rgb(0, 109, 250);}.css-oa1jzu:disabled,.css-oa1jzu:disabled:focus,.css-oa1jzu:disabled:hover,.css-oa1jzu[aria-disabled=true],.css-oa1jzu[aria-disabled=true]:focus,.css-oa1jzu[aria-disabled=true]:hover{color:rgb(174, 178, 193);cursor:not-allowed;background-color:rgb(255, 255, 255);border-color:transparent;}</style><a data-paste-element="MOBILE_TOC_MENU_LINK_ACTIVE" data-paste-core-version="20.7.0" href="#create-a-studio-flow-and-a-user-prompt" id=":Rhlaatasm:-1" role="menuitem" class="css-oa1jzu"><style data-emotion="css roynbj">.css-roynbj{box-sizing:border-box;}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj">Create a Studio Flow and a user prompt</div></a><style data-emotion="css rrw0kl">.css-rrw0kl{box-sizing:border-box;-webkit-appearance:none;-moz-appearance:none;-ms-appearance:none;appearance:none;background:none;border:none;display:block;text-align:left;font-family:inherit;font-size:0.875rem;font-weight:400;line-height:1.25rem;margin:0;outline:none;padding-top:0.5rem;padding-bottom:0.5rem;border-left-style:solid;border-left-width:2px;border-color:transparent;cursor:pointer;padding-left:1.5rem;padding-right:1.5rem;width:100%;color:rgb(18, 28, 45);-webkit-text-decoration:none;text-decoration:none;}.css-rrw0kl:hover{color:rgb(2, 99, 224);background-color:rgb(244, 249, 255);border-color:rgb(0, 109, 250);}.css-rrw0kl:focus{color:rgb(2, 99, 224);background-color:rgb(244, 249, 255);border-color:rgb(0, 109, 250);}.css-rrw0kl:disabled,.css-rrw0kl:disabled:focus,.css-rrw0kl:disabled:hover,.css-rrw0kl[aria-disabled=true],.css-rrw0kl[aria-disabled=true]:focus,.css-rrw0kl[aria-disabled=true]:hover{color:rgb(174, 178, 193);cursor:not-allowed;background-color:rgb(255, 255, 255);border-color:transparent;}</style><a data-paste-element="MOBILE_TOC_MENU_LINK" data-paste-core-version="20.7.0" href="#create-and-host-a-function" id=":Rhlaatasm:-2" role="menuitem" class="css-rrw0kl"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj">Create and host a Function</div></a><a data-paste-element="MOBILE_TOC_MENU_LINK" data-paste-core-version="20.7.0" href="#install-dependencies-and-define-the-function-body" id=":Rhlaatasm:-3" role="menuitem" class="css-rrw0kl"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj">Install Dependencies and define the Function body</div></a><a data-paste-element="MOBILE_TOC_MENU_LINK" data-paste-core-version="20.7.0" href="#use-the-run-function-widget" id=":Rhlaatasm:-4" role="menuitem" class="css-rrw0kl"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj">Use the Run Function widget</div></a><a data-paste-element="MOBILE_TOC_MENU_LINK" data-paste-core-version="20.7.0" href="#consume-the-output-of-the-run-function-widget" id=":Rhlaatasm:-5" role="menuitem" class="css-rrw0kl"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj">Consume the output of the Run Function widget</div></a><a data-paste-element="MOBILE_TOC_MENU_LINK" data-paste-core-version="20.7.0" href="#test-it" id=":Rhlaatasm:-6" role="menuitem" class="css-rrw0kl"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj">Test it</div></a><a data-paste-element="MOBILE_TOC_MENU_LINK" data-paste-core-version="20.7.0" href="#go-further-with-loops-and-failure-flows" id=":Rhlaatasm:-7" role="menuitem" class="css-rrw0kl"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj">Go further with loops and failure flows</div></a></div></nav></div><style data-emotion="css m8ey6p">.css-m8ey6p{box-sizing:border-box;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-webkit-justify-content:space-between;justify-content:space-between;-webkit-align-items:baseline;-webkit-box-align:baseline;-ms-flex-align:baseline;align-items:baseline;-webkit-column-gap:0.75rem;column-gap:0.75rem;}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-m8ey6p"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><style data-emotion="css 10br7e4">.css-10br7e4{margin:0;padding:0;color:rgb(18, 28, 45);font-size:2rem;line-height:2.5rem;margin-bottom:0;font-weight:600;letter-spacing:-.02em;display:block;}</style><h1 data-paste-element="HEADING" data-paste-core-version="20.6.0" class="css-10br7e4">Use the Run Function widget in Studio</h1></div><style data-emotion="css 7lkj4y">section:focus-within .css-7lkj4y,section:hover .css-7lkj4y{opacity:1;}</style><style data-emotion="css 136zex2">.css-136zex2{box-sizing:border-box;opacity:1;-webkit-transition:opacity 0.25s ease-in-out;transition:opacity 0.25s ease-in-out;}section:focus-within .css-136zex2,section:hover .css-136zex2{opacity:1;}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-136zex2"><style data-emotion="css knmi57">.css-knmi57{box-sizing:border-box;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-column-gap:0.75rem;column-gap:0.75rem;}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-knmi57"><button data-paste-element="BUTTON" data-paste-core-version="20.7.0" aria-pressed="false" type="button" aria-busy="false" class="css-1b15v5e"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" width="100%" height="100%" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" aria-labelledby="ThumbsUpIcon-:R2cqlaalaatasm:"><title id="ThumbsUpIcon-:R2cqlaalaatasm:">Positive Feedback</title><path fill="currentColor" fill-rule="evenodd" clip-rule="evenodd" d="M6.5 7.45c.194-.216.406-.451.628-.707.799-.922 1.608-1.972 1.898-2.838.314-.938 1.139-1.487 1.966-1.395a1.57 1.57 0 011.085.621c.277.363.423.85.423 1.43 0 .327-.081.645-.174.924-.062.186-.139.383-.208.56l-.088.226c-.092.245-.15.432-.166.582-.014.134.01.19.033.222l.001.001a.415.415 0 00.1.058 1.9 1.9 0 00.371.11c.32.068.725.106 1.152.124.632.026 1.237.01 1.634-.002.147-.004.265-.008.345-.008.25 0 .731.008 1.158.218.224.11.443.28.603.537.159.256.239.567.239.924 0 1.218-.524 3.647-1.553 5.695-.31.616-.693.885-1.18 1.193-.574.364-1.145.575-1.767.575h-3c-1.116 0-2.204-.418-3.002-.883a6.393 6.393 0 01-.498-.322v.372a.5.5 0 01-.5.5H3a.5.5 0 01-.5-.5V7a.5.5 0 01.5-.5h3a.5.5 0 01.5.5v.45zm3.474-3.228c.186-.554.611-.751.909-.718a.57.57 0 01.399.233c.114.15.218.409.218.824 0 .17-.044.37-.123.61a9.287 9.287 0 01-.177.474c-.034.087-.07.177-.105.273-.095.252-.194.542-.225.827-.032.297.005.636.23.935.135.178.322.291.491.367.175.078.372.134.571.176.4.084.869.125 1.317.144.676.028 1.382.008 1.767-.003.118-.003.206-.006.254-.006.25 0 .519.018.717.115.088.044.15.098.194.168.044.07.089.19.089.396 0 1.04-.476 3.316-1.447 5.246-.184.367-.375.516-.82.797-.468.296-.855.42-1.233.42h-3c-.884 0-1.796-.338-2.498-.747a4.464 4.464 0 01-.813-.591 1.36 1.36 0 01-.184-.207l-.005-.008V8.968a7.331 7.331 0 01.329-.39l.308-.343c.223-.246.483-.534.746-.837.788-.909 1.73-2.097 2.091-3.176zM5.5 7.5h-2v7.667h2V7.5z"></path></svg></span></span></button><button data-paste-element="BUTTON" data-paste-core-version="20.7.0" aria-pressed="false" type="button" aria-busy="false" class="css-1b15v5e"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" width="100%" height="100%" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" aria-labelledby="ThumbsDownIcon-:R2dalaalaatasm:"><title id="ThumbsDownIcon-:R2dalaalaatasm:">Negative Feedback</title><path fill="currentColor" fill-rule="evenodd" clip-rule="evenodd" d="M13.5 12.55c-.194.215-.406.451-.628.707-.799.921-1.608 1.972-1.898 2.838-.314.938-1.139 1.487-1.966 1.395a1.57 1.57 0 01-1.085-.621c-.277-.363-.423-.85-.423-1.43 0-.327.081-.645.174-.924.062-.186.139-.383.208-.56l.088-.226c.092-.245.15-.432.166-.582.014-.134-.01-.19-.033-.222l-.001-.001a.416.416 0 00-.1-.058 1.902 1.902 0 00-.371-.11 7.35 7.35 0 00-1.152-.124 22.958 22.958 0 00-1.634.002 14.2 14.2 0 01-.345.008c-.25 0-.731-.008-1.158-.218a1.451 1.451 0 01-.603-.537c-.159-.257-.239-.567-.239-.924 0-1.218.524-3.648 1.553-5.696.31-.616.693-.884 1.18-1.192C5.807 3.71 6.378 3.5 7 3.5h3c1.116 0 2.204.417 3.002.883.178.104.345.212.498.321v-.37a.5.5 0 01.5-.5h3a.5.5 0 01.5.5V13a.5.5 0 01-.5.5h-3a.5.5 0 01-.5-.5v-.45zm-3.474 3.227c-.186.554-.611.752-.909.72a.571.571 0 01-.399-.234c-.114-.15-.218-.409-.218-.824a2 2 0 01.123-.61c.054-.16.113-.312.177-.475.034-.086.07-.176.105-.272.095-.252.194-.542.225-.828.032-.296-.005-.635-.23-.934a1.23 1.23 0 00-.491-.367 2.874 2.874 0 00-.571-.176 8.31 8.31 0 00-1.317-.144c-.676-.029-1.381-.008-1.767.003-.118.003-.206.006-.254.006-.25 0-.519-.018-.717-.115a.452.452 0 01-.194-.168c-.044-.07-.089-.19-.089-.396 0-1.04.476-3.316 1.447-5.247.184-.366.375-.515.82-.796.468-.296.855-.42 1.233-.42h3c.884 0 1.796.337 2.498.747.349.203.628.414.813.59.093.09.152.16.184.208l.005.007v4.98a7.245 7.245 0 01-.329.39 54.1 54.1 0 01-.308.342c-.223.247-.483.534-.746.838-.788.909-1.73 2.096-2.091 3.175zM14.5 12.5h2V4.833h-2V12.5z"></path></svg></span></span></button></div></div></div><style data-emotion="css 1y5brhz">.css-1y5brhz{box-sizing:border-box;margin:0;margin-bottom:2.25rem;margin-top:2.25rem;border-width:0;border-color:rgb(225, 227, 234);border-style:solid;border-bottom-width:1px;width:auto;}</style><hr data-paste-element="SEPARATOR" data-paste-core-version="20.7.0" aria-orientation="horizontal" class="css-1y5brhz"/><style data-emotion="css tcah8o">.css-tcah8o{margin:0;padding:0;color:rgb(18, 28, 45);font-size:0.875rem;line-height:1.5rem;font-weight:400;margin-bottom:1.5rem;}</style><p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o">With their lightweight nature and ability to execute JavaScript, Functions are an excellent companion to <a data-paste-element="ANCHOR" data-paste-core-version="20.7.0" href="/docs/studio" title="Studio Flows" class="css-lpeit6">Studio Flows</a>. Whether you need to gather some data from an API or run any other custom code to fit your business logic, Functions help to fill in the gaps in your application that existing <a data-paste-element="ANCHOR" data-paste-core-version="20.7.0" href="/docs/studio/widget-library" title="Studio widgets" class="css-lpeit6">Studio widgets</a> may not cover.</p> <p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o">In order to ease the integration of Functions into your Studio Flows, Studio provides the <a data-paste-element="ANCHOR" data-paste-core-version="20.7.0" href="/docs/studio/widget-library/run-function" title="Run Function" class="css-lpeit6">Run Function</a> widget. This widget, as the name implies, allows you to run a Twilio Function; you may pass in any desired parameters, and leverage any generated values later on in your Studio Flow.</p> <p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o">To test this out we'll create a Studio Flow that accepts incoming text messages, prompts the user for their desired dog breed, and returns an MMS containing some text and an image of their requested breed (assuming they provided a valid breed). The finished flow would look like this:</p> <style data-emotion="css 1cxfq70">.css-1cxfq70{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;margin-bottom:1.5rem;}li .css-1cxfq70{margin-top:1.5rem;}.css-1cxfq70 div{display:inline-block;position:relative;margin:auto;max-width:100%;height:auto;}.css-1cxfq70 div:hover button{opacity:1;}.css-1cxfq70 div img{display:block;margin:auto;max-width:100%;max-height:31.5rem;height:auto;object-fit:contain;border-radius:4px;cursor:-webkit-zoom-in;cursor:zoom-in;}.css-1cxfq70 div button{opacity:0;position:absolute;top:1rem;right:1rem;-webkit-transition:opacity .2s ease-in-out;transition:opacity .2s ease-in-out;}.css-1cxfq70 div button:focus,.css-1cxfq70 div button:hover{opacity:1;}</style><style data-emotion="css wszb6a">.css-wszb6a{box-sizing:border-box;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;margin-bottom:1.5rem;}li .css-wszb6a{margin-top:1.5rem;}.css-wszb6a div{display:inline-block;position:relative;margin:auto;max-width:100%;height:auto;}.css-wszb6a div:hover button{opacity:1;}.css-wszb6a div img{display:block;margin:auto;max-width:100%;max-height:31.5rem;height:auto;object-fit:contain;border-radius:4px;cursor:-webkit-zoom-in;cursor:zoom-in;}.css-wszb6a div button{opacity:0;position:absolute;top:1rem;right:1rem;-webkit-transition:opacity .2s ease-in-out;transition:opacity .2s ease-in-out;}.css-wszb6a div button:focus,.css-wszb6a div button:hover{opacity:1;}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-wszb6a"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><img alt="Completed Studio Flow for Run Function example." loading="lazy" width="1600" height="833" decoding="async" data-nimg="1" style="color:transparent;background-size:cover;background-position:50% 50%;background-repeat:no-repeat;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1600 833'%3E%3Cfilter id='b' color-interpolation-filters='sRGB'%3E%3CfeGaussianBlur stdDeviation='20'/%3E%3CfeColorMatrix values='1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 100 -1' result='s'/%3E%3CfeFlood x='0' y='0' width='100%25' height='100%25'/%3E%3CfeComposite operator='out' in='s'/%3E%3CfeComposite in2='SourceGraphic'/%3E%3CfeGaussianBlur stdDeviation='20'/%3E%3C/filter%3E%3Cimage width='100%25' height='100%25' x='0' y='0' preserveAspectRatio='none' style='filter: url(%23b);' href='data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAACCAYAAAB/qH1jAAAACXBIWXMAABYlAAAWJQFJUiTwAAAALUlEQVR4nAEiAN3/AC0jJf9dXFz/d318/5GPkf8ASEhI/5eYmv/g4eT/xMXG/yarFDn8jkPjAAAAAElFTkSuQmCC'/%3E%3C/svg%3E")" srcSet="/_next/image?url=https%3A%2F%2Fdocs-assets.prod.twilio.com%2Ffb6cbf887eec54bc01fa2777ec6bf5fe7c3d1f9e3732f00191103246ef5741fa.png&w=1920&q=75&dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe 1x, /_next/image?url=https%3A%2F%2Fdocs-assets.prod.twilio.com%2Ffb6cbf887eec54bc01fa2777ec6bf5fe7c3d1f9e3732f00191103246ef5741fa.png&w=3840&q=75&dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe 2x" src="/_next/image?url=https%3A%2F%2Fdocs-assets.prod.twilio.com%2Ffb6cbf887eec54bc01fa2777ec6bf5fe7c3d1f9e3732f00191103246ef5741fa.png&w=3840&q=75&dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe"/><button data-paste-element="BUTTON" data-paste-core-version="20.7.0" type="button" aria-busy="false" class="css-zv9zrj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" fill="none" viewBox="0 0 20 20" aria-labelledby="ZoomInIcon-:Rpla9slaatasm:"><path fill="currentColor" d="M5.5 8a.5.5 0 000 1H8v2.5a.5.5 0 101 0V9h2.5a.5.5 0 000-1H9V5.5a.5.5 0 00-1 0V8H5.5z"></path><path fill="currentColor" fill-rule="evenodd" d="M12.8 13.507a6.543 6.543 0 01-10.303-7.47 6.542 6.542 0 1111.01 6.762l4.347 4.347a.5.5 0 11-.708.707l-4.345-4.346zM5.464 3.933a5.542 5.542 0 016.997 8.526l-.014.015a5.543 5.543 0 11-6.983-8.54z" clip-rule="evenodd"></path></svg></span>Expand image</span></button></div></div> <section id="create-a-studio-flow-and-a-user-prompt-section-indexable"><hr data-paste-element="SEPARATOR" data-paste-core-version="20.7.0" aria-orientation="horizontal" class="css-1y5brhz"/><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-m8ey6p"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><style data-emotion="css gt12nx">.css-gt12nx{box-sizing:border-box;-webkit-align-items:start;-webkit-box-align:start;-ms-flex-align:start;align-items:start;margin-bottom:1.25rem;}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-gt12nx"><style data-emotion="css 16k5vxt">.css-16k5vxt{margin:0;padding:0;color:rgb(18, 28, 45);font-size:1.5rem;line-height:2rem;margin-bottom:0;font-weight:600;letter-spacing:-.02em;display:inline;}</style><h2 data-paste-element="HEADING" data-paste-core-version="20.6.0" id="create-a-studio-flow-and-a-user-prompt" class="css-16k5vxt">Create a Studio Flow and a user prompt</h2><style data-emotion="css f02h4i">.css-f02h4i{box-sizing:border-box;margin-bottom:0;-webkit-text-decoration:none;text-decoration:none;margin-left:0.5rem;color:rgb(96, 107, 133);border-radius:2px;outline:none;display:inline-block;vertical-align:text-bottom;}.css-f02h4i:hover{color:rgb(3, 11, 93);}.css-f02h4i:focus{box-shadow:0 0 0 2px #ffffff,0 0 0 3px #006dfa,0 0 0 5px #cce4ff;color:rgb(3, 11, 93);}</style><a data-paste-element="BOX" data-paste-core-version="20.7.0" href="#create-a-studio-flow-and-a-user-prompt" class="css-f02h4i"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" fill="none" viewBox="0 0 20 20" aria-labelledby="LinkIcon-:Rl9kaclaatasm:"><title id="LinkIcon-:Rl9kaclaatasm:">create-a-studio-flow-and-a-user-prompt page anchor</title><path fill="currentColor" d="M13.074 5.674a2.3 2.3 0 013.252 3.252l-2.97 2.97A2.3 2.3 0 019.869 8.92a.5.5 0 10-.808-.588 3.3 3.3 0 005.004 4.272l2.97-2.97a3.3 3.3 0 00-4.667-4.666l-.467.466a.5.5 0 10.707.707l.467-.466z"></path><path fill="currentColor" d="M9.18 7.163a2.3 2.3 0 011.952 3.65.5.5 0 10.809.59A3.3 3.3 0 006.936 7.13l-2.97 2.97a3.3 3.3 0 004.667 4.667l.58-.58a.5.5 0 10-.707-.707l-.58.58a2.3 2.3 0 11-3.252-3.252l2.97-2.97c.409-.41.958-.652 1.536-.675z"></path></svg></span></a></div></div><style data-emotion="css 1kam78h">.css-1kam78h{box-sizing:border-box;opacity:0;-webkit-transition:opacity 0.25s ease-in-out;transition:opacity 0.25s ease-in-out;}section:focus-within .css-1kam78h,section:hover .css-1kam78h{opacity:1;}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1kam78h"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-knmi57"><button data-paste-element="BUTTON" data-paste-core-version="20.7.0" aria-pressed="false" type="button" aria-busy="false" class="css-1b15v5e"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" width="100%" height="100%" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" aria-labelledby="ThumbsUpIcon-:R4plakaclaatasm:"><title id="ThumbsUpIcon-:R4plakaclaatasm:">Positive Feedback</title><path fill="currentColor" fill-rule="evenodd" clip-rule="evenodd" d="M6.5 7.45c.194-.216.406-.451.628-.707.799-.922 1.608-1.972 1.898-2.838.314-.938 1.139-1.487 1.966-1.395a1.57 1.57 0 011.085.621c.277.363.423.85.423 1.43 0 .327-.081.645-.174.924-.062.186-.139.383-.208.56l-.088.226c-.092.245-.15.432-.166.582-.014.134.01.19.033.222l.001.001a.415.415 0 00.1.058 1.9 1.9 0 00.371.11c.32.068.725.106 1.152.124.632.026 1.237.01 1.634-.002.147-.004.265-.008.345-.008.25 0 .731.008 1.158.218.224.11.443.28.603.537.159.256.239.567.239.924 0 1.218-.524 3.647-1.553 5.695-.31.616-.693.885-1.18 1.193-.574.364-1.145.575-1.767.575h-3c-1.116 0-2.204-.418-3.002-.883a6.393 6.393 0 01-.498-.322v.372a.5.5 0 01-.5.5H3a.5.5 0 01-.5-.5V7a.5.5 0 01.5-.5h3a.5.5 0 01.5.5v.45zm3.474-3.228c.186-.554.611-.751.909-.718a.57.57 0 01.399.233c.114.15.218.409.218.824 0 .17-.044.37-.123.61a9.287 9.287 0 01-.177.474c-.034.087-.07.177-.105.273-.095.252-.194.542-.225.827-.032.297.005.636.23.935.135.178.322.291.491.367.175.078.372.134.571.176.4.084.869.125 1.317.144.676.028 1.382.008 1.767-.003.118-.003.206-.006.254-.006.25 0 .519.018.717.115.088.044.15.098.194.168.044.07.089.19.089.396 0 1.04-.476 3.316-1.447 5.246-.184.367-.375.516-.82.797-.468.296-.855.42-1.233.42h-3c-.884 0-1.796-.338-2.498-.747a4.464 4.464 0 01-.813-.591 1.36 1.36 0 01-.184-.207l-.005-.008V8.968a7.331 7.331 0 01.329-.39l.308-.343c.223-.246.483-.534.746-.837.788-.909 1.73-2.097 2.091-3.176zM5.5 7.5h-2v7.667h2V7.5z"></path></svg></span></span></button><button data-paste-element="BUTTON" data-paste-core-version="20.7.0" aria-pressed="false" type="button" aria-busy="false" class="css-1b15v5e"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" width="100%" height="100%" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" aria-labelledby="ThumbsDownIcon-:R4qlakaclaatasm:"><title id="ThumbsDownIcon-:R4qlakaclaatasm:">Negative Feedback</title><path fill="currentColor" fill-rule="evenodd" clip-rule="evenodd" d="M13.5 12.55c-.194.215-.406.451-.628.707-.799.921-1.608 1.972-1.898 2.838-.314.938-1.139 1.487-1.966 1.395a1.57 1.57 0 01-1.085-.621c-.277-.363-.423-.85-.423-1.43 0-.327.081-.645.174-.924.062-.186.139-.383.208-.56l.088-.226c.092-.245.15-.432.166-.582.014-.134-.01-.19-.033-.222l-.001-.001a.416.416 0 00-.1-.058 1.902 1.902 0 00-.371-.11 7.35 7.35 0 00-1.152-.124 22.958 22.958 0 00-1.634.002 14.2 14.2 0 01-.345.008c-.25 0-.731-.008-1.158-.218a1.451 1.451 0 01-.603-.537c-.159-.257-.239-.567-.239-.924 0-1.218.524-3.648 1.553-5.696.31-.616.693-.884 1.18-1.192C5.807 3.71 6.378 3.5 7 3.5h3c1.116 0 2.204.417 3.002.883.178.104.345.212.498.321v-.37a.5.5 0 01.5-.5h3a.5.5 0 01.5.5V13a.5.5 0 01-.5.5h-3a.5.5 0 01-.5-.5v-.45zm-3.474 3.227c-.186.554-.611.752-.909.72a.571.571 0 01-.399-.234c-.114-.15-.218-.409-.218-.824a2 2 0 01.123-.61c.054-.16.113-.312.177-.475.034-.086.07-.176.105-.272.095-.252.194-.542.225-.828.032-.296-.005-.635-.23-.934a1.23 1.23 0 00-.491-.367 2.874 2.874 0 00-.571-.176 8.31 8.31 0 00-1.317-.144c-.676-.029-1.381-.008-1.767.003-.118.003-.206.006-.254.006-.25 0-.519-.018-.717-.115a.452.452 0 01-.194-.168c-.044-.07-.089-.19-.089-.396 0-1.04.476-3.316 1.447-5.247.184-.366.375-.515.82-.796.468-.296.855-.42 1.233-.42h3c.884 0 1.796.337 2.498.747.349.203.628.414.813.59.093.09.152.16.184.208l.005.007v4.98a7.245 7.245 0 01-.329.39 54.1 54.1 0 01-.308.342c-.223.247-.483.534-.746.838-.788.909-1.73 2.096-2.091 3.175zM14.5 12.5h2V4.833h-2V12.5z"></path></svg></span></span></button></div></div></div><p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o">If you haven't created a Flow before, we suggest following the <a data-paste-element="ANCHOR" data-paste-core-version="20.7.0" href="/docs/studio/tutorials/how-to-build-a-chatbot#create-your-flow" title="Create Your Flow" class="css-lpeit6">Create Your Flow</a> steps in the chatbot tutorial to get one established.</p><p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o">Once you are inside of your newly created Studio Flow, create the prompt for dog breed by dragging a <a data-paste-element="ANCHOR" data-paste-core-version="20.7.0" href="/docs/studio/widget-library/send-wait-reply" title="Send & Wait For Reply" class="css-lpeit6">Send & Wait For Reply</a> widget onto the Studio canvas. Name it and provide some text to prompt the user; the text can be anything you'd like for this example, something along the general lines of "which dog breed would you like to see?"</p><p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o">Here, we'll name the widget <style data-emotion="css 1kwd7zr">.css-1kwd7zr{box-sizing:border-box;border-width:1px;border-style:solid;border-radius:4px;font-family:'TwilioSansMono',Courier,monospace;font-size:inherit;line-height:inherit;padding-left:0.25rem;padding-right:0.25rem;color:inherit;background-color:rgb(249, 249, 250);border-color:rgb(202, 205, 216);}</style><code data-paste-element="INLINE_CODE" data-paste-core-version="20.7.0" class="css-1kwd7zr">request-breed</code>, and provide the following prompt:</p><style data-emotion="css slcqjs">.css-slcqjs{box-sizing:border-box;margin-bottom:1.5rem;}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-slcqjs"><style data-emotion="css 1ft5k6i">.css-1ft5k6i{box-sizing:border-box;background-color:rgb(31, 48, 76);border-radius:4px;overflow:hidden;}</style><div data-paste-element="CODE_BLOCK_WRAPPER" data-paste-core-version="20.7.0" class="css-1ft5k6i"><style data-emotion="css 1d8ad8q">.css-1d8ad8q{box-sizing:border-box;background-color:rgb(18, 28, 45);display:grid;grid-template-columns:1fr auto;grid-template-areas:"code-block button-group";-webkit-column-gap:0.75rem;column-gap:0.75rem;border-radius:4px;padding-top:1.25rem;padding-bottom:1.25rem;}</style><div data-paste-element="CODE_BLOCK" data-paste-core-version="20.7.0" class="css-1d8ad8q"><style data-emotion="css 1gqdom6">.css-1gqdom6{box-sizing:border-box;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-column-gap:0.75rem;column-gap:0.75rem;grid-area:button-group;padding-right:1.5rem;}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1gqdom6"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><style data-emotion="css 11aawc9">.css-11aawc9{box-sizing:border-box;width:auto;-webkit-appearance:none;-moz-appearance:none;-ms-appearance:none;appearance:none;background:none;display:inline-block;border:none;outline:none;-webkit-transition:background-color 100ms ease-in,box-shadow 100ms ease-in,color 100ms ease-in;transition:background-color 100ms ease-in,box-shadow 100ms ease-in,color 100ms ease-in;font-family:inherit;font-weight:600;-webkit-text-decoration:none;text-decoration:none;position:relative;margin:0;border-radius:4px;cursor:pointer;color:rgb(255, 255, 255);background-color:rgb(18, 28, 45);box-shadow:0 0 0 1px #394762;padding:0.25rem;}.css-11aawc9:hover{-webkit-text-decoration:none;text-decoration:none;color:rgb(255, 255, 255);background-color:rgb(31, 48, 76);box-shadow:0 0 0 1px #f4f4f6;}.css-11aawc9:focus{-webkit-text-decoration:none;text-decoration:none;box-shadow:0 0 0 1px #394762,0 0 0 3px #121c2d,0 0 0 4px #ffffff,0 0 0 6px rgba(255, 255, 255, 0.2);}.css-11aawc9:active,.css-11aawc9[data-active=true]{-webkit-text-decoration:none;text-decoration:none;box-shadow:0 0 0 1px #ffffff;color:rgb(255, 255, 255);background-color:rgb(31, 48, 76);}</style><button data-paste-element="CODE_BLOCK_COPY_BUTTON" data-paste-core-version="20.7.0" type="button" tabindex="0" aria-describedby=":Rj6laclaatasm:" aria-busy="false" class="css-11aawc9"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" viewBox="0 0 20 20" aria-labelledby="CopyIcon-:R39jj6laclaatasm:"><path fill="currentColor" fill-rule="evenodd" d="M13.469 2.5c.63 0 1.15.48 1.212 1.094l.007.125-.001 1.593h1.407c.73 0 1.331.558 1.4 1.271l.006.136v9.375c0 .776-.63 1.406-1.406 1.406H6.719c-.777 0-1.407-.63-1.407-1.406v-1.407H3.719c-.631 0-1.15-.48-1.213-1.094L2.5 13.47v-9.75c0-.631.48-1.15 1.094-1.213L3.72 2.5h9.75zm2.625 3.75H6.719a.469.469 0 00-.469.469v9.375c0 .259.21.468.469.468h9.375c.259 0 .468-.21.468-.468V6.719a.469.469 0 00-.468-.469zm-2.625-2.813h-9.75a.281.281 0 00-.274.217l-.007.065v9.75c0 .133.092.244.216.274l.065.007 1.593-.001v-7.03c0-.731.558-1.332 1.271-1.4l.136-.006 7.031-.001V3.719a.281.281 0 00-.217-.274l-.064-.007z"></path></svg></span><span data-paste-element="BOX" data-paste-core-version="20.7.0" aria-live="polite" class="css-roynbj"><style data-emotion="css 1cbdvo6">.css-1cbdvo6{box-sizing:border-box;border:none;clip:rect(0 0 0 0);height:1px;margin:-0.125rem;overflow:hidden;padding:0;position:absolute;text-transform:none;white-space:nowrap;width:1px;}</style><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1cbdvo6">Copy code block</span></span></span></span></button></div></div><style data-emotion="css 1f9wiu0">.css-1f9wiu0{box-sizing:border-box;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;overflow-x:auto;grid-area:code-block;padding-left:1.5rem;}</style><div data-paste-element="CODE_BLOCK_CONTENT" data-paste-core-version="20.7.0" class="css-1f9wiu0"><style data-emotion="css 1p78m0">.css-1p78m0{display:grid;}.css-1p78m0:focus{outline:none;box-shadow:inset 0 0 0 1px #006dfa,inset 0 0 0 3px #cce4ff;border-radius:4px;}</style><pre data-theme="github-dark" data-lang="shellscript" style="color:white;font-family:'TwilioSansMono', Courier, monospace;text-align:left;white-space:pre;word-spacing:normal;word-break:normal;word-wrap:normal;line-height:1.5;font-size:1em;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-hyphens:none;-moz-hyphens:none;-ms-hyphens:none;hyphens:none;margin:0;overflow:auto;background:inherit;width:100%" tabindex="0" class="css-1p78m0" data-ch="true"><div style="min-width:fit-content"><div><span style="color:#FFA657">Hello!</span> <span style="color:#A5D6FF">Please respond with your requested dog breed to receive a photo! 🐶</span></div></div></pre></div></div></div></div><p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o">Before we can proceed any further, we must first create the Function that we'll be calling in the next step of the Flow.</p></section> <section id="create-and-host-a-function-section-indexable"><hr data-paste-element="SEPARATOR" data-paste-core-version="20.7.0" aria-orientation="horizontal" class="css-1y5brhz"/><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-m8ey6p"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-gt12nx"><h2 data-paste-element="HEADING" data-paste-core-version="20.6.0" id="create-and-host-a-function" class="css-16k5vxt">Create and host a Function</h2><a data-paste-element="BOX" data-paste-core-version="20.7.0" href="#create-and-host-a-function" class="css-f02h4i"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" fill="none" viewBox="0 0 20 20" aria-labelledby="LinkIcon-:Rl9kaslaatasm:"><title id="LinkIcon-:Rl9kaslaatasm:">create-and-host-a-function page anchor</title><path fill="currentColor" d="M13.074 5.674a2.3 2.3 0 013.252 3.252l-2.97 2.97A2.3 2.3 0 019.869 8.92a.5.5 0 10-.808-.588 3.3 3.3 0 005.004 4.272l2.97-2.97a3.3 3.3 0 00-4.667-4.666l-.467.466a.5.5 0 10.707.707l.467-.466z"></path><path fill="currentColor" d="M9.18 7.163a2.3 2.3 0 011.952 3.65.5.5 0 10.809.59A3.3 3.3 0 006.936 7.13l-2.97 2.97a3.3 3.3 0 004.667 4.667l.58-.58a.5.5 0 10-.707-.707l-.58.58a2.3 2.3 0 11-3.252-3.252l2.97-2.97c.409-.41.958-.652 1.536-.675z"></path></svg></span></a></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1kam78h"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-knmi57"><button data-paste-element="BUTTON" data-paste-core-version="20.7.0" aria-pressed="false" type="button" aria-busy="false" class="css-1b15v5e"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" width="100%" height="100%" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" aria-labelledby="ThumbsUpIcon-:R4plakaslaatasm:"><title id="ThumbsUpIcon-:R4plakaslaatasm:">Positive Feedback</title><path fill="currentColor" fill-rule="evenodd" clip-rule="evenodd" d="M6.5 7.45c.194-.216.406-.451.628-.707.799-.922 1.608-1.972 1.898-2.838.314-.938 1.139-1.487 1.966-1.395a1.57 1.57 0 011.085.621c.277.363.423.85.423 1.43 0 .327-.081.645-.174.924-.062.186-.139.383-.208.56l-.088.226c-.092.245-.15.432-.166.582-.014.134.01.19.033.222l.001.001a.415.415 0 00.1.058 1.9 1.9 0 00.371.11c.32.068.725.106 1.152.124.632.026 1.237.01 1.634-.002.147-.004.265-.008.345-.008.25 0 .731.008 1.158.218.224.11.443.28.603.537.159.256.239.567.239.924 0 1.218-.524 3.647-1.553 5.695-.31.616-.693.885-1.18 1.193-.574.364-1.145.575-1.767.575h-3c-1.116 0-2.204-.418-3.002-.883a6.393 6.393 0 01-.498-.322v.372a.5.5 0 01-.5.5H3a.5.5 0 01-.5-.5V7a.5.5 0 01.5-.5h3a.5.5 0 01.5.5v.45zm3.474-3.228c.186-.554.611-.751.909-.718a.57.57 0 01.399.233c.114.15.218.409.218.824 0 .17-.044.37-.123.61a9.287 9.287 0 01-.177.474c-.034.087-.07.177-.105.273-.095.252-.194.542-.225.827-.032.297.005.636.23.935.135.178.322.291.491.367.175.078.372.134.571.176.4.084.869.125 1.317.144.676.028 1.382.008 1.767-.003.118-.003.206-.006.254-.006.25 0 .519.018.717.115.088.044.15.098.194.168.044.07.089.19.089.396 0 1.04-.476 3.316-1.447 5.246-.184.367-.375.516-.82.797-.468.296-.855.42-1.233.42h-3c-.884 0-1.796-.338-2.498-.747a4.464 4.464 0 01-.813-.591 1.36 1.36 0 01-.184-.207l-.005-.008V8.968a7.331 7.331 0 01.329-.39l.308-.343c.223-.246.483-.534.746-.837.788-.909 1.73-2.097 2.091-3.176zM5.5 7.5h-2v7.667h2V7.5z"></path></svg></span></span></button><button data-paste-element="BUTTON" data-paste-core-version="20.7.0" aria-pressed="false" type="button" aria-busy="false" class="css-1b15v5e"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" width="100%" height="100%" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" aria-labelledby="ThumbsDownIcon-:R4qlakaslaatasm:"><title id="ThumbsDownIcon-:R4qlakaslaatasm:">Negative Feedback</title><path fill="currentColor" fill-rule="evenodd" clip-rule="evenodd" d="M13.5 12.55c-.194.215-.406.451-.628.707-.799.921-1.608 1.972-1.898 2.838-.314.938-1.139 1.487-1.966 1.395a1.57 1.57 0 01-1.085-.621c-.277-.363-.423-.85-.423-1.43 0-.327.081-.645.174-.924.062-.186.139-.383.208-.56l.088-.226c.092-.245.15-.432.166-.582.014-.134-.01-.19-.033-.222l-.001-.001a.416.416 0 00-.1-.058 1.902 1.902 0 00-.371-.11 7.35 7.35 0 00-1.152-.124 22.958 22.958 0 00-1.634.002 14.2 14.2 0 01-.345.008c-.25 0-.731-.008-1.158-.218a1.451 1.451 0 01-.603-.537c-.159-.257-.239-.567-.239-.924 0-1.218.524-3.648 1.553-5.696.31-.616.693-.884 1.18-1.192C5.807 3.71 6.378 3.5 7 3.5h3c1.116 0 2.204.417 3.002.883.178.104.345.212.498.321v-.37a.5.5 0 01.5-.5h3a.5.5 0 01.5.5V13a.5.5 0 01-.5.5h-3a.5.5 0 01-.5-.5v-.45zm-3.474 3.227c-.186.554-.611.752-.909.72a.571.571 0 01-.399-.234c-.114-.15-.218-.409-.218-.824a2 2 0 01.123-.61c.054-.16.113-.312.177-.475.034-.086.07-.176.105-.272.095-.252.194-.542.225-.828.032-.296-.005-.635-.23-.934a1.23 1.23 0 00-.491-.367 2.874 2.874 0 00-.571-.176 8.31 8.31 0 00-1.317-.144c-.676-.029-1.381-.008-1.767.003-.118.003-.206.006-.254.006-.25 0-.519-.018-.717-.115a.452.452 0 01-.194-.168c-.044-.07-.089-.19-.089-.396 0-1.04.476-3.316 1.447-5.247.184-.366.375-.515.82-.796.468-.296.855-.42 1.233-.42h3c.884 0 1.796.337 2.498.747.349.203.628.414.813.59.093.09.152.16.184.208l.005.007v4.98a7.245 7.245 0 01-.329.39 54.1 54.1 0 01-.308.342c-.223.247-.483.534-.746.838-.788.909-1.73 2.096-2.091 3.175zM14.5 12.5h2V4.833h-2V12.5z"></path></svg></span></span></button></div></div></div><p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o">In order to run any of the following examples, you will first need to create a Function into which you can paste the example code. You can create a Function using the Twilio Console or the <a data-paste-element="ANCHOR" data-paste-core-version="20.7.0" href="/docs/labs/serverless-toolkit" title="Serverless Toolkit" class="css-lpeit6">Serverless Toolkit</a> as explained below:</p><style data-emotion="css 1c932a7">.css-1c932a7{box-sizing:border-box;border-color:rgb(225, 227, 234);border-radius:8px;border-style:solid;border-width:1px;margin-top:1.5rem;margin-bottom:1.5rem;padding:1.5rem;word-wrap:break-word;}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1c932a7"><div data-paste-element="HORIZONTAL_TABS" data-paste-core-version="20.7.0" class="css-roynbj"><div data-paste-element="HORIZONTAL_TAB_LIST" data-paste-core-version="20.7.0" id=":Rqslaatasm:" role="tablist" aria-orientation="horizontal" aria-label="Horizontal tabs" class="css-roynbj"><style data-emotion="css wzm7m4">.css-wzm7m4{box-sizing:border-box;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;overflow:hidden;}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-wzm7m4"><style data-emotion="css 40sddq">.css-40sddq{box-sizing:border-box;-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;}</style><style data-emotion="css slwaeo">.css-slwaeo{overflow-x:auto;overflow-y:hidden;overflow-scrolling:touch;box-sizing:border-box;-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;}@supports (-moz-appearance:none){.css-slwaeo{padding-bottom:0px;scrollbar-width:none;}}.css-slwaeo::-webkit-scrollbar{height:0;}.css-slwaeo::-webkit-scrollbar-track{background:transparent;}</style><div data-paste-element="HORIZONTAL_TAB_LIST_CHILD_SCROLL_WRAPPER" data-paste-core-version="20.7.0" class="css-slwaeo"><style data-emotion="css gvu2mx">.css-gvu2mx{box-sizing:border-box;position:relative;white-space:nowrap;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-column-gap:0.25rem;column-gap:0.25rem;padding-top:1px;box-shadow:inset 0 -1px 0 0 #cacdd8;width:auto;}</style><div data-paste-element="HORIZONTAL_TAB_LIST_CHILD" data-paste-core-version="20.7.0" class="css-gvu2mx"><style data-emotion="css v2ak9">.css-v2ak9{box-sizing:border-box;color:rgb(96, 107, 133);border-color:transparent;border-style:solid;border-width:1px;border-bottom-width:2px;border-top-left-radius:8px;border-top-right-radius:8px;display:inline-block;min-width:-webkit-fit-content;min-width:-moz-fit-content;min-width:fit-content;padding-top:0.5rem;padding-bottom:0.5rem;padding-left:1rem;padding-right:1rem;text-align:center;bottom:-1px;cursor:pointer;font-size:0.875rem;line-height:1.25rem;font-weight:500;overflow:hidden;position:relative;text-overflow:ellipsis;-webkit-transition:border-color 100ms ease,color 100ms ease;transition:border-color 100ms ease,color 100ms ease;white-space:nowrap;}.css-v2ak9[aria-selected=true]{border-color:rgb(202, 205, 216);border-bottom-color:rgb(255, 255, 255);color:rgb(2, 99, 224);box-shadow:0 -1px 0 #006dfa;background-color:rgb(255, 255, 255);}.css-v2ak9:disabled,.css-v2ak9:disabled:focus,.css-v2ak9:disabled:hover,.css-v2ak9[aria-disabled=true],.css-v2ak9[aria-disabled=true]:focus,.css-v2ak9[aria-disabled=true]:hover{border-bottom-color:transparent;color:rgb(174, 178, 193);}.css-v2ak9:hover{color:rgb(6, 3, 58);border-bottom-color:transparent;}.css-v2ak9[aria-selected=true]:hover{color:rgb(3, 11, 93);border-bottom-color:transparent;box-shadow:0 -1px 0 #030b5d;}.css-v2ak9:focus{outline:none;border-color:rgb(0, 109, 250);box-shadow:inset 0 0 0 1px #006dfa,inset 0 0 0 3px #cce4ff;border-bottom-color:rgb(0, 109, 250);}.css-v2ak9[aria-selected=true]:focus{border-style:solid;box-shadow:inset 0 0 0 1px #006dfa,inset 0 0 0 3px #cce4ff;color:rgb(2, 99, 224);border-color:rgb(0, 109, 250);}.css-v2ak9:disabled:focus,.css-v2ak9[aria-disabled=true]:focus{border-color:rgb(202, 205, 216);box-shadow:none;border-bottom:none;overflow:clip;}</style><span data-paste-element="HORIZONTAL_TAB" data-paste-core-version="20.7.0" id=":Rqslaatasm:-Console" tabindex="0" aria-selected="true" role="tab" class="css-v2ak9">Console</span><span data-paste-element="HORIZONTAL_TAB" data-paste-core-version="20.7.0" id=":Rqslaatasm:-Serverless Toolkit" tabindex="0" aria-selected="false" role="tab" class="css-v2ak9">Serverless Toolkit</span><style data-emotion="css 1nb60dz">.css-1nb60dz{box-sizing:border-box;position:absolute;width:100%;height:1px;background-color:rgb(255, 255, 255);bottom:-1px;}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1nb60dz"></div></div></div></div></div><style data-emotion="css 1k4tg43">.css-1k4tg43{box-sizing:border-box;width:100%;}</style><div data-paste-element="HORIZONTAL_TAB_PANELS" data-paste-core-version="20.7.0" class="css-1k4tg43"><style data-emotion="css l8vwfh">.css-l8vwfh{box-sizing:border-box;padding-top:1.25rem;border-radius:4px;}.css-l8vwfh:focus-visible{box-shadow:inset 0 0 0 1px #006dfa,inset 0 0 0 3px #cce4ff;outline:none;}</style><div data-paste-element="HORIZONTAL_TAB_PANEL" data-paste-core-version="20.7.0" id=":Rqslaatasm:-3" role="tabpanel" tabindex="0" aria-labelledby=":Rqslaatasm:-Console" class="css-l8vwfh"><p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o">If you prefer a UI-driven approach, creating and deploying a Function can be done entirely using the Twilio Console and the following steps:</p><style data-emotion="css w38rkw">.css-w38rkw{margin:0;padding:0;color:rgb(18, 28, 45);font-size:0.875rem;line-height:1.5rem;margin-bottom:1.5rem;font-weight:400;margin-left:1.5rem;list-style-type:decimal;}</style><ol data-paste-element="ORDERED_LIST" data-paste-core-version="20.6.0" class="css-w38rkw"> <style data-emotion="css 1pp5a8v">.css-1pp5a8v{margin:0;padding:0;color:rgb(18, 28, 45);font-size:0.875rem;line-height:1.5rem;font-weight:400;margin-bottom:0.5rem;margin-top:0.5rem;}</style><li data-paste-element="LIST_ITEM" data-paste-core-version="20.6.0" class="css-1pp5a8v">Log in to the Twilio Console and navigate to the <a data-paste-element="ANCHOR" data-paste-core-version="20.7.0" href="https://www.twilio.com/console/functions/overview" rel="noreferrer noopener" target="_blank" title="Functions tab" class="css-lpeit6"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj">Functions tab<style data-emotion="css 1ezs782">.css-1ezs782{box-sizing:border-box;display:inline-block;-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;vertical-align:middle;}</style><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1ezs782"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" viewBox="0 0 20 20" aria-labelledby="LinkExternalIcon-:Rl98l9laqslaatasm:"><title id="LinkExternalIcon-:Rl98l9laqslaatasm:">(link takes you to an external page)</title><path fill="currentColor" fill-rule="evenodd" d="M8.4 4.5a.5.5 0 01.5.5v.1a.5.5 0 01-.5.5H5.6v8.8h8.8v-2.8a.5.5 0 01.41-.492l.09-.008h.1a.5.5 0 01.492.41l.008.09V15a.5.5 0 01-.41.492L15 15.5H5a.5.5 0 01-.492-.41L4.5 15V5a.5.5 0 01.41-.492L5 4.5h3.4zm6.6 0a.5.5 0 01.5.5v.1l-.001.01.001 3.29a.5.5 0 01-.5.5h-.1a.5.5 0 01-.5-.5l-.001-1.935-3.967 3.967a.611.611 0 01-.78.07l-.084-.07a.611.611 0 01-.07-.78l.07-.084L13.534 5.6H11.6a.5.5 0 01-.5-.5V5a.5.5 0 01.5-.5H15z"></path></svg></span></span></span></a>. If you need an account, you can sign up for a free Twilio account <a data-paste-element="ANCHOR" data-paste-core-version="20.7.0" href="https://www.twilio.com/try-twilio" rel="noreferrer noopener" target="_blank" title="here" class="css-lpeit6"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj">here<span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1ezs782"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" viewBox="0 0 20 20" aria-labelledby="LinkExternalIcon-:Rla8l9laqslaatasm:"><title id="LinkExternalIcon-:Rla8l9laqslaatasm:">(link takes you to an external page)</title><path fill="currentColor" fill-rule="evenodd" d="M8.4 4.5a.5.5 0 01.5.5v.1a.5.5 0 01-.5.5H5.6v8.8h8.8v-2.8a.5.5 0 01.41-.492l.09-.008h.1a.5.5 0 01.492.41l.008.09V15a.5.5 0 01-.41.492L15 15.5H5a.5.5 0 01-.492-.41L4.5 15V5a.5.5 0 01.41-.492L5 4.5h3.4zm6.6 0a.5.5 0 01.5.5v.1l-.001.01.001 3.29a.5.5 0 01-.5.5h-.1a.5.5 0 01-.5-.5l-.001-1.935-3.967 3.967a.611.611 0 01-.78.07l-.084-.07a.611.611 0 01-.07-.78l.07-.084L13.534 5.6H11.6a.5.5 0 01-.5-.5V5a.5.5 0 01.5-.5H15z"></path></svg></span></span></span></a>!</li> <li data-paste-element="LIST_ITEM" data-paste-core-version="20.6.0" class="css-1pp5a8v">Functions are contained within <strong>Services</strong>. Create a <strong><a data-paste-element="ANCHOR" data-paste-core-version="20.7.0" href="/docs/serverless/functions-assets/functions/create-service" title="Service" class="css-lpeit6">Service</a></strong> by clicking the <strong><a data-paste-element="ANCHOR" data-paste-core-version="20.7.0" href="https://www.twilio.com/console/functions/overview/services" rel="noreferrer noopener" target="_blank" title="Create Service" class="css-lpeit6"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj">Create Service<span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1ezs782"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" viewBox="0 0 20 20" aria-labelledby="LinkExternalIcon-:R1aj959laqslaatasm:"><title id="LinkExternalIcon-:R1aj959laqslaatasm:">(link takes you to an external page)</title><path fill="currentColor" fill-rule="evenodd" d="M8.4 4.5a.5.5 0 01.5.5v.1a.5.5 0 01-.5.5H5.6v8.8h8.8v-2.8a.5.5 0 01.41-.492l.09-.008h.1a.5.5 0 01.492.41l.008.09V15a.5.5 0 01-.41.492L15 15.5H5a.5.5 0 01-.492-.41L4.5 15V5a.5.5 0 01.41-.492L5 4.5h3.4zm6.6 0a.5.5 0 01.5.5v.1l-.001.01.001 3.29a.5.5 0 01-.5.5h-.1a.5.5 0 01-.5-.5l-.001-1.935-3.967 3.967a.611.611 0 01-.78.07l-.084-.07a.611.611 0 01-.07-.78l.07-.084L13.534 5.6H11.6a.5.5 0 01-.5-.5V5a.5.5 0 01.5-.5H15z"></path></svg></span></span></span></a></strong> button and providing a name such as <em>test-function</em>.</li> <li data-paste-element="LIST_ITEM" data-paste-core-version="20.6.0" class="css-1pp5a8v">Once you've been redirected to the new Service, click the <strong>Add +</strong> button and select <strong>Add Function</strong> from the dropdown.</li> <li data-paste-element="LIST_ITEM" data-paste-core-version="20.6.0" class="css-1pp5a8v">This will create a new <a data-paste-element="ANCHOR" data-paste-core-version="20.7.0" href="/docs/serverless/functions-assets/visibility" title="Protected" class="css-lpeit6">Protected</a> Function for you with the option to rename it. The name of the file will be path it is accessed from.</li> <li data-paste-element="LIST_ITEM" data-paste-core-version="20.6.0" class="css-1pp5a8v">Copy any one of the example code snippets from this page that you want to experiment with, and paste the code into your newly created Function. You can quickly switch examples by using the dropdown menu of the code rail.</li> <li data-paste-element="LIST_ITEM" data-paste-core-version="20.6.0" class="css-1pp5a8v">Click <strong>Save</strong> to save your Function's contents.</li> <li data-paste-element="LIST_ITEM" data-paste-core-version="20.6.0" class="css-1pp5a8v">Click <strong>Deploy All</strong> to build and deploy the Function. After a short delay, your Function will be accessible from: <code data-paste-element="INLINE_CODE" data-paste-core-version="20.7.0" class="css-1kwd7zr">https://<service-name>-<random-characters>-<optional-domain-suffix>.twil.io/<function-path></code><br/> For example: <code data-paste-element="INLINE_CODE" data-paste-core-version="20.7.0" class="css-1kwd7zr">test-function-3548.twil.io/hello-world</code>.</li> </ol></div><div data-paste-element="HORIZONTAL_TAB_PANEL" data-paste-core-version="20.7.0" id=":Rqslaatasm:-4" hidden="" style="display:none" role="tabpanel" tabindex="0" aria-labelledby=":Rqslaatasm:-Serverless Toolkit" class="css-l8vwfh"><p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o">The <a data-paste-element="ANCHOR" data-paste-core-version="20.7.0" href="/docs/labs/serverless-toolkit" title="Serverless Toolkit" class="css-lpeit6">Serverless Toolkit</a> enables you with local development, project deployment, and other functionality via the <a data-paste-element="ANCHOR" data-paste-core-version="20.7.0" href="/docs/twilio-cli/quickstart" title="Twilio CLI" class="css-lpeit6">Twilio CLI</a>. To get up and running with these examples using Serverless Toolkit, follow this process:</p><ol data-paste-element="ORDERED_LIST" data-paste-core-version="20.6.0" class="css-w38rkw"> <li data-paste-element="LIST_ITEM" data-paste-core-version="20.6.0" class="css-1pp5a8v"> <p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o">From the CLI, run <code data-paste-element="INLINE_CODE" data-paste-core-version="20.7.0" class="css-1kwd7zr">twilio serverless:init <your-service-name> --empty</code> to bootstrap your local environment.</p> </li> <li data-paste-element="LIST_ITEM" data-paste-core-version="20.6.0" class="css-1pp5a8v"> <p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o">Navigate into your new project directory using <code data-paste-element="INLINE_CODE" data-paste-core-version="20.7.0" class="css-1kwd7zr">cd <your-service-name></code></p> </li> <li data-paste-element="LIST_ITEM" data-paste-core-version="20.6.0" class="css-1pp5a8v"> <p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o">In the <code data-paste-element="INLINE_CODE" data-paste-core-version="20.7.0" class="css-1kwd7zr">/functions</code> directory, create a new JavaScript file that is named respective to the purpose of the Function. For example, <code data-paste-element="INLINE_CODE" data-paste-core-version="20.7.0" class="css-1kwd7zr">sms-reply.protected.js</code> for a <a data-paste-element="ANCHOR" data-paste-core-version="20.7.0" href="/docs/serverless/functions-assets/visibility" title="Protected" class="css-lpeit6">Protected</a> Function intended to handle incoming SMS.</p> </li> <li data-paste-element="LIST_ITEM" data-paste-core-version="20.6.0" class="css-1pp5a8v"> <p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o">Populate the file using the code example of your choice and save. <strong>Note</strong> A Function can only export a single handler. You will want to create separate files if you want to run and/or deploy multiple examples at once.</p> </li> </ol><p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o">Once your Function(s) code is written and saved, you can test it either by running it locally (and optionally tunneling requests to it via a tool like <a data-paste-element="ANCHOR" data-paste-core-version="20.7.0" href="https://ngrok.com/" rel="noreferrer noopener" target="_blank" title="ngrok" class="css-lpeit6"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj">ngrok<span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1ezs782"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" viewBox="0 0 20 20" aria-labelledby="LinkExternalIcon-:Rlahqlaqslaatasm:"><title id="LinkExternalIcon-:Rlahqlaqslaatasm:">(link takes you to an external page)</title><path fill="currentColor" fill-rule="evenodd" d="M8.4 4.5a.5.5 0 01.5.5v.1a.5.5 0 01-.5.5H5.6v8.8h8.8v-2.8a.5.5 0 01.41-.492l.09-.008h.1a.5.5 0 01.492.41l.008.09V15a.5.5 0 01-.41.492L15 15.5H5a.5.5 0 01-.492-.41L4.5 15V5a.5.5 0 01.41-.492L5 4.5h3.4zm6.6 0a.5.5 0 01.5.5v.1l-.001.01.001 3.29a.5.5 0 01-.5.5h-.1a.5.5 0 01-.5-.5l-.001-1.935-3.967 3.967a.611.611 0 01-.78.07l-.084-.07a.611.611 0 01-.07-.78l.07-.084L13.534 5.6H11.6a.5.5 0 01-.5-.5V5a.5.5 0 01.5-.5H15z"></path></svg></span></span></span></a>), or by deploying the Function and executing against the deployed url(s).</p><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-m8ey6p"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><style data-emotion="css 1eeh09g">.css-1eeh09g{margin:0;padding:0;color:rgb(18, 28, 45);font-size:1.25rem;line-height:1.75rem;margin-bottom:0;font-weight:600;letter-spacing:-.02em;display:block;}</style><h3 data-paste-element="HEADING" data-paste-core-version="20.6.0" class="css-1eeh09g">Run your Function in local development</h3></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1kam78h"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-knmi57"><button data-paste-element="BUTTON" data-paste-core-version="20.7.0" aria-pressed="false" type="button" aria-busy="false" class="css-1b15v5e"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" width="100%" height="100%" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" aria-labelledby="ThumbsUpIcon-:Rj6laialaqslaatasm:"><title id="ThumbsUpIcon-:Rj6laialaqslaatasm:">Positive Feedback</title><path fill="currentColor" fill-rule="evenodd" clip-rule="evenodd" d="M6.5 7.45c.194-.216.406-.451.628-.707.799-.922 1.608-1.972 1.898-2.838.314-.938 1.139-1.487 1.966-1.395a1.57 1.57 0 011.085.621c.277.363.423.85.423 1.43 0 .327-.081.645-.174.924-.062.186-.139.383-.208.56l-.088.226c-.092.245-.15.432-.166.582-.014.134.01.19.033.222l.001.001a.415.415 0 00.1.058 1.9 1.9 0 00.371.11c.32.068.725.106 1.152.124.632.026 1.237.01 1.634-.002.147-.004.265-.008.345-.008.25 0 .731.008 1.158.218.224.11.443.28.603.537.159.256.239.567.239.924 0 1.218-.524 3.647-1.553 5.695-.31.616-.693.885-1.18 1.193-.574.364-1.145.575-1.767.575h-3c-1.116 0-2.204-.418-3.002-.883a6.393 6.393 0 01-.498-.322v.372a.5.5 0 01-.5.5H3a.5.5 0 01-.5-.5V7a.5.5 0 01.5-.5h3a.5.5 0 01.5.5v.45zm3.474-3.228c.186-.554.611-.751.909-.718a.57.57 0 01.399.233c.114.15.218.409.218.824 0 .17-.044.37-.123.61a9.287 9.287 0 01-.177.474c-.034.087-.07.177-.105.273-.095.252-.194.542-.225.827-.032.297.005.636.23.935.135.178.322.291.491.367.175.078.372.134.571.176.4.084.869.125 1.317.144.676.028 1.382.008 1.767-.003.118-.003.206-.006.254-.006.25 0 .519.018.717.115.088.044.15.098.194.168.044.07.089.19.089.396 0 1.04-.476 3.316-1.447 5.246-.184.367-.375.516-.82.797-.468.296-.855.42-1.233.42h-3c-.884 0-1.796-.338-2.498-.747a4.464 4.464 0 01-.813-.591 1.36 1.36 0 01-.184-.207l-.005-.008V8.968a7.331 7.331 0 01.329-.39l.308-.343c.223-.246.483-.534.746-.837.788-.909 1.73-2.097 2.091-3.176zM5.5 7.5h-2v7.667h2V7.5z"></path></svg></span></span></button><button data-paste-element="BUTTON" data-paste-core-version="20.7.0" aria-pressed="false" type="button" aria-busy="false" class="css-1b15v5e"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" width="100%" height="100%" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" aria-labelledby="ThumbsDownIcon-:Rjalaialaqslaatasm:"><title id="ThumbsDownIcon-:Rjalaialaqslaatasm:">Negative Feedback</title><path fill="currentColor" fill-rule="evenodd" clip-rule="evenodd" d="M13.5 12.55c-.194.215-.406.451-.628.707-.799.921-1.608 1.972-1.898 2.838-.314.938-1.139 1.487-1.966 1.395a1.57 1.57 0 01-1.085-.621c-.277-.363-.423-.85-.423-1.43 0-.327.081-.645.174-.924.062-.186.139-.383.208-.56l.088-.226c.092-.245.15-.432.166-.582.014-.134-.01-.19-.033-.222l-.001-.001a.416.416 0 00-.1-.058 1.902 1.902 0 00-.371-.11 7.35 7.35 0 00-1.152-.124 22.958 22.958 0 00-1.634.002 14.2 14.2 0 01-.345.008c-.25 0-.731-.008-1.158-.218a1.451 1.451 0 01-.603-.537c-.159-.257-.239-.567-.239-.924 0-1.218.524-3.648 1.553-5.696.31-.616.693-.884 1.18-1.192C5.807 3.71 6.378 3.5 7 3.5h3c1.116 0 2.204.417 3.002.883.178.104.345.212.498.321v-.37a.5.5 0 01.5-.5h3a.5.5 0 01.5.5V13a.5.5 0 01-.5.5h-3a.5.5 0 01-.5-.5v-.45zm-3.474 3.227c-.186.554-.611.752-.909.72a.571.571 0 01-.399-.234c-.114-.15-.218-.409-.218-.824a2 2 0 01.123-.61c.054-.16.113-.312.177-.475.034-.086.07-.176.105-.272.095-.252.194-.542.225-.828.032-.296-.005-.635-.23-.934a1.23 1.23 0 00-.491-.367 2.874 2.874 0 00-.571-.176 8.31 8.31 0 00-1.317-.144c-.676-.029-1.381-.008-1.767.003-.118.003-.206.006-.254.006-.25 0-.519-.018-.717-.115a.452.452 0 01-.194-.168c-.044-.07-.089-.19-.089-.396 0-1.04.476-3.316 1.447-5.247.184-.366.375-.515.82-.796.468-.296.855-.42 1.233-.42h3c.884 0 1.796.337 2.498.747.349.203.628.414.813.59.093.09.152.16.184.208l.005.007v4.98a7.245 7.245 0 01-.329.39 54.1 54.1 0 01-.308.342c-.223.247-.483.534-.746.838-.788.909-1.73 2.096-2.091 3.175zM14.5 12.5h2V4.833h-2V12.5z"></path></svg></span></span></button></div></div></div><p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o">Run <code data-paste-element="INLINE_CODE" data-paste-core-version="20.7.0" class="css-1kwd7zr">twilio serverless:start</code> from your CLI to start the project locally. The Function(s) in your project will be accessible from <code data-paste-element="INLINE_CODE" data-paste-core-version="20.7.0" class="css-1kwd7zr">http://localhost:3000/sms-reply</code></p><style data-emotion="css 1bt452l">.css-1bt452l{margin:0;padding:0;color:rgb(18, 28, 45);font-size:0.875rem;line-height:1.5rem;margin-bottom:1.5rem;font-weight:400;margin-left:1.5rem;list-style-type:disc;}</style><ul data-paste-element="UNORDERED_LIST" data-paste-core-version="20.6.0" class="css-1bt452l"> <li data-paste-element="LIST_ITEM" data-paste-core-version="20.6.0" class="css-1pp5a8v"> <p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o">If you want to test a Function as a <a data-paste-element="ANCHOR" data-paste-core-version="20.7.0" href="/docs/usage/webhooks/getting-started-twilio-webhooks" title="Twilio webhook" class="css-lpeit6">Twilio webhook</a>, run: <code data-paste-element="INLINE_CODE" data-paste-core-version="20.7.0" class="css-1kwd7zr">twilio phone-numbers:update <your Twilio phone number> --sms-url "http://localhost:3000/sms-reply"</code><br/> This will automatically generate an ngrok tunnel from Twilio to your locally running Function, so you can start sending texts to it. You can apply the same process but with the <code data-paste-element="INLINE_CODE" data-paste-core-version="20.7.0" class="css-1kwd7zr">voice-url</code> flag instead if you want to test with <a data-paste-element="ANCHOR" data-paste-core-version="20.7.0" href="/docs/voice" title="Twilio Voice" class="css-lpeit6">Twilio Voice</a>.</p> </li> <li data-paste-element="LIST_ITEM" data-paste-core-version="20.6.0" class="css-1pp5a8v"> <p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o">If your code does <em>not</em> connect to Twilio Voice/Messages as a webhook, you can start your dev server and start an ngrok tunnel in the same command with the <code data-paste-element="INLINE_CODE" data-paste-core-version="20.7.0" class="css-1kwd7zr">ngrok</code> flag. For example: <code data-paste-element="INLINE_CODE" data-paste-core-version="20.7.0" class="css-1kwd7zr">twilio serverless:start --ngrok=""</code></p> </li> </ul><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-m8ey6p"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><h3 data-paste-element="HEADING" data-paste-core-version="20.6.0" class="css-1eeh09g">Deploy your Function</h3></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1kam78h"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-knmi57"><button data-paste-element="BUTTON" data-paste-core-version="20.7.0" aria-pressed="false" type="button" aria-busy="false" class="css-1b15v5e"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" width="100%" height="100%" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" aria-labelledby="ThumbsUpIcon-:Rj6lajqlaqslaatasm:"><title id="ThumbsUpIcon-:Rj6lajqlaqslaatasm:">Positive Feedback</title><path fill="currentColor" fill-rule="evenodd" clip-rule="evenodd" d="M6.5 7.45c.194-.216.406-.451.628-.707.799-.922 1.608-1.972 1.898-2.838.314-.938 1.139-1.487 1.966-1.395a1.57 1.57 0 011.085.621c.277.363.423.85.423 1.43 0 .327-.081.645-.174.924-.062.186-.139.383-.208.56l-.088.226c-.092.245-.15.432-.166.582-.014.134.01.19.033.222l.001.001a.415.415 0 00.1.058 1.9 1.9 0 00.371.11c.32.068.725.106 1.152.124.632.026 1.237.01 1.634-.002.147-.004.265-.008.345-.008.25 0 .731.008 1.158.218.224.11.443.28.603.537.159.256.239.567.239.924 0 1.218-.524 3.647-1.553 5.695-.31.616-.693.885-1.18 1.193-.574.364-1.145.575-1.767.575h-3c-1.116 0-2.204-.418-3.002-.883a6.393 6.393 0 01-.498-.322v.372a.5.5 0 01-.5.5H3a.5.5 0 01-.5-.5V7a.5.5 0 01.5-.5h3a.5.5 0 01.5.5v.45zm3.474-3.228c.186-.554.611-.751.909-.718a.57.57 0 01.399.233c.114.15.218.409.218.824 0 .17-.044.37-.123.61a9.287 9.287 0 01-.177.474c-.034.087-.07.177-.105.273-.095.252-.194.542-.225.827-.032.297.005.636.23.935.135.178.322.291.491.367.175.078.372.134.571.176.4.084.869.125 1.317.144.676.028 1.382.008 1.767-.003.118-.003.206-.006.254-.006.25 0 .519.018.717.115.088.044.15.098.194.168.044.07.089.19.089.396 0 1.04-.476 3.316-1.447 5.246-.184.367-.375.516-.82.797-.468.296-.855.42-1.233.42h-3c-.884 0-1.796-.338-2.498-.747a4.464 4.464 0 01-.813-.591 1.36 1.36 0 01-.184-.207l-.005-.008V8.968a7.331 7.331 0 01.329-.39l.308-.343c.223-.246.483-.534.746-.837.788-.909 1.73-2.097 2.091-3.176zM5.5 7.5h-2v7.667h2V7.5z"></path></svg></span></span></button><button data-paste-element="BUTTON" data-paste-core-version="20.7.0" aria-pressed="false" type="button" aria-busy="false" class="css-1b15v5e"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" width="100%" height="100%" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" aria-labelledby="ThumbsDownIcon-:Rjalajqlaqslaatasm:"><title id="ThumbsDownIcon-:Rjalajqlaqslaatasm:">Negative Feedback</title><path fill="currentColor" fill-rule="evenodd" clip-rule="evenodd" d="M13.5 12.55c-.194.215-.406.451-.628.707-.799.921-1.608 1.972-1.898 2.838-.314.938-1.139 1.487-1.966 1.395a1.57 1.57 0 01-1.085-.621c-.277-.363-.423-.85-.423-1.43 0-.327.081-.645.174-.924.062-.186.139-.383.208-.56l.088-.226c.092-.245.15-.432.166-.582.014-.134-.01-.19-.033-.222l-.001-.001a.416.416 0 00-.1-.058 1.902 1.902 0 00-.371-.11 7.35 7.35 0 00-1.152-.124 22.958 22.958 0 00-1.634.002 14.2 14.2 0 01-.345.008c-.25 0-.731-.008-1.158-.218a1.451 1.451 0 01-.603-.537c-.159-.257-.239-.567-.239-.924 0-1.218.524-3.648 1.553-5.696.31-.616.693-.884 1.18-1.192C5.807 3.71 6.378 3.5 7 3.5h3c1.116 0 2.204.417 3.002.883.178.104.345.212.498.321v-.37a.5.5 0 01.5-.5h3a.5.5 0 01.5.5V13a.5.5 0 01-.5.5h-3a.5.5 0 01-.5-.5v-.45zm-3.474 3.227c-.186.554-.611.752-.909.72a.571.571 0 01-.399-.234c-.114-.15-.218-.409-.218-.824a2 2 0 01.123-.61c.054-.16.113-.312.177-.475.034-.086.07-.176.105-.272.095-.252.194-.542.225-.828.032-.296-.005-.635-.23-.934a1.23 1.23 0 00-.491-.367 2.874 2.874 0 00-.571-.176 8.31 8.31 0 00-1.317-.144c-.676-.029-1.381-.008-1.767.003-.118.003-.206.006-.254.006-.25 0-.519-.018-.717-.115a.452.452 0 01-.194-.168c-.044-.07-.089-.19-.089-.396 0-1.04.476-3.316 1.447-5.247.184-.366.375-.515.82-.796.468-.296.855-.42 1.233-.42h3c.884 0 1.796.337 2.498.747.349.203.628.414.813.59.093.09.152.16.184.208l.005.007v4.98a7.245 7.245 0 01-.329.39 54.1 54.1 0 01-.308.342c-.223.247-.483.534-.746.838-.788.909-1.73 2.096-2.091 3.175zM14.5 12.5h2V4.833h-2V12.5z"></path></svg></span></span></button></div></div></div><p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o">To deploy your Function and have access to live url(s), run <code data-paste-element="INLINE_CODE" data-paste-core-version="20.7.0" class="css-1kwd7zr">twilio serverless:deploy</code> from your CLI. This will deploy your Function(s) to Twilio under a development environment by default, where they can be accessed from:</p><p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o"><code data-paste-element="INLINE_CODE" data-paste-core-version="20.7.0" class="css-1kwd7zr">https://<service-name>-<random-characters>-dev.twil.io/<function-path></code></p><p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o">For example: <code data-paste-element="INLINE_CODE" data-paste-core-version="20.7.0" class="css-1kwd7zr">https://incoming-sms-examples-3421-dev.twil.io/sms-reply</code></p></div></div></div></div><p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o">Your Function is now ready to be invoked by HTTP requests, set as the <a data-paste-element="ANCHOR" data-paste-core-version="20.7.0" href="/docs/usage/webhooks/getting-started-twilio-webhooks" title="webhook" class="css-lpeit6">webhook</a> of a Twilio phone number, invoked by a Twilio Studio <strong><a data-paste-element="ANCHOR" data-paste-core-version="20.7.0" href="/docs/studio/widget-library/run-function" title="Run Function Widget" class="css-lpeit6">Run Function Widget</a></strong>, and more!</p></section> <section id="install-dependencies-and-define-the-function-body-section-indexable"><hr data-paste-element="SEPARATOR" data-paste-core-version="20.7.0" aria-orientation="horizontal" class="css-1y5brhz"/><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-m8ey6p"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-gt12nx"><h2 data-paste-element="HEADING" data-paste-core-version="20.6.0" id="install-dependencies-and-define-the-function-body" class="css-16k5vxt">Install Dependencies and define the Function body</h2><a data-paste-element="BOX" data-paste-core-version="20.7.0" href="#install-dependencies-and-define-the-function-body" class="css-f02h4i"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" fill="none" viewBox="0 0 20 20" aria-labelledby="LinkIcon-:Rl9kbclaatasm:"><title id="LinkIcon-:Rl9kbclaatasm:">install-dependencies-and-define-the-function-body page anchor</title><path fill="currentColor" d="M13.074 5.674a2.3 2.3 0 013.252 3.252l-2.97 2.97A2.3 2.3 0 019.869 8.92a.5.5 0 10-.808-.588 3.3 3.3 0 005.004 4.272l2.97-2.97a3.3 3.3 0 00-4.667-4.666l-.467.466a.5.5 0 10.707.707l.467-.466z"></path><path fill="currentColor" d="M9.18 7.163a2.3 2.3 0 011.952 3.65.5.5 0 10.809.59A3.3 3.3 0 006.936 7.13l-2.97 2.97a3.3 3.3 0 004.667 4.667l.58-.58a.5.5 0 10-.707-.707l-.58.58a2.3 2.3 0 11-3.252-3.252l2.97-2.97c.409-.41.958-.652 1.536-.675z"></path></svg></span></a></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1kam78h"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-knmi57"><button data-paste-element="BUTTON" data-paste-core-version="20.7.0" aria-pressed="false" type="button" aria-busy="false" class="css-1b15v5e"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" width="100%" height="100%" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" aria-labelledby="ThumbsUpIcon-:R4plakbclaatasm:"><title id="ThumbsUpIcon-:R4plakbclaatasm:">Positive Feedback</title><path fill="currentColor" fill-rule="evenodd" clip-rule="evenodd" d="M6.5 7.45c.194-.216.406-.451.628-.707.799-.922 1.608-1.972 1.898-2.838.314-.938 1.139-1.487 1.966-1.395a1.57 1.57 0 011.085.621c.277.363.423.85.423 1.43 0 .327-.081.645-.174.924-.062.186-.139.383-.208.56l-.088.226c-.092.245-.15.432-.166.582-.014.134.01.19.033.222l.001.001a.415.415 0 00.1.058 1.9 1.9 0 00.371.11c.32.068.725.106 1.152.124.632.026 1.237.01 1.634-.002.147-.004.265-.008.345-.008.25 0 .731.008 1.158.218.224.11.443.28.603.537.159.256.239.567.239.924 0 1.218-.524 3.647-1.553 5.695-.31.616-.693.885-1.18 1.193-.574.364-1.145.575-1.767.575h-3c-1.116 0-2.204-.418-3.002-.883a6.393 6.393 0 01-.498-.322v.372a.5.5 0 01-.5.5H3a.5.5 0 01-.5-.5V7a.5.5 0 01.5-.5h3a.5.5 0 01.5.5v.45zm3.474-3.228c.186-.554.611-.751.909-.718a.57.57 0 01.399.233c.114.15.218.409.218.824 0 .17-.044.37-.123.61a9.287 9.287 0 01-.177.474c-.034.087-.07.177-.105.273-.095.252-.194.542-.225.827-.032.297.005.636.23.935.135.178.322.291.491.367.175.078.372.134.571.176.4.084.869.125 1.317.144.676.028 1.382.008 1.767-.003.118-.003.206-.006.254-.006.25 0 .519.018.717.115.088.044.15.098.194.168.044.07.089.19.089.396 0 1.04-.476 3.316-1.447 5.246-.184.367-.375.516-.82.797-.468.296-.855.42-1.233.42h-3c-.884 0-1.796-.338-2.498-.747a4.464 4.464 0 01-.813-.591 1.36 1.36 0 01-.184-.207l-.005-.008V8.968a7.331 7.331 0 01.329-.39l.308-.343c.223-.246.483-.534.746-.837.788-.909 1.73-2.097 2.091-3.176zM5.5 7.5h-2v7.667h2V7.5z"></path></svg></span></span></button><button data-paste-element="BUTTON" data-paste-core-version="20.7.0" aria-pressed="false" type="button" aria-busy="false" class="css-1b15v5e"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" width="100%" height="100%" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" aria-labelledby="ThumbsDownIcon-:R4qlakbclaatasm:"><title id="ThumbsDownIcon-:R4qlakbclaatasm:">Negative Feedback</title><path fill="currentColor" fill-rule="evenodd" clip-rule="evenodd" d="M13.5 12.55c-.194.215-.406.451-.628.707-.799.921-1.608 1.972-1.898 2.838-.314.938-1.139 1.487-1.966 1.395a1.57 1.57 0 01-1.085-.621c-.277-.363-.423-.85-.423-1.43 0-.327.081-.645.174-.924.062-.186.139-.383.208-.56l.088-.226c.092-.245.15-.432.166-.582.014-.134-.01-.19-.033-.222l-.001-.001a.416.416 0 00-.1-.058 1.902 1.902 0 00-.371-.11 7.35 7.35 0 00-1.152-.124 22.958 22.958 0 00-1.634.002 14.2 14.2 0 01-.345.008c-.25 0-.731-.008-1.158-.218a1.451 1.451 0 01-.603-.537c-.159-.257-.239-.567-.239-.924 0-1.218.524-3.648 1.553-5.696.31-.616.693-.884 1.18-1.192C5.807 3.71 6.378 3.5 7 3.5h3c1.116 0 2.204.417 3.002.883.178.104.345.212.498.321v-.37a.5.5 0 01.5-.5h3a.5.5 0 01.5.5V13a.5.5 0 01-.5.5h-3a.5.5 0 01-.5-.5v-.45zm-3.474 3.227c-.186.554-.611.752-.909.72a.571.571 0 01-.399-.234c-.114-.15-.218-.409-.218-.824a2 2 0 01.123-.61c.054-.16.113-.312.177-.475.034-.086.07-.176.105-.272.095-.252.194-.542.225-.828.032-.296-.005-.635-.23-.934a1.23 1.23 0 00-.491-.367 2.874 2.874 0 00-.571-.176 8.31 8.31 0 00-1.317-.144c-.676-.029-1.381-.008-1.767.003-.118.003-.206.006-.254.006-.25 0-.519-.018-.717-.115a.452.452 0 01-.194-.168c-.044-.07-.089-.19-.089-.396 0-1.04.476-3.316 1.447-5.247.184-.366.375-.515.82-.796.468-.296.855-.42 1.233-.42h3c.884 0 1.796.337 2.498.747.349.203.628.414.813.59.093.09.152.16.184.208l.005.007v4.98a7.245 7.245 0 01-.329.39 54.1 54.1 0 01-.308.342c-.223.247-.483.534-.746.838-.788.909-1.73 2.096-2.091 3.175zM14.5 12.5h2V4.833h-2V12.5z"></path></svg></span></span></button></div></div></div><p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o">Studio Widgets can handle the elements of gathering user input and sending back a response text. However, custom logic like handling breed names that contain spaces lives best inside of a Function.</p><p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o">Let's add some code to this Function. Install <code data-paste-element="INLINE_CODE" data-paste-core-version="20.7.0" class="css-1kwd7zr">axios</code> as a <a data-paste-element="ANCHOR" data-paste-core-version="20.7.0" href="/docs/serverless/functions-assets/functions/dependencies" title="Dependency" class="css-lpeit6">Dependency</a>, copy the following code example into your Function, save, and deploy your Service so that we can look more closely at how to integrate the Run Widget into a Studio Flow.</p><p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o">Note that this Function expects an input of <code data-paste-element="INLINE_CODE" data-paste-core-version="20.7.0" class="css-1kwd7zr">breed</code>, and returns JSON that includes some <code data-paste-element="INLINE_CODE" data-paste-core-version="20.7.0" class="css-1kwd7zr">text</code> and an image <code data-paste-element="INLINE_CODE" data-paste-core-version="20.7.0" class="css-1kwd7zr">url</code>.</p><style data-emotion="css irnnze">.css-irnnze{margin-top:1.5rem;margin-bottom:1.5rem;}.css-irnnze h1,.css-irnnze h2,.css-irnnze h3,.css-irnnze h4,.css-irnnze h5,.css-irnnze h6,.css-irnnze p,.css-irnnze li,.css-irnnze ul,.css-irnnze ol,.css-irnnze [data-paste-element=DISCLOSURE] span[data-paste-element=HEADING]{color:inherit;}[data-paste-element=HORIZONTAL_TAB_PANEL] .css-irnnze{margin-top:0;}</style><style data-emotion="css rj5eb">.css-rj5eb{box-sizing:border-box;margin-top:1.5rem;margin-bottom:1.5rem;}.css-rj5eb h1,.css-rj5eb h2,.css-rj5eb h3,.css-rj5eb h4,.css-rj5eb h5,.css-rj5eb h6,.css-rj5eb p,.css-rj5eb li,.css-rj5eb ul,.css-rj5eb ol,.css-rj5eb [data-paste-element=DISCLOSURE] span[data-paste-element=HEADING]{color:inherit;}[data-paste-element=HORIZONTAL_TAB_PANEL] .css-rj5eb{margin-top:0;}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-rj5eb"><style data-emotion="css 1v816ix">.css-1v816ix{box-sizing:border-box;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;padding:1.5rem;border-left-style:solid;border-left-width:2px;-webkit-align-items:start;-webkit-box-align:start;-ms-flex-align:start;align-items:start;-webkit-column-gap:1rem;column-gap:1rem;background-color:rgb(249, 249, 250);color:rgb(3, 11, 93);border-color:rgb(102, 179, 255);}</style><div data-paste-element="CALLOUT" data-paste-core-version="20.7.0" class="css-1v816ix"><div data-paste-element="CALLOUT_ICON" data-paste-core-version="20.7.0" class="css-roynbj"><style data-emotion="css 1cst9vu">.css-1cst9vu{box-sizing:border-box;line-height:0;display:block;color:rgb(3, 11, 93);width:1.25rem;height:1.25rem;-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;}</style><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-1cst9vu"><svg role="img" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" viewBox="0 0 20 20" aria-labelledby="NeutralIcon-:R36lbclaatasm:"><path fill="currentColor" fill-rule="evenodd" d="M10 2a8 8 0 110 16 8 8 0 010-16zm0 7c-.26.01-.528.08-.707.24-.178.158-.292.355-.292.575v3.37c0 .21.11.428.292.577.173.14.457.247.707.237.26-.008.528-.078.707-.237.178-.16.292-.355.292-.577v-3.37a.766.766 0 00-.292-.575A1.14 1.14 0 0010 9zm0-3l-.266.036c-.17.047-.318.131-.441.253l-.156.198A.958.958 0 009 6.98v.04a.728.728 0 00.086.378c.04.121.108.227.206.315.09.094.197.163.321.202.12.06.248.09.386.084l.266-.035c.17-.047.318-.131.441-.253l.156-.198A.958.958 0 0011 7.02v-.04a.728.728 0 00-.086-.378.721.721 0 00-.206-.315.757.757 0 00-.321-.202.767.767 0 00-.386-.084z"></path></svg></span><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1cbdvo6">(information)</span></div><style data-emotion="css fkfdww">.css-fkfdww{box-sizing:border-box;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;row-gap:0.5rem;-webkit-flex:1;-ms-flex:1;flex:1;}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-fkfdww"><style data-emotion="css kevsq9">.css-kevsq9{margin:0;padding:0;color:currentColor;font-size:0.875rem;line-height:1.25rem;font-weight:600;}</style><h2 data-paste-element="CALLOUT_HEADING" data-paste-core-version="20.6.0" class="css-kevsq9">Info</h2><style data-emotion="css 8tmauh">.css-8tmauh{display:grid;grid-gap:0;word-break:break-word;}.css-8tmauh >:last-child{margin-bottom:0;}.css-8tmauh ul,.css-8tmauh ol{margin-top:-0.5rem;}</style><style data-emotion="css 1ircowi">.css-1ircowi{box-sizing:border-box;display:grid;grid-gap:0;word-break:break-word;}.css-1ircowi >:last-child{margin-bottom:0;}.css-1ircowi ul,.css-1ircowi ol{margin-top:-0.5rem;}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1ircowi"><p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o">If you're curious about why we're using <code data-paste-element="INLINE_CODE" data-paste-core-version="20.7.0" class="css-1kwd7zr">axios</code> and keywords such as <code data-paste-element="INLINE_CODE" data-paste-core-version="20.7.0" class="css-1kwd7zr">async</code> and <code data-paste-element="INLINE_CODE" data-paste-core-version="20.7.0" class="css-1kwd7zr">await</code>, be sure to read up on <a data-paste-element="ANCHOR" data-paste-core-version="20.7.0" href="/docs/serverless/functions-assets/quickstart/api-request" title="how to make API requests in Functions" class="css-lpeit6">how to make API requests in Functions</a>.</p></div></div></div></div></section> <section id="return-json-to-a-studio-flow-based-on-input-parameters-section"><style data-emotion="css 104sreq">.css-104sreq{box-sizing:border-box;-webkit-align-items:start;-webkit-box-align:start;-ms-flex-align:start;align-items:start;margin-bottom:0.75rem;}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-104sreq"><style data-emotion="css 3y2hwy">.css-3y2hwy{margin:0;padding:0;color:rgb(18, 28, 45);font-size:1rem;line-height:1.5rem;margin-bottom:0.5rem;font-weight:600;letter-spacing:-.02em;display:inline;}</style><h4 data-paste-element="HEADING" data-paste-core-version="20.6.0" id="return-json-to-a-studio-flow-based-on-input-parameters" class="css-3y2hwy">Return JSON to a Studio Flow based on input parameters</h4><style data-emotion="css 138wi13">.css-138wi13{box-sizing:border-box;-webkit-text-decoration:none;text-decoration:none;margin-left:0.5rem;color:rgb(96, 107, 133);border-radius:2px;outline:none;display:inline-block;vertical-align:text-bottom;}.css-138wi13:hover{color:rgb(3, 11, 93);}.css-138wi13:focus{box-shadow:0 0 0 2px #ffffff,0 0 0 3px #006dfa,0 0 0 5px #cce4ff;color:rgb(3, 11, 93);}</style><a data-paste-element="BOX" data-paste-core-version="20.7.0" href="#return-json-to-a-studio-flow-based-on-input-parameters" class="css-138wi13"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" fill="none" viewBox="0 0 20 20" aria-labelledby="LinkIcon-:R1abslaatasm:"><title id="LinkIcon-:R1abslaatasm:">return-json-to-a-studio-flow-based-on-input-parameters page anchor</title><path fill="currentColor" d="M13.074 5.674a2.3 2.3 0 013.252 3.252l-2.97 2.97A2.3 2.3 0 019.869 8.92a.5.5 0 10-.808-.588 3.3 3.3 0 005.004 4.272l2.97-2.97a3.3 3.3 0 00-4.667-4.666l-.467.466a.5.5 0 10.707.707l.467-.466z"></path><path fill="currentColor" d="M9.18 7.163a2.3 2.3 0 011.952 3.65.5.5 0 10.809.59A3.3 3.3 0 006.936 7.13l-2.97 2.97a3.3 3.3 0 004.667 4.667l.58-.58a.5.5 0 10-.707-.707l-.58.58a2.3 2.3 0 11-3.252-3.252l2.97-2.97c.409-.41.958-.652 1.536-.675z"></path></svg></span></a></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-slcqjs"><div data-paste-element="CODE_BLOCK_WRAPPER" data-paste-core-version="20.7.0" class="css-1ft5k6i"><style data-emotion="css 1lrte93">.css-1lrte93{box-sizing:border-box;background-color:rgb(18, 28, 45);display:grid;grid-template-rows:auto 1fr;grid-template-areas:"button-group" "code-block";row-gap:0.25rem;padding-top:1rem;}</style><div data-paste-element="CODE_BLOCK" data-paste-core-version="20.7.0" class="css-1lrte93"><style data-emotion="css ba3ttd">.css-ba3ttd{box-sizing:border-box;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-column-gap:0.75rem;column-gap:0.75rem;-webkit-box-pack:end;-ms-flex-pack:end;-webkit-justify-content:flex-end;justify-content:flex-end;grid-area:button-group;padding-right:1.5rem;}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-ba3ttd"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><button data-paste-element="CODE_BLOCK_COPY_BUTTON" data-paste-core-version="20.7.0" type="button" tabindex="0" aria-describedby=":R9jajslaatasm:" aria-busy="false" class="css-11aawc9"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" viewBox="0 0 20 20" aria-labelledby="CopyIcon-:R1kppjajslaatasm:"><path fill="currentColor" fill-rule="evenodd" d="M13.469 2.5c.63 0 1.15.48 1.212 1.094l.007.125-.001 1.593h1.407c.73 0 1.331.558 1.4 1.271l.006.136v9.375c0 .776-.63 1.406-1.406 1.406H6.719c-.777 0-1.407-.63-1.407-1.406v-1.407H3.719c-.631 0-1.15-.48-1.213-1.094L2.5 13.47v-9.75c0-.631.48-1.15 1.094-1.213L3.72 2.5h9.75zm2.625 3.75H6.719a.469.469 0 00-.469.469v9.375c0 .259.21.468.469.468h9.375c.259 0 .468-.21.468-.468V6.719a.469.469 0 00-.468-.469zm-2.625-2.813h-9.75a.281.281 0 00-.274.217l-.007.065v9.75c0 .133.092.244.216.274l.065.007 1.593-.001v-7.03c0-.731.558-1.332 1.271-1.4l.136-.006 7.031-.001V3.719a.281.281 0 00-.217-.274l-.064-.007z"></path></svg></span><span data-paste-element="BOX" data-paste-core-version="20.7.0" aria-live="polite" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1cbdvo6">Copy code block</span></span></span></span></button></div></div><style data-emotion="css 1yf26d7">.css-1yf26d7{box-sizing:border-box;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;overflow-x:auto;grid-area:code-block;}</style><div data-paste-element="CODE_BLOCK_CONTENT" data-paste-core-version="20.7.0" class="css-1yf26d7"><pre data-theme="github-dark" data-lang="javascript" style="color:white;font-family:'TwilioSansMono', Courier, monospace;text-align:left;white-space:pre;word-spacing:normal;word-break:normal;word-wrap:normal;line-height:1.5;font-size:1em;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-hyphens:none;-moz-hyphens:none;-ms-hyphens:none;hyphens:none;margin:0;overflow:auto;background:inherit;width:100%;padding-bottom:2rem" tabindex="0" class="css-1p78m0" data-ch="true"><div style="min-width:fit-content"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><style data-emotion="css 1m136ci">.css-1m136ci{box-sizing:border-box;display:inline-block;box-sizing:content-box;opacity:0.5;padding-left:1.5rem;padding-right:1.5ch;text-align:right;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;min-width:2ch;}</style><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m136ci">1</span><style data-emotion="css luzz01">.css-luzz01{box-sizing:border-box;display:inline-block;}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div><span style="color:#FF7B72">const</span> <span style="color:#79C0FF">axios</span> <span style="color:#FF7B72">=</span> <span style="color:#D2A8FF">require</span><span style="color:#C9D1D9">(</span><span style="color:#A5D6FF">'axios'</span><span style="color:#C9D1D9">);</span> </div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m136ci">2</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div> </div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m136ci">3</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div><span style="color:#79C0FF">exports</span><span style="color:#C9D1D9">.</span><span style="color:#D2A8FF">handler</span> <span style="color:#FF7B72">= async</span> <span style="color:#C9D1D9">(</span><span style="color:#FFA657">context</span><span style="color:#C9D1D9">,</span> <span style="color:#FFA657">event</span><span style="color:#C9D1D9">,</span> <span style="color:#FFA657">callback</span><span style="color:#C9D1D9">)</span> <span style="color:#FF7B72">=></span> <span style="color:#C9D1D9">{</span> </div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m136ci">4</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div> <span style="color:#8B949E">// Any parameters provided to the Function will be accessible from `event`.</span> </div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m136ci">5</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div> <span style="color:#8B949E">// In Function Parameters, we defined `breed` as the inbound Body from</span> </div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m136ci">6</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div> <span style="color:#8B949E">// our Send & Wait For Reply Widget. We can access that via `event.breed`.</span> </div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m136ci">7</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div> <span style="color:#8B949E">// To minimize the potential for errors, lowercase and trim the user input.</span> </div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m136ci">8</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div> <span style="color:#FF7B72">let</span> <span style="color:#C9D1D9">dogBreed</span> <span style="color:#FF7B72">=</span> <span style="color:#C9D1D9">event.breed.</span><span style="color:#D2A8FF">toLowerCase</span><span style="color:#C9D1D9">().</span><span style="color:#D2A8FF">trim</span><span style="color:#C9D1D9">();</span> </div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m136ci">9</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div> </div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m136ci">10</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div> <span style="color:#8B949E">// The Dog API also supports sub-breeds, so we need to handle that case.</span> </div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m136ci">11</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div> <span style="color:#8B949E">// For example, if the user requests "Golden Retriever", we need to format</span> </div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m136ci">12</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div> <span style="color:#8B949E">// the breed as "retriever/golden".</span> </div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m136ci">13</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div> <span style="color:#FF7B72">if</span> <span style="color:#C9D1D9">(dogBreed.</span><span style="color:#D2A8FF">includes</span><span style="color:#C9D1D9">(</span><span style="color:#A5D6FF">' '</span><span style="color:#C9D1D9">)) {</span> </div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m136ci">14</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div> <span style="color:#FF7B72">const</span> <span style="color:#C9D1D9">[</span><span style="color:#79C0FF">subBreed</span><span style="color:#C9D1D9">,</span> <span style="color:#79C0FF">breed</span><span style="color:#C9D1D9">]</span> <span style="color:#FF7B72">=</span> <span style="color:#C9D1D9">dogBreed.</span><span style="color:#D2A8FF">split</span><span style="color:#C9D1D9">(</span><span style="color:#A5D6FF">' '</span><span style="color:#C9D1D9">);</span> </div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m136ci">15</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div> <span style="color:#C9D1D9">dogBreed</span> <span style="color:#FF7B72">=</span> <span style="color:#A5D6FF">`${</span><span style="color:#C9D1D9">breed</span><span style="color:#A5D6FF">}/${</span><span style="color:#C9D1D9">subBreed</span><span style="color:#A5D6FF">}`</span><span style="color:#C9D1D9">;</span> </div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m136ci">16</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div> <span style="color:#C9D1D9">}</span> </div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m136ci">17</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div> </div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m136ci">18</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div> <span style="color:#FF7B72">const</span> <span style="color:#79C0FF">dogApiUrl</span> <span style="color:#FF7B72">=</span> <span style="color:#A5D6FF">`https://dog.ceo/api/breed/${</span><span style="color:#C9D1D9">dogBreed</span><span style="color:#A5D6FF">}/images/random`</span><span style="color:#C9D1D9">;</span> </div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m136ci">19</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div> </div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m136ci">20</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div> <span style="color:#FF7B72">try</span> <span style="color:#C9D1D9">{</span> </div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m136ci">21</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div> <span style="color:#8B949E">// Make the request to the Dog API. Remember to use `await` since this</span> </div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m136ci">22</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div> <span style="color:#8B949E">// is an asynchronous request!</span> </div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m136ci">23</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div> <span style="color:#FF7B72">const</span> <span style="color:#79C0FF">response</span> <span style="color:#FF7B72">= await</span> <span style="color:#C9D1D9">axios.</span><span style="color:#D2A8FF">get</span><span style="color:#C9D1D9">(dogApiUrl);</span> </div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m136ci">24</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div> <span style="color:#8B949E">// Return the response to the Send & Wait For Reply Widget.</span> </div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m136ci">25</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div> <span style="color:#FF7B72">return</span> <span style="color:#D2A8FF">callback</span><span style="color:#C9D1D9">(</span><span style="color:#79C0FF">null</span><span style="color:#C9D1D9">, {</span> </div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m136ci">26</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div> <span style="color:#C9D1D9">text:</span> <span style="color:#A5D6FF">`Here's an image of a ${</span><span style="color:#C9D1D9">event</span><span style="color:#A5D6FF">.</span><span style="color:#C9D1D9">breed</span><span style="color:#A5D6FF">}! 🐶`</span><span style="color:#C9D1D9">,</span> </div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m136ci">27</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div> <span style="color:#8B949E">// The `message` property of the response is the URL of the dog image.</span> </div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m136ci">28</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div> <span style="color:#C9D1D9">url: response.data.message,</span> </div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m136ci">29</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div> <span style="color:#C9D1D9">});</span> </div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m136ci">30</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div> <span style="color:#C9D1D9">}</span> <span style="color:#FF7B72">catch</span> <span style="color:#C9D1D9">(error) {</span> </div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m136ci">31</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div> <span style="color:#8B949E">// Remember to handle any errors that may occur!</span> </div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m136ci">32</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div> <span style="color:#8B949E">// In the case of a 404, the breed was not found.</span> </div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m136ci">33</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div> <span style="color:#FF7B72">if</span> <span style="color:#C9D1D9">(error.response</span> <span style="color:#FF7B72">&&</span> <span style="color:#C9D1D9">error.response.status</span> <span style="color:#FF7B72">===</span> <span style="color:#79C0FF">404</span><span style="color:#C9D1D9">) {</span> </div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m136ci">34</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div> <span style="color:#FF7B72">return</span> <span style="color:#D2A8FF">callback</span><span style="color:#C9D1D9">(</span><span style="color:#79C0FF">null</span><span style="color:#C9D1D9">, {</span> </div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m136ci">35</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div> <span style="color:#C9D1D9">text:</span> <span style="color:#A5D6FF">`Sorry, we couldn't find any ${</span><span style="color:#C9D1D9">event</span><span style="color:#A5D6FF">.</span><span style="color:#C9D1D9">breed</span><span style="color:#A5D6FF">}s 🥲`</span><span style="color:#C9D1D9">,</span> </div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m136ci">36</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div> <span style="color:#C9D1D9">});</span> </div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m136ci">37</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div> <span style="color:#C9D1D9">}</span> </div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m136ci">38</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div> <span style="color:#8B949E">// Otherwise, there may have been a network or server error.</span> </div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m136ci">39</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div> <span style="color:#FF7B72">return</span> <span style="color:#D2A8FF">callback</span><span style="color:#C9D1D9">(error);</span> </div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m136ci">40</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div> <span style="color:#C9D1D9">}</span> </div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m136ci">41</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div><span style="color:#C9D1D9">};</span></div></div></div></div></pre></div></div></div></div></section> <section id="use-the-run-function-widget-section-indexable"><hr data-paste-element="SEPARATOR" data-paste-core-version="20.7.0" aria-orientation="horizontal" class="css-1y5brhz"/><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-m8ey6p"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-gt12nx"><h2 data-paste-element="HEADING" data-paste-core-version="20.6.0" id="use-the-run-function-widget" class="css-16k5vxt">Use the Run Function widget</h2><a data-paste-element="BOX" data-paste-core-version="20.7.0" href="#use-the-run-function-widget" class="css-f02h4i"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" fill="none" viewBox="0 0 20 20" aria-labelledby="LinkIcon-:R1aj8cclaatasm:"><title id="LinkIcon-:R1aj8cclaatasm:">use-the-run-function-widget page anchor</title><path fill="currentColor" d="M13.074 5.674a2.3 2.3 0 013.252 3.252l-2.97 2.97A2.3 2.3 0 019.869 8.92a.5.5 0 10-.808-.588 3.3 3.3 0 005.004 4.272l2.97-2.97a3.3 3.3 0 00-4.667-4.666l-.467.466a.5.5 0 10.707.707l.467-.466z"></path><path fill="currentColor" d="M9.18 7.163a2.3 2.3 0 011.952 3.65.5.5 0 10.809.59A3.3 3.3 0 006.936 7.13l-2.97 2.97a3.3 3.3 0 004.667 4.667l.58-.58a.5.5 0 10-.707-.707l-.58.58a2.3 2.3 0 11-3.252-3.252l2.97-2.97c.409-.41.958-.652 1.536-.675z"></path></svg></span></a></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1kam78h"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-knmi57"><button data-paste-element="BUTTON" data-paste-core-version="20.7.0" aria-pressed="false" type="button" aria-busy="false" class="css-1b15v5e"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" width="100%" height="100%" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" aria-labelledby="ThumbsUpIcon-:R9jal8cclaatasm:"><title id="ThumbsUpIcon-:R9jal8cclaatasm:">Positive Feedback</title><path fill="currentColor" fill-rule="evenodd" clip-rule="evenodd" d="M6.5 7.45c.194-.216.406-.451.628-.707.799-.922 1.608-1.972 1.898-2.838.314-.938 1.139-1.487 1.966-1.395a1.57 1.57 0 011.085.621c.277.363.423.85.423 1.43 0 .327-.081.645-.174.924-.062.186-.139.383-.208.56l-.088.226c-.092.245-.15.432-.166.582-.014.134.01.19.033.222l.001.001a.415.415 0 00.1.058 1.9 1.9 0 00.371.11c.32.068.725.106 1.152.124.632.026 1.237.01 1.634-.002.147-.004.265-.008.345-.008.25 0 .731.008 1.158.218.224.11.443.28.603.537.159.256.239.567.239.924 0 1.218-.524 3.647-1.553 5.695-.31.616-.693.885-1.18 1.193-.574.364-1.145.575-1.767.575h-3c-1.116 0-2.204-.418-3.002-.883a6.393 6.393 0 01-.498-.322v.372a.5.5 0 01-.5.5H3a.5.5 0 01-.5-.5V7a.5.5 0 01.5-.5h3a.5.5 0 01.5.5v.45zm3.474-3.228c.186-.554.611-.751.909-.718a.57.57 0 01.399.233c.114.15.218.409.218.824 0 .17-.044.37-.123.61a9.287 9.287 0 01-.177.474c-.034.087-.07.177-.105.273-.095.252-.194.542-.225.827-.032.297.005.636.23.935.135.178.322.291.491.367.175.078.372.134.571.176.4.084.869.125 1.317.144.676.028 1.382.008 1.767-.003.118-.003.206-.006.254-.006.25 0 .519.018.717.115.088.044.15.098.194.168.044.07.089.19.089.396 0 1.04-.476 3.316-1.447 5.246-.184.367-.375.516-.82.797-.468.296-.855.42-1.233.42h-3c-.884 0-1.796-.338-2.498-.747a4.464 4.464 0 01-.813-.591 1.36 1.36 0 01-.184-.207l-.005-.008V8.968a7.331 7.331 0 01.329-.39l.308-.343c.223-.246.483-.534.746-.837.788-.909 1.73-2.097 2.091-3.176zM5.5 7.5h-2v7.667h2V7.5z"></path></svg></span></span></button><button data-paste-element="BUTTON" data-paste-core-version="20.7.0" aria-pressed="false" type="button" aria-busy="false" class="css-1b15v5e"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" width="100%" height="100%" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" aria-labelledby="ThumbsDownIcon-:R9lal8cclaatasm:"><title id="ThumbsDownIcon-:R9lal8cclaatasm:">Negative Feedback</title><path fill="currentColor" fill-rule="evenodd" clip-rule="evenodd" d="M13.5 12.55c-.194.215-.406.451-.628.707-.799.921-1.608 1.972-1.898 2.838-.314.938-1.139 1.487-1.966 1.395a1.57 1.57 0 01-1.085-.621c-.277-.363-.423-.85-.423-1.43 0-.327.081-.645.174-.924.062-.186.139-.383.208-.56l.088-.226c.092-.245.15-.432.166-.582.014-.134-.01-.19-.033-.222l-.001-.001a.416.416 0 00-.1-.058 1.902 1.902 0 00-.371-.11 7.35 7.35 0 00-1.152-.124 22.958 22.958 0 00-1.634.002 14.2 14.2 0 01-.345.008c-.25 0-.731-.008-1.158-.218a1.451 1.451 0 01-.603-.537c-.159-.257-.239-.567-.239-.924 0-1.218.524-3.648 1.553-5.696.31-.616.693-.884 1.18-1.192C5.807 3.71 6.378 3.5 7 3.5h3c1.116 0 2.204.417 3.002.883.178.104.345.212.498.321v-.37a.5.5 0 01.5-.5h3a.5.5 0 01.5.5V13a.5.5 0 01-.5.5h-3a.5.5 0 01-.5-.5v-.45zm-3.474 3.227c-.186.554-.611.752-.909.72a.571.571 0 01-.399-.234c-.114-.15-.218-.409-.218-.824a2 2 0 01.123-.61c.054-.16.113-.312.177-.475.034-.086.07-.176.105-.272.095-.252.194-.542.225-.828.032-.296-.005-.635-.23-.934a1.23 1.23 0 00-.491-.367 2.874 2.874 0 00-.571-.176 8.31 8.31 0 00-1.317-.144c-.676-.029-1.381-.008-1.767.003-.118.003-.206.006-.254.006-.25 0-.519-.018-.717-.115a.452.452 0 01-.194-.168c-.044-.07-.089-.19-.089-.396 0-1.04.476-3.316 1.447-5.247.184-.366.375-.515.82-.796.468-.296.855-.42 1.233-.42h3c.884 0 1.796.337 2.498.747.349.203.628.414.813.59.093.09.152.16.184.208l.005.007v4.98a7.245 7.245 0 01-.329.39 54.1 54.1 0 01-.308.342c-.223.247-.483.534-.746.838-.788.909-1.73 2.096-2.091 3.175zM14.5 12.5h2V4.833h-2V12.5z"></path></svg></span></span></button></div></div></div><p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o">Once your prompt is complete, drag a <a data-paste-element="ANCHOR" data-paste-core-version="20.7.0" href="/docs/studio/widget-library/run-function" title="Run Function" class="css-lpeit6">Run Function</a> widget onto the canvas, and connect it to the <code data-paste-element="INLINE_CODE" data-paste-core-version="20.7.0" class="css-1kwd7zr">Reply</code> condition of the <code data-paste-element="INLINE_CODE" data-paste-core-version="20.7.0" class="css-1kwd7zr">request-breed</code> widget.</p><p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o">You'll be able to provide a name for the widget (<code data-paste-element="INLINE_CODE" data-paste-core-version="20.7.0" class="css-1kwd7zr">get-doge-image</code>), a configuration that will point this widget at your intended Function, and any parameters or arguments that you'd like to pass from the Flow to the Function when it's executed.</p><p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o">For this example, we'll point the Run Function widget at our Function, which was deployed to the <code data-paste-element="INLINE_CODE" data-paste-core-version="20.7.0" class="css-1kwd7zr">doge</code> Service in a production environment, and the path to the Function is <code data-paste-element="INLINE_CODE" data-paste-core-version="20.7.0" class="css-1kwd7zr">/get-doge</code>. Replace the Service, Environment, and Function configuration options with the values specific to the Function you created earlier.</p><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-wszb6a"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><img alt="Configuration for the Run Function widget to call the get-doge function with breed as an input parameter." loading="lazy" width="1600" height="1130" decoding="async" data-nimg="1" style="color:transparent;background-size:cover;background-position:50% 50%;background-repeat:no-repeat;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1600 1130'%3E%3Cfilter id='b' color-interpolation-filters='sRGB'%3E%3CfeGaussianBlur stdDeviation='20'/%3E%3CfeColorMatrix values='1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 100 -1' result='s'/%3E%3CfeFlood x='0' y='0' width='100%25' height='100%25'/%3E%3CfeComposite operator='out' in='s'/%3E%3CfeComposite in2='SourceGraphic'/%3E%3CfeGaussianBlur stdDeviation='20'/%3E%3C/filter%3E%3Cimage width='100%25' height='100%25' x='0' y='0' preserveAspectRatio='none' style='filter: url(%23b);' href='data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAADCAYAAAC09K7GAAAACXBIWXMAABYlAAAWJQFJUiTwAAAAPklEQVR4nAEzAMz/AB0QEv9JSU3/NTY6/5mUlP8AeHl6/3+Chv+EhYT/kJGR/wD4+vr/z8/Q/yklJv9ycnP/msQcz2yPaNkAAAAASUVORK5CYII='/%3E%3C/svg%3E")" srcSet="/_next/image?url=https%3A%2F%2Fdocs-assets.prod.twilio.com%2F57d777cb1509522026cb3096a92a3504848d2466357e6108733f4d1cac1c1139.png&w=1920&q=75&dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe 1x, /_next/image?url=https%3A%2F%2Fdocs-assets.prod.twilio.com%2F57d777cb1509522026cb3096a92a3504848d2466357e6108733f4d1cac1c1139.png&w=3840&q=75&dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe 2x" src="/_next/image?url=https%3A%2F%2Fdocs-assets.prod.twilio.com%2F57d777cb1509522026cb3096a92a3504848d2466357e6108733f4d1cac1c1139.png&w=3840&q=75&dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe"/><button data-paste-element="BUTTON" data-paste-core-version="20.7.0" type="button" aria-busy="false" class="css-zv9zrj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" fill="none" viewBox="0 0 20 20" aria-labelledby="ZoomInIcon-:Rcql5cclaatasm:"><path fill="currentColor" d="M5.5 8a.5.5 0 000 1H8v2.5a.5.5 0 101 0V9h2.5a.5.5 0 000-1H9V5.5a.5.5 0 00-1 0V8H5.5z"></path><path fill="currentColor" fill-rule="evenodd" d="M12.8 13.507a6.543 6.543 0 01-10.303-7.47 6.542 6.542 0 1111.01 6.762l4.347 4.347a.5.5 0 11-.708.707l-4.345-4.346zM5.464 3.933a5.542 5.542 0 016.997 8.526l-.014.015a5.543 5.543 0 11-6.983-8.54z" clip-rule="evenodd"></path></svg></span>Expand image</span></button></div></div><p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o">The final important configuration to note is the section labeled <strong>Function Parameters</strong>. Here, we define the parameters that we will pass to the Function's <code data-paste-element="INLINE_CODE" data-paste-core-version="20.7.0" class="css-1kwd7zr">event</code> object.</p><p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o">Here, we want to provide a variable called <code data-paste-element="INLINE_CODE" data-paste-core-version="20.7.0" class="css-1kwd7zr">breed</code> which is equal to the user's response to the prompt. We can do this by creating a new parameter, naming it <code data-paste-element="INLINE_CODE" data-paste-core-version="20.7.0" class="css-1kwd7zr">breed</code>, and setting the value to the user's response to the <code data-paste-element="INLINE_CODE" data-paste-core-version="20.7.0" class="css-1kwd7zr">request-breed</code> widget.</p><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-rj5eb"><div data-paste-element="CALLOUT" data-paste-core-version="20.7.0" class="css-1v816ix"><div data-paste-element="CALLOUT_ICON" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-1cst9vu"><svg role="img" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" viewBox="0 0 20 20" aria-labelledby="NeutralIcon-:R6da4claatasm:"><path fill="currentColor" fill-rule="evenodd" d="M10 2a8 8 0 110 16 8 8 0 010-16zm0 7c-.26.01-.528.08-.707.24-.178.158-.292.355-.292.575v3.37c0 .21.11.428.292.577.173.14.457.247.707.237.26-.008.528-.078.707-.237.178-.16.292-.355.292-.577v-3.37a.766.766 0 00-.292-.575A1.14 1.14 0 0010 9zm0-3l-.266.036c-.17.047-.318.131-.441.253l-.156.198A.958.958 0 009 6.98v.04a.728.728 0 00.086.378c.04.121.108.227.206.315.09.094.197.163.321.202.12.06.248.09.386.084l.266-.035c.17-.047.318-.131.441-.253l.156-.198A.958.958 0 0011 7.02v-.04a.728.728 0 00-.086-.378.721.721 0 00-.206-.315.757.757 0 00-.321-.202.767.767 0 00-.386-.084z"></path></svg></span><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1cbdvo6">(information)</span></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-fkfdww"><h2 data-paste-element="CALLOUT_HEADING" data-paste-core-version="20.6.0" class="css-kevsq9">Info</h2><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1ircowi"><p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o">We are using the Liquid template language to set a variable to the value gathered by the <code data-paste-element="INLINE_CODE" data-paste-core-version="20.7.0" class="css-1kwd7zr">request-breed</code> widget. Read the <a data-paste-element="ANCHOR" data-paste-core-version="20.7.0" href="/docs/studio/user-guide/liquid-template-language" title="Studio guide on Liquid" class="css-lpeit6">Studio guide on Liquid</a> to learn more about this syntax and what else you can do with these expressions!</p></div></div></div></div></section> <section id="consume-the-output-of-the-run-function-widget-section-indexable"><hr data-paste-element="SEPARATOR" data-paste-core-version="20.7.0" aria-orientation="horizontal" class="css-1y5brhz"/><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-m8ey6p"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-gt12nx"><h2 data-paste-element="HEADING" data-paste-core-version="20.6.0" id="consume-the-output-of-the-run-function-widget" class="css-16k5vxt">Consume the output of the Run Function widget</h2><a data-paste-element="BOX" data-paste-core-version="20.7.0" href="#consume-the-output-of-the-run-function-widget" class="css-f02h4i"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" fill="none" viewBox="0 0 20 20" aria-labelledby="LinkIcon-:R1aj8cslaatasm:"><title id="LinkIcon-:R1aj8cslaatasm:">consume-the-output-of-the-run-function-widget page anchor</title><path fill="currentColor" d="M13.074 5.674a2.3 2.3 0 013.252 3.252l-2.97 2.97A2.3 2.3 0 019.869 8.92a.5.5 0 10-.808-.588 3.3 3.3 0 005.004 4.272l2.97-2.97a3.3 3.3 0 00-4.667-4.666l-.467.466a.5.5 0 10.707.707l.467-.466z"></path><path fill="currentColor" d="M9.18 7.163a2.3 2.3 0 011.952 3.65.5.5 0 10.809.59A3.3 3.3 0 006.936 7.13l-2.97 2.97a3.3 3.3 0 004.667 4.667l.58-.58a.5.5 0 10-.707-.707l-.58.58a2.3 2.3 0 11-3.252-3.252l2.97-2.97c.409-.41.958-.652 1.536-.675z"></path></svg></span></a></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1kam78h"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-knmi57"><button data-paste-element="BUTTON" data-paste-core-version="20.7.0" aria-pressed="false" type="button" aria-busy="false" class="css-1b15v5e"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" width="100%" height="100%" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" aria-labelledby="ThumbsUpIcon-:R9jal8cslaatasm:"><title id="ThumbsUpIcon-:R9jal8cslaatasm:">Positive Feedback</title><path fill="currentColor" fill-rule="evenodd" clip-rule="evenodd" d="M6.5 7.45c.194-.216.406-.451.628-.707.799-.922 1.608-1.972 1.898-2.838.314-.938 1.139-1.487 1.966-1.395a1.57 1.57 0 011.085.621c.277.363.423.85.423 1.43 0 .327-.081.645-.174.924-.062.186-.139.383-.208.56l-.088.226c-.092.245-.15.432-.166.582-.014.134.01.19.033.222l.001.001a.415.415 0 00.1.058 1.9 1.9 0 00.371.11c.32.068.725.106 1.152.124.632.026 1.237.01 1.634-.002.147-.004.265-.008.345-.008.25 0 .731.008 1.158.218.224.11.443.28.603.537.159.256.239.567.239.924 0 1.218-.524 3.647-1.553 5.695-.31.616-.693.885-1.18 1.193-.574.364-1.145.575-1.767.575h-3c-1.116 0-2.204-.418-3.002-.883a6.393 6.393 0 01-.498-.322v.372a.5.5 0 01-.5.5H3a.5.5 0 01-.5-.5V7a.5.5 0 01.5-.5h3a.5.5 0 01.5.5v.45zm3.474-3.228c.186-.554.611-.751.909-.718a.57.57 0 01.399.233c.114.15.218.409.218.824 0 .17-.044.37-.123.61a9.287 9.287 0 01-.177.474c-.034.087-.07.177-.105.273-.095.252-.194.542-.225.827-.032.297.005.636.23.935.135.178.322.291.491.367.175.078.372.134.571.176.4.084.869.125 1.317.144.676.028 1.382.008 1.767-.003.118-.003.206-.006.254-.006.25 0 .519.018.717.115.088.044.15.098.194.168.044.07.089.19.089.396 0 1.04-.476 3.316-1.447 5.246-.184.367-.375.516-.82.797-.468.296-.855.42-1.233.42h-3c-.884 0-1.796-.338-2.498-.747a4.464 4.464 0 01-.813-.591 1.36 1.36 0 01-.184-.207l-.005-.008V8.968a7.331 7.331 0 01.329-.39l.308-.343c.223-.246.483-.534.746-.837.788-.909 1.73-2.097 2.091-3.176zM5.5 7.5h-2v7.667h2V7.5z"></path></svg></span></span></button><button data-paste-element="BUTTON" data-paste-core-version="20.7.0" aria-pressed="false" type="button" aria-busy="false" class="css-1b15v5e"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" width="100%" height="100%" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" aria-labelledby="ThumbsDownIcon-:R9lal8cslaatasm:"><title id="ThumbsDownIcon-:R9lal8cslaatasm:">Negative Feedback</title><path fill="currentColor" fill-rule="evenodd" clip-rule="evenodd" d="M13.5 12.55c-.194.215-.406.451-.628.707-.799.921-1.608 1.972-1.898 2.838-.314.938-1.139 1.487-1.966 1.395a1.57 1.57 0 01-1.085-.621c-.277-.363-.423-.85-.423-1.43 0-.327.081-.645.174-.924.062-.186.139-.383.208-.56l.088-.226c.092-.245.15-.432.166-.582.014-.134-.01-.19-.033-.222l-.001-.001a.416.416 0 00-.1-.058 1.902 1.902 0 00-.371-.11 7.35 7.35 0 00-1.152-.124 22.958 22.958 0 00-1.634.002 14.2 14.2 0 01-.345.008c-.25 0-.731-.008-1.158-.218a1.451 1.451 0 01-.603-.537c-.159-.257-.239-.567-.239-.924 0-1.218.524-3.648 1.553-5.696.31-.616.693-.884 1.18-1.192C5.807 3.71 6.378 3.5 7 3.5h3c1.116 0 2.204.417 3.002.883.178.104.345.212.498.321v-.37a.5.5 0 01.5-.5h3a.5.5 0 01.5.5V13a.5.5 0 01-.5.5h-3a.5.5 0 01-.5-.5v-.45zm-3.474 3.227c-.186.554-.611.752-.909.72a.571.571 0 01-.399-.234c-.114-.15-.218-.409-.218-.824a2 2 0 01.123-.61c.054-.16.113-.312.177-.475.034-.086.07-.176.105-.272.095-.252.194-.542.225-.828.032-.296-.005-.635-.23-.934a1.23 1.23 0 00-.491-.367 2.874 2.874 0 00-.571-.176 8.31 8.31 0 00-1.317-.144c-.676-.029-1.381-.008-1.767.003-.118.003-.206.006-.254.006-.25 0-.519-.018-.717-.115a.452.452 0 01-.194-.168c-.044-.07-.089-.19-.089-.396 0-1.04.476-3.316 1.447-5.247.184-.366.375-.515.82-.796.468-.296.855-.42 1.233-.42h3c.884 0 1.796.337 2.498.747.349.203.628.414.813.59.093.09.152.16.184.208l.005.007v4.98a7.245 7.245 0 01-.329.39 54.1 54.1 0 01-.308.342c-.223.247-.483.534-.746.838-.788.909-1.73 2.096-2.091 3.175zM14.5 12.5h2V4.833h-2V12.5z"></path></svg></span></span></button></div></div></div><p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o">With our prompt and Run Function widgets in place, the last step is to generate a response to the user which incorporates the Function's result.</p><p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o">Drag a <a data-paste-element="ANCHOR" data-paste-core-version="20.7.0" href="/docs/studio/widget-library/send-message" title="Send Message" class="css-lpeit6">Send Message</a> widget onto the canvas, and connect it to the <code data-paste-element="INLINE_CODE" data-paste-core-version="20.7.0" class="css-1kwd7zr">Success</code> condition of the <code data-paste-element="INLINE_CODE" data-paste-core-version="20.7.0" class="css-1kwd7zr">get-doge-image</code> widget.</p><p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o">The configuration for this widget is much shorter, and consists only of a name for the widget, the text body, and any media URL (s) you may want to attach. Luckily, the <code data-paste-element="INLINE_CODE" data-paste-core-version="20.7.0" class="css-1kwd7zr">/get-doge</code> Function returns <code data-paste-element="INLINE_CODE" data-paste-core-version="20.7.0" class="css-1kwd7zr">text</code> and <code data-paste-element="INLINE_CODE" data-paste-core-version="20.7.0" class="css-1kwd7zr">uri</code> values for us, so we can template these values into the config using <a data-paste-element="ANCHOR" data-paste-core-version="20.7.0" href="/docs/studio/user-guide/liquid-template-language" title="Liquid" class="css-lpeit6">Liquid</a>.</p><p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o">In order to access the return value of a Run Function widget, you will need to access a special property called <code data-paste-element="INLINE_CODE" data-paste-core-version="20.7.0" class="css-1kwd7zr">parsed</code>. This object will contain any and all contents returned by the targeted Function.</p><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-rj5eb"><div data-paste-element="CALLOUT" data-paste-core-version="20.7.0" class="css-1v816ix"><div data-paste-element="CALLOUT_ICON" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-1cst9vu"><svg role="img" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" viewBox="0 0 20 20" aria-labelledby="NeutralIcon-:R6d9kslaatasm:"><path fill="currentColor" fill-rule="evenodd" d="M10 2a8 8 0 110 16 8 8 0 010-16zm0 7c-.26.01-.528.08-.707.24-.178.158-.292.355-.292.575v3.37c0 .21.11.428.292.577.173.14.457.247.707.237.26-.008.528-.078.707-.237.178-.16.292-.355.292-.577v-3.37a.766.766 0 00-.292-.575A1.14 1.14 0 0010 9zm0-3l-.266.036c-.17.047-.318.131-.441.253l-.156.198A.958.958 0 009 6.98v.04a.728.728 0 00.086.378c.04.121.108.227.206.315.09.094.197.163.321.202.12.06.248.09.386.084l.266-.035c.17-.047.318-.131.441-.253l.156-.198A.958.958 0 0011 7.02v-.04a.728.728 0 00-.086-.378.721.721 0 00-.206-.315.757.757 0 00-.321-.202.767.767 0 00-.386-.084z"></path></svg></span><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1cbdvo6">(information)</span></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-fkfdww"><h2 data-paste-element="CALLOUT_HEADING" data-paste-core-version="20.6.0" class="css-kevsq9">Info</h2><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1ircowi"><p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o">The general syntax to access a property from the result of a Run Function widget is <code data-paste-element="INLINE_CODE" data-paste-core-version="20.7.0" class="css-1kwd7zr">{{widgets.<widget-name>.parsed.<property>}}</code>.</p></div></div></div></div><p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o">For example, to access the <code data-paste-element="INLINE_CODE" data-paste-core-version="20.7.0" class="css-1kwd7zr">text</code> and <code data-paste-element="INLINE_CODE" data-paste-core-version="20.7.0" class="css-1kwd7zr">url</code> returned from the <code data-paste-element="INLINE_CODE" data-paste-core-version="20.7.0" class="css-1kwd7zr">get-doge-image</code> widget, the respective Liquid template strings would be the following:</p><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-slcqjs"><div data-paste-element="CODE_BLOCK_WRAPPER" data-paste-core-version="20.7.0" class="css-1ft5k6i"><div data-paste-element="CODE_BLOCK" data-paste-core-version="20.7.0" class="css-1lrte93"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-ba3ttd"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><button data-paste-element="CODE_BLOCK_COPY_BUTTON" data-paste-core-version="20.7.0" type="button" tabindex="0" aria-describedby=":R16da4slaatasm:" aria-busy="false" class="css-11aawc9"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" viewBox="0 0 20 20" aria-labelledby="CopyIcon-:R6j76da4slaatasm:"><path fill="currentColor" fill-rule="evenodd" d="M13.469 2.5c.63 0 1.15.48 1.212 1.094l.007.125-.001 1.593h1.407c.73 0 1.331.558 1.4 1.271l.006.136v9.375c0 .776-.63 1.406-1.406 1.406H6.719c-.777 0-1.407-.63-1.407-1.406v-1.407H3.719c-.631 0-1.15-.48-1.213-1.094L2.5 13.47v-9.75c0-.631.48-1.15 1.094-1.213L3.72 2.5h9.75zm2.625 3.75H6.719a.469.469 0 00-.469.469v9.375c0 .259.21.468.469.468h9.375c.259 0 .468-.21.468-.468V6.719a.469.469 0 00-.468-.469zm-2.625-2.813h-9.75a.281.281 0 00-.274.217l-.007.065v9.75c0 .133.092.244.216.274l.065.007 1.593-.001v-7.03c0-.731.558-1.332 1.271-1.4l.136-.006 7.031-.001V3.719a.281.281 0 00-.217-.274l-.064-.007z"></path></svg></span><span data-paste-element="BOX" data-paste-core-version="20.7.0" aria-live="polite" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1cbdvo6">Copy code block</span></span></span></span></button></div></div><div data-paste-element="CODE_BLOCK_CONTENT" data-paste-core-version="20.7.0" class="css-1yf26d7"><pre data-theme="github-dark" data-lang="shellscript" style="color:white;font-family:'TwilioSansMono', Courier, monospace;text-align:left;white-space:pre;word-spacing:normal;word-break:normal;word-wrap:normal;line-height:1.5;font-size:1em;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-hyphens:none;-moz-hyphens:none;-ms-hyphens:none;hyphens:none;margin:0;overflow:auto;background:inherit;width:100%;padding-bottom:2rem" tabindex="0" class="css-1p78m0" data-ch="true"><div style="min-width:fit-content"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><style data-emotion="css 519pyc">.css-519pyc{box-sizing:border-box;display:inline-block;box-sizing:content-box;opacity:0.5;padding-left:1.5rem;padding-right:1.5ch;text-align:right;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;min-width:1ch;}</style><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-519pyc">1</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div><span style="color:#C9D1D9">{{widgets.get-doge-image.parsed.text}}</span> </div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-519pyc">2</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div><span style="color:#C9D1D9">{{widgets.get-doge-image.parsed.url}}</span></div></div></div></div></pre></div></div></div></div><p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o">Once you have set <strong>Message Body</strong> to <code data-paste-element="INLINE_CODE" data-paste-core-version="20.7.0" class="css-1kwd7zr">{{widgets.get-doge-image.parsed.text}}</code> and <strong>Media URL</strong> to <code data-paste-element="INLINE_CODE" data-paste-core-version="20.7.0" class="css-1kwd7zr">{{widgets.get-doge-image.parsed.url}}</code> on the Send Message widget, your configuration should look like this:</p><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-wszb6a"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><img alt="Define the configuration of the Send Message widget using liquid template values from the Run Function output." loading="lazy" width="1600" height="831" decoding="async" data-nimg="1" style="color:transparent;background-size:cover;background-position:50% 50%;background-repeat:no-repeat;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1600 831'%3E%3Cfilter id='b' color-interpolation-filters='sRGB'%3E%3CfeGaussianBlur stdDeviation='20'/%3E%3CfeColorMatrix values='1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 100 -1' result='s'/%3E%3CfeFlood x='0' y='0' width='100%25' height='100%25'/%3E%3CfeComposite operator='out' in='s'/%3E%3CfeComposite in2='SourceGraphic'/%3E%3CfeGaussianBlur stdDeviation='20'/%3E%3C/filter%3E%3Cimage width='100%25' height='100%25' x='0' y='0' preserveAspectRatio='none' style='filter: url(%23b);' href='data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAACCAYAAAB/qH1jAAAACXBIWXMAABYlAAAWJQFJUiTwAAAALUlEQVR4nAEiAN3/AHNwcf+GjJD/IiIm/5qXl/8Aq7Cz/5KSlf99env/1dfY/0TXFN7L6MSnAAAAAElFTkSuQmCC'/%3E%3C/svg%3E")" srcSet="/_next/image?url=https%3A%2F%2Fdocs-assets.prod.twilio.com%2Fc4d76302ce943d5b8a1bb59546da381516775118e8c4b20b847943c58a4dca93.png&w=1920&q=75&dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe 1x, /_next/image?url=https%3A%2F%2Fdocs-assets.prod.twilio.com%2Fc4d76302ce943d5b8a1bb59546da381516775118e8c4b20b847943c58a4dca93.png&w=3840&q=75&dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe 2x" src="/_next/image?url=https%3A%2F%2Fdocs-assets.prod.twilio.com%2Fc4d76302ce943d5b8a1bb59546da381516775118e8c4b20b847943c58a4dca93.png&w=3840&q=75&dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe"/><button data-paste-element="BUTTON" data-paste-core-version="20.7.0" type="button" aria-busy="false" class="css-zv9zrj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" fill="none" viewBox="0 0 20 20" aria-labelledby="ZoomInIcon-:Rcql6kslaatasm:"><path fill="currentColor" d="M5.5 8a.5.5 0 000 1H8v2.5a.5.5 0 101 0V9h2.5a.5.5 0 000-1H9V5.5a.5.5 0 00-1 0V8H5.5z"></path><path fill="currentColor" fill-rule="evenodd" d="M12.8 13.507a6.543 6.543 0 01-10.303-7.47 6.542 6.542 0 1111.01 6.762l4.347 4.347a.5.5 0 11-.708.707l-4.345-4.346zM5.464 3.933a5.542 5.542 0 016.997 8.526l-.014.015a5.543 5.543 0 11-6.983-8.54z" clip-rule="evenodd"></path></svg></span>Expand image</span></button></div></div></section> <section id="test-it-section-indexable"><hr data-paste-element="SEPARATOR" data-paste-core-version="20.7.0" aria-orientation="horizontal" class="css-1y5brhz"/><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-m8ey6p"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-gt12nx"><h2 data-paste-element="HEADING" data-paste-core-version="20.6.0" id="test-it" class="css-16k5vxt">Test it</h2><a data-paste-element="BOX" data-paste-core-version="20.7.0" href="#test-it" class="css-f02h4i"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" fill="none" viewBox="0 0 20 20" aria-labelledby="LinkIcon-:Rl9kdclaatasm:"><title id="LinkIcon-:Rl9kdclaatasm:">test-it page anchor</title><path fill="currentColor" d="M13.074 5.674a2.3 2.3 0 013.252 3.252l-2.97 2.97A2.3 2.3 0 019.869 8.92a.5.5 0 10-.808-.588 3.3 3.3 0 005.004 4.272l2.97-2.97a3.3 3.3 0 00-4.667-4.666l-.467.466a.5.5 0 10.707.707l.467-.466z"></path><path fill="currentColor" d="M9.18 7.163a2.3 2.3 0 011.952 3.65.5.5 0 10.809.59A3.3 3.3 0 006.936 7.13l-2.97 2.97a3.3 3.3 0 004.667 4.667l.58-.58a.5.5 0 10-.707-.707l-.58.58a2.3 2.3 0 11-3.252-3.252l2.97-2.97c.409-.41.958-.652 1.536-.675z"></path></svg></span></a></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1kam78h"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-knmi57"><button data-paste-element="BUTTON" data-paste-core-version="20.7.0" aria-pressed="false" type="button" aria-busy="false" class="css-1b15v5e"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" width="100%" height="100%" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" aria-labelledby="ThumbsUpIcon-:R4plakdclaatasm:"><title id="ThumbsUpIcon-:R4plakdclaatasm:">Positive Feedback</title><path fill="currentColor" fill-rule="evenodd" clip-rule="evenodd" d="M6.5 7.45c.194-.216.406-.451.628-.707.799-.922 1.608-1.972 1.898-2.838.314-.938 1.139-1.487 1.966-1.395a1.57 1.57 0 011.085.621c.277.363.423.85.423 1.43 0 .327-.081.645-.174.924-.062.186-.139.383-.208.56l-.088.226c-.092.245-.15.432-.166.582-.014.134.01.19.033.222l.001.001a.415.415 0 00.1.058 1.9 1.9 0 00.371.11c.32.068.725.106 1.152.124.632.026 1.237.01 1.634-.002.147-.004.265-.008.345-.008.25 0 .731.008 1.158.218.224.11.443.28.603.537.159.256.239.567.239.924 0 1.218-.524 3.647-1.553 5.695-.31.616-.693.885-1.18 1.193-.574.364-1.145.575-1.767.575h-3c-1.116 0-2.204-.418-3.002-.883a6.393 6.393 0 01-.498-.322v.372a.5.5 0 01-.5.5H3a.5.5 0 01-.5-.5V7a.5.5 0 01.5-.5h3a.5.5 0 01.5.5v.45zm3.474-3.228c.186-.554.611-.751.909-.718a.57.57 0 01.399.233c.114.15.218.409.218.824 0 .17-.044.37-.123.61a9.287 9.287 0 01-.177.474c-.034.087-.07.177-.105.273-.095.252-.194.542-.225.827-.032.297.005.636.23.935.135.178.322.291.491.367.175.078.372.134.571.176.4.084.869.125 1.317.144.676.028 1.382.008 1.767-.003.118-.003.206-.006.254-.006.25 0 .519.018.717.115.088.044.15.098.194.168.044.07.089.19.089.396 0 1.04-.476 3.316-1.447 5.246-.184.367-.375.516-.82.797-.468.296-.855.42-1.233.42h-3c-.884 0-1.796-.338-2.498-.747a4.464 4.464 0 01-.813-.591 1.36 1.36 0 01-.184-.207l-.005-.008V8.968a7.331 7.331 0 01.329-.39l.308-.343c.223-.246.483-.534.746-.837.788-.909 1.73-2.097 2.091-3.176zM5.5 7.5h-2v7.667h2V7.5z"></path></svg></span></span></button><button data-paste-element="BUTTON" data-paste-core-version="20.7.0" aria-pressed="false" type="button" aria-busy="false" class="css-1b15v5e"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" width="100%" height="100%" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" aria-labelledby="ThumbsDownIcon-:R4qlakdclaatasm:"><title id="ThumbsDownIcon-:R4qlakdclaatasm:">Negative Feedback</title><path fill="currentColor" fill-rule="evenodd" clip-rule="evenodd" d="M13.5 12.55c-.194.215-.406.451-.628.707-.799.921-1.608 1.972-1.898 2.838-.314.938-1.139 1.487-1.966 1.395a1.57 1.57 0 01-1.085-.621c-.277-.363-.423-.85-.423-1.43 0-.327.081-.645.174-.924.062-.186.139-.383.208-.56l.088-.226c.092-.245.15-.432.166-.582.014-.134-.01-.19-.033-.222l-.001-.001a.416.416 0 00-.1-.058 1.902 1.902 0 00-.371-.11 7.35 7.35 0 00-1.152-.124 22.958 22.958 0 00-1.634.002 14.2 14.2 0 01-.345.008c-.25 0-.731-.008-1.158-.218a1.451 1.451 0 01-.603-.537c-.159-.257-.239-.567-.239-.924 0-1.218.524-3.648 1.553-5.696.31-.616.693-.884 1.18-1.192C5.807 3.71 6.378 3.5 7 3.5h3c1.116 0 2.204.417 3.002.883.178.104.345.212.498.321v-.37a.5.5 0 01.5-.5h3a.5.5 0 01.5.5V13a.5.5 0 01-.5.5h-3a.5.5 0 01-.5-.5v-.45zm-3.474 3.227c-.186.554-.611.752-.909.72a.571.571 0 01-.399-.234c-.114-.15-.218-.409-.218-.824a2 2 0 01.123-.61c.054-.16.113-.312.177-.475.034-.086.07-.176.105-.272.095-.252.194-.542.225-.828.032-.296-.005-.635-.23-.934a1.23 1.23 0 00-.491-.367 2.874 2.874 0 00-.571-.176 8.31 8.31 0 00-1.317-.144c-.676-.029-1.381-.008-1.767.003-.118.003-.206.006-.254.006-.25 0-.519-.018-.717-.115a.452.452 0 01-.194-.168c-.044-.07-.089-.19-.089-.396 0-1.04.476-3.316 1.447-5.247.184-.366.375-.515.82-.796.468-.296.855-.42 1.233-.42h3c.884 0 1.796.337 2.498.747.349.203.628.414.813.59.093.09.152.16.184.208l.005.007v4.98a7.245 7.245 0 01-.329.39 54.1 54.1 0 01-.308.342c-.223.247-.483.534-.746.838-.788.909-1.73 2.096-2.091 3.175zM14.5 12.5h2V4.833h-2V12.5z"></path></svg></span></span></button></div></div></div><p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o">With the Function deployed and all the widgets in the Studio Flow connected and configured, all that's left is to see this little application in action. If you haven't already, click the <strong>Publish</strong> button on the Studio canvas to save all your progress on the Flow and ensure that its code is live.</p><p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o">Next, you'll want to connect this Flow to one of your Twilio phone numbers. You can follow <a data-paste-element="ANCHOR" data-paste-core-version="20.7.0" href="/docs/studio/user-guide#configuring-your-twilio-number-for-studio" title="these directions" class="css-lpeit6">these directions</a> in order to do so.</p><p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o">Once you have published your Flow and connected it to your Twilio phone number, send it a brief message to start the conversation. A simple "Ahoy!" will do. Respond to the incoming prompt with a breed of dog, and you will see an MMS of that breed after a momentary delay.</p><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-wszb6a"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><img alt="Flow example with a golden retriever." loading="lazy" width="1080" height="1376" decoding="async" data-nimg="1" style="color:transparent;background-size:cover;background-position:50% 50%;background-repeat:no-repeat;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1080 1376'%3E%3Cfilter id='b' color-interpolation-filters='sRGB'%3E%3CfeGaussianBlur stdDeviation='20'/%3E%3CfeColorMatrix values='1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 100 -1' result='s'/%3E%3CfeFlood x='0' y='0' width='100%25' height='100%25'/%3E%3CfeComposite operator='out' in='s'/%3E%3CfeComposite in2='SourceGraphic'/%3E%3CfeGaussianBlur stdDeviation='20'/%3E%3C/filter%3E%3Cimage width='100%25' height='100%25' x='0' y='0' preserveAspectRatio='none' style='filter: url(%23b);' href='data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAMAAAAECAIAAADETxJQAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAM0lEQVR4nAEoANf/AF1nbXF1eby/xwA1LzFjVlnCy9IAy6KjtJOWAAUIAO7z/+De7iIjJmvJEsrG7rR7AAAAAElFTkSuQmCC'/%3E%3C/svg%3E")" srcSet="/_next/image?url=https%3A%2F%2Fdocs-assets.prod.twilio.com%2F739cdb68721dedba77ba90d69562c89cccfebb9de32c496ea8d9c3502e9b7721.jpg&w=1080&q=75&dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe 1x, /_next/image?url=https%3A%2F%2Fdocs-assets.prod.twilio.com%2F739cdb68721dedba77ba90d69562c89cccfebb9de32c496ea8d9c3502e9b7721.jpg&w=3840&q=75&dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe 2x" src="/_next/image?url=https%3A%2F%2Fdocs-assets.prod.twilio.com%2F739cdb68721dedba77ba90d69562c89cccfebb9de32c496ea8d9c3502e9b7721.jpg&w=3840&q=75&dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe"/><button data-paste-element="BUTTON" data-paste-core-version="20.7.0" type="button" aria-busy="false" class="css-zv9zrj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" fill="none" viewBox="0 0 20 20" aria-labelledby="ZoomInIcon-:R6dajdclaatasm:"><path fill="currentColor" d="M5.5 8a.5.5 0 000 1H8v2.5a.5.5 0 101 0V9h2.5a.5.5 0 000-1H9V5.5a.5.5 0 00-1 0V8H5.5z"></path><path fill="currentColor" fill-rule="evenodd" d="M12.8 13.507a6.543 6.543 0 01-10.303-7.47 6.542 6.542 0 1111.01 6.762l4.347 4.347a.5.5 0 11-.708.707l-4.345-4.346zM5.464 3.933a5.542 5.542 0 016.997 8.526l-.014.015a5.543 5.543 0 11-6.983-8.54z" clip-rule="evenodd"></path></svg></span>Expand image</span></button></div></div></section> <section id="go-further-with-loops-and-failure-flows-section-indexable"><hr data-paste-element="SEPARATOR" data-paste-core-version="20.7.0" aria-orientation="horizontal" class="css-1y5brhz"/><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-m8ey6p"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-gt12nx"><h2 data-paste-element="HEADING" data-paste-core-version="20.6.0" id="go-further-with-loops-and-failure-flows" class="css-16k5vxt">Go further with loops and failure flows</h2><a data-paste-element="BOX" data-paste-core-version="20.7.0" href="#go-further-with-loops-and-failure-flows" class="css-f02h4i"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" fill="none" viewBox="0 0 20 20" aria-labelledby="LinkIcon-:R1aj8dslaatasm:"><title id="LinkIcon-:R1aj8dslaatasm:">go-further-with-loops-and-failure-flows page anchor</title><path fill="currentColor" d="M13.074 5.674a2.3 2.3 0 013.252 3.252l-2.97 2.97A2.3 2.3 0 019.869 8.92a.5.5 0 10-.808-.588 3.3 3.3 0 005.004 4.272l2.97-2.97a3.3 3.3 0 00-4.667-4.666l-.467.466a.5.5 0 10.707.707l.467-.466z"></path><path fill="currentColor" d="M9.18 7.163a2.3 2.3 0 011.952 3.65.5.5 0 10.809.59A3.3 3.3 0 006.936 7.13l-2.97 2.97a3.3 3.3 0 004.667 4.667l.58-.58a.5.5 0 10-.707-.707l-.58.58a2.3 2.3 0 11-3.252-3.252l2.97-2.97c.409-.41.958-.652 1.536-.675z"></path></svg></span></a></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1kam78h"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-knmi57"><button data-paste-element="BUTTON" data-paste-core-version="20.7.0" aria-pressed="false" type="button" aria-busy="false" class="css-1b15v5e"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" width="100%" height="100%" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" aria-labelledby="ThumbsUpIcon-:R9jal8dslaatasm:"><title id="ThumbsUpIcon-:R9jal8dslaatasm:">Positive Feedback</title><path fill="currentColor" fill-rule="evenodd" clip-rule="evenodd" d="M6.5 7.45c.194-.216.406-.451.628-.707.799-.922 1.608-1.972 1.898-2.838.314-.938 1.139-1.487 1.966-1.395a1.57 1.57 0 011.085.621c.277.363.423.85.423 1.43 0 .327-.081.645-.174.924-.062.186-.139.383-.208.56l-.088.226c-.092.245-.15.432-.166.582-.014.134.01.19.033.222l.001.001a.415.415 0 00.1.058 1.9 1.9 0 00.371.11c.32.068.725.106 1.152.124.632.026 1.237.01 1.634-.002.147-.004.265-.008.345-.008.25 0 .731.008 1.158.218.224.11.443.28.603.537.159.256.239.567.239.924 0 1.218-.524 3.647-1.553 5.695-.31.616-.693.885-1.18 1.193-.574.364-1.145.575-1.767.575h-3c-1.116 0-2.204-.418-3.002-.883a6.393 6.393 0 01-.498-.322v.372a.5.5 0 01-.5.5H3a.5.5 0 01-.5-.5V7a.5.5 0 01.5-.5h3a.5.5 0 01.5.5v.45zm3.474-3.228c.186-.554.611-.751.909-.718a.57.57 0 01.399.233c.114.15.218.409.218.824 0 .17-.044.37-.123.61a9.287 9.287 0 01-.177.474c-.034.087-.07.177-.105.273-.095.252-.194.542-.225.827-.032.297.005.636.23.935.135.178.322.291.491.367.175.078.372.134.571.176.4.084.869.125 1.317.144.676.028 1.382.008 1.767-.003.118-.003.206-.006.254-.006.25 0 .519.018.717.115.088.044.15.098.194.168.044.07.089.19.089.396 0 1.04-.476 3.316-1.447 5.246-.184.367-.375.516-.82.797-.468.296-.855.42-1.233.42h-3c-.884 0-1.796-.338-2.498-.747a4.464 4.464 0 01-.813-.591 1.36 1.36 0 01-.184-.207l-.005-.008V8.968a7.331 7.331 0 01.329-.39l.308-.343c.223-.246.483-.534.746-.837.788-.909 1.73-2.097 2.091-3.176zM5.5 7.5h-2v7.667h2V7.5z"></path></svg></span></span></button><button data-paste-element="BUTTON" data-paste-core-version="20.7.0" aria-pressed="false" type="button" aria-busy="false" class="css-1b15v5e"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" width="100%" height="100%" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" aria-labelledby="ThumbsDownIcon-:R9lal8dslaatasm:"><title id="ThumbsDownIcon-:R9lal8dslaatasm:">Negative Feedback</title><path fill="currentColor" fill-rule="evenodd" clip-rule="evenodd" d="M13.5 12.55c-.194.215-.406.451-.628.707-.799.921-1.608 1.972-1.898 2.838-.314.938-1.139 1.487-1.966 1.395a1.57 1.57 0 01-1.085-.621c-.277-.363-.423-.85-.423-1.43 0-.327.081-.645.174-.924.062-.186.139-.383.208-.56l.088-.226c.092-.245.15-.432.166-.582.014-.134-.01-.19-.033-.222l-.001-.001a.416.416 0 00-.1-.058 1.902 1.902 0 00-.371-.11 7.35 7.35 0 00-1.152-.124 22.958 22.958 0 00-1.634.002 14.2 14.2 0 01-.345.008c-.25 0-.731-.008-1.158-.218a1.451 1.451 0 01-.603-.537c-.159-.257-.239-.567-.239-.924 0-1.218.524-3.648 1.553-5.696.31-.616.693-.884 1.18-1.192C5.807 3.71 6.378 3.5 7 3.5h3c1.116 0 2.204.417 3.002.883.178.104.345.212.498.321v-.37a.5.5 0 01.5-.5h3a.5.5 0 01.5.5V13a.5.5 0 01-.5.5h-3a.5.5 0 01-.5-.5v-.45zm-3.474 3.227c-.186.554-.611.752-.909.72a.571.571 0 01-.399-.234c-.114-.15-.218-.409-.218-.824a2 2 0 01.123-.61c.054-.16.113-.312.177-.475.034-.086.07-.176.105-.272.095-.252.194-.542.225-.828.032-.296-.005-.635-.23-.934a1.23 1.23 0 00-.491-.367 2.874 2.874 0 00-.571-.176 8.31 8.31 0 00-1.317-.144c-.676-.029-1.381-.008-1.767.003-.118.003-.206.006-.254.006-.25 0-.519-.018-.717-.115a.452.452 0 01-.194-.168c-.044-.07-.089-.19-.089-.396 0-1.04.476-3.316 1.447-5.247.184-.366.375-.515.82-.796.468-.296.855-.42 1.233-.42h3c.884 0 1.796.337 2.498.747.349.203.628.414.813.59.093.09.152.16.184.208l.005.007v4.98a7.245 7.245 0 01-.329.39 54.1 54.1 0 01-.308.342c-.223.247-.483.534-.746.838-.788.909-1.73 2.096-2.091 3.175zM14.5 12.5h2V4.833h-2V12.5z"></path></svg></span></span></button></div></div></div><p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o">So far, while the Function code does contain some catch logic, it otherwise doesn't really have any resilience to missing breed types or even network errors, and it definitely doesn't show that to the user. To improve the experience, let's see what happens if we expand our flow to handle the fail condition of <code data-paste-element="INLINE_CODE" data-paste-core-version="20.7.0" class="css-1kwd7zr">get-doge-image</code>.</p><p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o">To get started, drag a new Send Message widget onto the canvas, give it a name such as <code data-paste-element="INLINE_CODE" data-paste-core-version="20.7.0" class="css-1kwd7zr">send-fail-message</code>, and connect it to the <code data-paste-element="INLINE_CODE" data-paste-core-version="20.7.0" class="css-1kwd7zr">Fail</code> transition from <code data-paste-element="INLINE_CODE" data-paste-core-version="20.7.0" class="css-1kwd7zr">get-doge-image</code>. By doing this, we're introducing an alternative flow of logic for our application in case the Function runs into an error.</p><p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o">To take this a step further, connect the <code data-paste-element="INLINE_CODE" data-paste-core-version="20.7.0" class="css-1kwd7zr">Sent</code> condition of the newly made <code data-paste-element="INLINE_CODE" data-paste-core-version="20.7.0" class="css-1kwd7zr">send-fail-message</code> to <code data-paste-element="INLINE_CODE" data-paste-core-version="20.7.0" class="css-1kwd7zr">get-doge-image</code>. In doing so, you've just created a loop! If the Function fails to get a dog image, the flow will send the user a message then try to re-run the Function, and will do so until it succeeds.</p><p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o">Set the message body to <code data-paste-element="INLINE_CODE" data-paste-core-version="20.7.0" class="css-1kwd7zr">{{widgets.get-doge-image.body}} Trying again!</code>, click <strong>Save</strong>, and finally click <strong>Publish</strong> to publish this update to the flow.</p><p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o">These connections and the configuration for <code data-paste-element="INLINE_CODE" data-paste-core-version="20.7.0" class="css-1kwd7zr">send-fail-message</code> should appear as shown below:</p><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-wszb6a"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><img alt="Create a retry loop by connecting the Run Function Fail transition to a Send Message widget." loading="lazy" width="1600" height="911" decoding="async" data-nimg="1" style="color:transparent;background-size:cover;background-position:50% 50%;background-repeat:no-repeat;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1600 911'%3E%3Cfilter id='b' color-interpolation-filters='sRGB'%3E%3CfeGaussianBlur stdDeviation='20'/%3E%3CfeColorMatrix values='1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 100 -1' result='s'/%3E%3CfeFlood x='0' y='0' width='100%25' height='100%25'/%3E%3CfeComposite operator='out' in='s'/%3E%3CfeComposite in2='SourceGraphic'/%3E%3CfeGaussianBlur stdDeviation='20'/%3E%3C/filter%3E%3Cimage width='100%25' height='100%25' x='0' y='0' preserveAspectRatio='none' style='filter: url(%23b);' href='data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAACCAYAAAB/qH1jAAAACXBIWXMAABYlAAAWJQFJUiTwAAAAK0lEQVR4nGNQEpf4HxMe8X/Tnm3/+3r6/jOoKCv/T0rN/P/lw+f/jXX1/wEjMRMQ3s4SLQAAAABJRU5ErkJggg=='/%3E%3C/svg%3E")" srcSet="/_next/image?url=https%3A%2F%2Fdocs-assets.prod.twilio.com%2F30f6bc37a7548ad7297d4769d4d1500961b04befb6e4bf3bebdb2df22513ea56.png&w=1920&q=75&dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe 1x, /_next/image?url=https%3A%2F%2Fdocs-assets.prod.twilio.com%2F30f6bc37a7548ad7297d4769d4d1500961b04befb6e4bf3bebdb2df22513ea56.png&w=3840&q=75&dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe 2x" src="/_next/image?url=https%3A%2F%2Fdocs-assets.prod.twilio.com%2F30f6bc37a7548ad7297d4769d4d1500961b04befb6e4bf3bebdb2df22513ea56.png&w=3840&q=75&dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe"/><button data-paste-element="BUTTON" data-paste-core-version="20.7.0" type="button" aria-busy="false" class="css-zv9zrj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" fill="none" viewBox="0 0 20 20" aria-labelledby="ZoomInIcon-:Rcql5tslaatasm:"><path fill="currentColor" d="M5.5 8a.5.5 0 000 1H8v2.5a.5.5 0 101 0V9h2.5a.5.5 0 000-1H9V5.5a.5.5 0 00-1 0V8H5.5z"></path><path fill="currentColor" fill-rule="evenodd" d="M12.8 13.507a6.543 6.543 0 01-10.303-7.47 6.542 6.542 0 1111.01 6.762l4.347 4.347a.5.5 0 11-.708.707l-4.345-4.346zM5.464 3.933a5.542 5.542 0 016.997 8.526l-.014.015a5.543 5.543 0 11-6.983-8.54z" clip-rule="evenodd"></path></svg></span>Expand image</span></button></div></div><p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o">With the flow updated to handle failures from our Function, let's quickly edit our code to make it artificially error-prone; only for the sake of testing, of course!</p></section> <section id="randomly-return-an-error-instead-of-json-section"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-104sreq"><h4 data-paste-element="HEADING" data-paste-core-version="20.6.0" id="randomly-return-an-error-instead-of-json" class="css-3y2hwy">Randomly return an error instead of JSON</h4><a data-paste-element="BOX" data-paste-core-version="20.7.0" href="#randomly-return-an-error-instead-of-json" class="css-138wi13"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" fill="none" viewBox="0 0 20 20" aria-labelledby="LinkIcon-:R2keclaatasm:"><title id="LinkIcon-:R2keclaatasm:">randomly-return-an-error-instead-of-json page anchor</title><path fill="currentColor" d="M13.074 5.674a2.3 2.3 0 013.252 3.252l-2.97 2.97A2.3 2.3 0 019.869 8.92a.5.5 0 10-.808-.588 3.3 3.3 0 005.004 4.272l2.97-2.97a3.3 3.3 0 00-4.667-4.666l-.467.466a.5.5 0 10.707.707l.467-.466z"></path><path fill="currentColor" d="M9.18 7.163a2.3 2.3 0 011.952 3.65.5.5 0 10.809.59A3.3 3.3 0 006.936 7.13l-2.97 2.97a3.3 3.3 0 004.667 4.667l.58-.58a.5.5 0 10-.707-.707l-.58.58a2.3 2.3 0 11-3.252-3.252l2.97-2.97c.409-.41.958-.652 1.536-.675z"></path></svg></span></a></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-slcqjs"><div data-paste-element="CODE_BLOCK_WRAPPER" data-paste-core-version="20.7.0" class="css-1ft5k6i"><div data-paste-element="CODE_BLOCK" data-paste-core-version="20.7.0" class="css-1lrte93"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-ba3ttd"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><button data-paste-element="CODE_BLOCK_COPY_BUTTON" data-paste-core-version="20.7.0" type="button" tabindex="0" aria-describedby=":Rj6kmclaatasm:" aria-busy="false" class="css-11aawc9"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" viewBox="0 0 20 20" aria-labelledby="CopyIcon-:R39jj6kmclaatasm:"><path fill="currentColor" fill-rule="evenodd" d="M13.469 2.5c.63 0 1.15.48 1.212 1.094l.007.125-.001 1.593h1.407c.73 0 1.331.558 1.4 1.271l.006.136v9.375c0 .776-.63 1.406-1.406 1.406H6.719c-.777 0-1.407-.63-1.407-1.406v-1.407H3.719c-.631 0-1.15-.48-1.213-1.094L2.5 13.47v-9.75c0-.631.48-1.15 1.094-1.213L3.72 2.5h9.75zm2.625 3.75H6.719a.469.469 0 00-.469.469v9.375c0 .259.21.468.469.468h9.375c.259 0 .468-.21.468-.468V6.719a.469.469 0 00-.468-.469zm-2.625-2.813h-9.75a.281.281 0 00-.274.217l-.007.065v9.75c0 .133.092.244.216.274l.065.007 1.593-.001v-7.03c0-.731.558-1.332 1.271-1.4l.136-.006 7.031-.001V3.719a.281.281 0 00-.217-.274l-.064-.007z"></path></svg></span><span data-paste-element="BOX" data-paste-core-version="20.7.0" aria-live="polite" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1cbdvo6">Copy code block</span></span></span></span></button></div></div><div data-paste-element="CODE_BLOCK_CONTENT" data-paste-core-version="20.7.0" class="css-1yf26d7"><pre data-theme="github-dark" data-lang="javascript" style="color:white;font-family:'TwilioSansMono', Courier, monospace;text-align:left;white-space:pre;word-spacing:normal;word-break:normal;word-wrap:normal;line-height:1.5;font-size:1em;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-hyphens:none;-moz-hyphens:none;-ms-hyphens:none;hyphens:none;margin:0;overflow:auto;background:inherit;width:100%;padding-bottom:2rem" tabindex="0" class="css-1p78m0" data-ch="true"><div style="min-width:fit-content"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m136ci">1</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div><span style="color:#FF7B72">const</span> <span style="color:#79C0FF">axios</span> <span style="color:#FF7B72">=</span> <span style="color:#D2A8FF">require</span><span style="color:#C9D1D9">(</span><span style="color:#A5D6FF">'axios'</span><span style="color:#C9D1D9">);</span> </div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m136ci">2</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div> </div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m136ci">3</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div><span style="color:#79C0FF">exports</span><span style="color:#C9D1D9">.</span><span style="color:#D2A8FF">handler</span> <span style="color:#FF7B72">= async</span> <span style="color:#C9D1D9">(</span><span style="color:#FFA657">context</span><span style="color:#C9D1D9">,</span> <span style="color:#FFA657">event</span><span style="color:#C9D1D9">,</span> <span style="color:#FFA657">callback</span><span style="color:#C9D1D9">)</span> <span style="color:#FF7B72">=></span> <span style="color:#C9D1D9">{</span> </div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m136ci">4</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div> <span style="color:#8B949E">// In Function Parameters, we defined `breed` as the inbound Body from</span> </div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m136ci">5</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div> <span style="color:#8B949E">// our Send & Wait For Reply Widget. We can access that via `event.breed`.</span> </div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m136ci">6</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div> <span style="color:#8B949E">// To minimize the potential for errors, lowercase and trim the user input.</span> </div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m136ci">7</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div> <span style="color:#FF7B72">let</span> <span style="color:#C9D1D9">breed</span> <span style="color:#FF7B72">=</span> <span style="color:#C9D1D9">event.breed.</span><span style="color:#D2A8FF">toLowerCase</span><span style="color:#C9D1D9">().</span><span style="color:#D2A8FF">trim</span><span style="color:#C9D1D9">();</span> </div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m136ci">8</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div> </div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m136ci">9</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div> <span style="color:#8B949E">// The Dog API also supports sub-breeds, so we need to handle that case.</span> </div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m136ci">10</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div> <span style="color:#8B949E">// For example, if the user requests "Golden Retriever", we need to format</span> </div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m136ci">11</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div> <span style="color:#8B949E">// the breed as "retriever/golden".</span> </div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m136ci">12</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div> <span style="color:#FF7B72">if</span> <span style="color:#C9D1D9">(breed.</span><span style="color:#D2A8FF">includes</span><span style="color:#C9D1D9">(</span><span style="color:#A5D6FF">' '</span><span style="color:#C9D1D9">)) {</span> </div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m136ci">13</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div> <span style="color:#FF7B72">const</span> <span style="color:#C9D1D9">[</span><span style="color:#79C0FF">first</span><span style="color:#C9D1D9">,</span> <span style="color:#79C0FF">second</span><span style="color:#C9D1D9">]</span> <span style="color:#FF7B72">=</span> <span style="color:#C9D1D9">breed.</span><span style="color:#D2A8FF">split</span><span style="color:#C9D1D9">(</span><span style="color:#A5D6FF">' '</span><span style="color:#C9D1D9">);</span> </div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m136ci">14</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div> <span style="color:#C9D1D9">breed</span> <span style="color:#FF7B72">=</span> <span style="color:#A5D6FF">`${</span><span style="color:#C9D1D9">second</span><span style="color:#A5D6FF">}/${</span><span style="color:#C9D1D9">first</span><span style="color:#A5D6FF">}`</span><span style="color:#C9D1D9">;</span> </div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m136ci">15</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div> <span style="color:#C9D1D9">}</span> </div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m136ci">16</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div> </div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m136ci">17</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div> <span style="color:#FF7B72">const</span> <span style="color:#79C0FF">dogApiUrl</span> <span style="color:#FF7B72">=</span> <span style="color:#A5D6FF">`https://dog.ceo/api/breed/${</span><span style="color:#C9D1D9">breed</span><span style="color:#A5D6FF">}/images/random`</span><span style="color:#C9D1D9">;</span> </div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m136ci">18</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div> </div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m136ci">19</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div> <span style="color:#FF7B72">try</span> <span style="color:#C9D1D9">{</span> </div></div></div><style data-emotion="css qrrnn4">.css-qrrnn4{box-sizing:border-box;background-color:#ffffff0b;box-shadow:inset 4px 0 0 0 rgb(153, 205, 255);}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qrrnn4"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m136ci">20</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div> <span style="color:#8B949E">// Let's introduce some inconsistency by randomly throwing an error</span> </div></div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qrrnn4"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m136ci">21</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div> <span style="color:#FF7B72">if</span> <span style="color:#C9D1D9">(Math.</span><span style="color:#D2A8FF">random</span><span style="color:#C9D1D9">()</span> <span style="color:#FF7B72">></span> <span style="color:#79C0FF">0.3</span><span style="color:#C9D1D9">)</span> <span style="color:#FF7B72">throw new</span> <span style="color:#D2A8FF">Error</span><span style="color:#C9D1D9">(</span><span style="color:#A5D6FF">'No doge~'</span><span style="color:#C9D1D9">);</span> </div></div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m136ci">22</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div> <span style="color:#8B949E">// Make the request to the Dog API. Remember to use `await` since this</span> </div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m136ci">23</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div> <span style="color:#8B949E">// is an asynchronous request!</span> </div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m136ci">24</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div> <span style="color:#FF7B72">const</span> <span style="color:#79C0FF">response</span> <span style="color:#FF7B72">= await</span> <span style="color:#C9D1D9">axios.</span><span style="color:#D2A8FF">get</span><span style="color:#C9D1D9">(dogApiUrl);</span> </div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m136ci">25</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div> <span style="color:#8B949E">// Return the response to the Send & Wait For Reply Widget.</span> </div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m136ci">26</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div> <span style="color:#FF7B72">return</span> <span style="color:#D2A8FF">callback</span><span style="color:#C9D1D9">(</span><span style="color:#79C0FF">null</span><span style="color:#C9D1D9">, {</span> </div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m136ci">27</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div> <span style="color:#C9D1D9">text:</span> <span style="color:#A5D6FF">`Here's an image of a ${</span><span style="color:#C9D1D9">event</span><span style="color:#A5D6FF">.</span><span style="color:#C9D1D9">breed</span><span style="color:#A5D6FF">}! 🐶`</span><span style="color:#C9D1D9">,</span> </div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m136ci">28</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div> <span style="color:#8B949E">// The `message` property of the response is the URL of the dog image.</span> </div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m136ci">29</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div> <span style="color:#C9D1D9">url: response.data.message,</span> </div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m136ci">30</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div> <span style="color:#C9D1D9">});</span> </div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m136ci">31</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div> <span style="color:#C9D1D9">}</span> <span style="color:#FF7B72">catch</span> <span style="color:#C9D1D9">(error) {</span> </div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m136ci">32</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div> <span style="color:#8B949E">// Remember to handle any errors that may occur!</span> </div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qrrnn4"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m136ci">33</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div> <span style="color:#8B949E">// This error message will be accessible as `widgets.get-doge-image.body`</span> </div></div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qrrnn4"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m136ci">34</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div> <span style="color:#FF7B72">return</span> <span style="color:#D2A8FF">callback</span><span style="color:#C9D1D9">(</span><span style="color:#A5D6FF">`Sorry, we couldn't find any ${</span><span style="color:#C9D1D9">event</span><span style="color:#A5D6FF">.</span><span style="color:#C9D1D9">breed</span><span style="color:#A5D6FF">}s 🥲`</span><span style="color:#C9D1D9">);</span> </div></div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m136ci">35</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div> <span style="color:#C9D1D9">}</span> </div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m136ci">36</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div><span style="color:#C9D1D9">};</span></div></div></div></div></pre></div></div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-rj5eb"><div data-paste-element="CALLOUT" data-paste-core-version="20.7.0" class="css-1v816ix"><div data-paste-element="CALLOUT_ICON" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-1cst9vu"><svg role="img" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" viewBox="0 0 20 20" aria-labelledby="NeutralIcon-:R36kuclaatasm:"><path fill="currentColor" fill-rule="evenodd" d="M10 2a8 8 0 110 16 8 8 0 010-16zm0 7c-.26.01-.528.08-.707.24-.178.158-.292.355-.292.575v3.37c0 .21.11.428.292.577.173.14.457.247.707.237.26-.008.528-.078.707-.237.178-.16.292-.355.292-.577v-3.37a.766.766 0 00-.292-.575A1.14 1.14 0 0010 9zm0-3l-.266.036c-.17.047-.318.131-.441.253l-.156.198A.958.958 0 009 6.98v.04a.728.728 0 00.086.378c.04.121.108.227.206.315.09.094.197.163.321.202.12.06.248.09.386.084l.266-.035c.17-.047.318-.131.441-.253l.156-.198A.958.958 0 0011 7.02v-.04a.728.728 0 00-.086-.378.721.721 0 00-.206-.315.757.757 0 00-.321-.202.767.767 0 00-.386-.084z"></path></svg></span><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1cbdvo6">(information)</span></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-fkfdww"><h2 data-paste-element="CALLOUT_HEADING" data-paste-core-version="20.6.0" class="css-kevsq9">Info</h2><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1ircowi"><p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o">To get access to a returned error message, you will need to access the <code data-paste-element="INLINE_CODE" data-paste-core-version="20.7.0" class="css-1kwd7zr">body</code> property returned by the Run Function Widget. This will look like <code data-paste-element="INLINE_CODE" data-paste-core-version="20.7.0" class="css-1kwd7zr">{{widgets.<widget-name>.body}}</code> if used in a liquid template.</p></div></div></div></div><p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o">Deploy your Function with this updated code, and once completed, send a new message to your Twilio phone number. Between this code change and the new widget in the Studio flow, you will (most likely, this is random, of course) see one or more error messages, ultimately followed by an image of your requested dog breed!</p><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-wszb6a"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><img alt="Error recovery loop and message." loading="lazy" width="1507" height="2048" decoding="async" data-nimg="1" style="color:transparent;background-size:cover;background-position:50% 50%;background-repeat:no-repeat;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1507 2048'%3E%3Cfilter id='b' color-interpolation-filters='sRGB'%3E%3CfeGaussianBlur stdDeviation='20'/%3E%3CfeColorMatrix values='1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 100 -1' result='s'/%3E%3CfeFlood x='0' y='0' width='100%25' height='100%25'/%3E%3CfeComposite operator='out' in='s'/%3E%3CfeComposite in2='SourceGraphic'/%3E%3CfeGaussianBlur stdDeviation='20'/%3E%3C/filter%3E%3Cimage width='100%25' height='100%25' x='0' y='0' preserveAspectRatio='none' style='filter: url(%23b);' href='data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAMAAAAECAIAAADETxJQAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAM0lEQVR4nAEoANf/ADc8RUJCRKexxgBianBcW15WXWkA//b20cvLAAMPANna4KeenBEUGkgvESNscZ39AAAAAElFTkSuQmCC'/%3E%3C/svg%3E")" srcSet="/_next/image?url=https%3A%2F%2Fdocs-assets.prod.twilio.com%2F509282620f794e4dc6d2d862d733c1d5ce847dbddf08f9d57e26964488870927.jpg&w=1920&q=75&dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe 1x, /_next/image?url=https%3A%2F%2Fdocs-assets.prod.twilio.com%2F509282620f794e4dc6d2d862d733c1d5ce847dbddf08f9d57e26964488870927.jpg&w=3840&q=75&dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe 2x" src="/_next/image?url=https%3A%2F%2Fdocs-assets.prod.twilio.com%2F509282620f794e4dc6d2d862d733c1d5ce847dbddf08f9d57e26964488870927.jpg&w=3840&q=75&dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe"/><button data-paste-element="BUTTON" data-paste-core-version="20.7.0" type="button" aria-busy="false" class="css-zv9zrj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" fill="none" viewBox="0 0 20 20" aria-labelledby="ZoomInIcon-:R6dajeclaatasm:"><path fill="currentColor" d="M5.5 8a.5.5 0 000 1H8v2.5a.5.5 0 101 0V9h2.5a.5.5 0 000-1H9V5.5a.5.5 0 00-1 0V8H5.5z"></path><path fill="currentColor" fill-rule="evenodd" d="M12.8 13.507a6.543 6.543 0 01-10.303-7.47 6.542 6.542 0 1111.01 6.762l4.347 4.347a.5.5 0 11-.708.707l-4.345-4.346zM5.464 3.933a5.542 5.542 0 016.997 8.526l-.014.015a5.543 5.543 0 11-6.983-8.54z" clip-rule="evenodd"></path></svg></span>Expand image</span></button></div></div><p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o">This is a very brief introduction to what is possible! Instead of a retry loop with a message, you could create an entirely new, logical flow of widgets where you ask the user for other information; your imagination is the only true limit here.</p></section></div></div></div><style data-emotion="css n7gvag">.css-n7gvag{box-sizing:border-box;margin-top:2rem;margin-bottom:2rem;margin-left:1.75rem;margin-right:1.75rem;padding-top:4.75rem;position:relative;}@media screen and (min-width: 768px){.css-n7gvag{margin-top:2rem;margin-bottom:2rem;margin-left:1.75rem;margin-right:1.75rem;}}@media screen and (min-width: 1024px){.css-n7gvag{margin-top:3rem;margin-bottom:3rem;margin-left:2.25rem;margin-right:2.25rem;}}@media screen and (min-width: 1385px){.css-n7gvag{margin-left:2.75rem;margin-right:2.75rem;}}</style><footer data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-n7gvag"><style data-emotion="css pg6uce">.css-pg6uce{box-sizing:border-box;border-radius:4px;background-color:rgb(18, 28, 45);margin-top:0;padding-top:0;}@media screen and (min-width: 768px){.css-pg6uce{margin-top:0;padding-top:0;}}@media screen and (min-width: 1024px){.css-pg6uce{margin-top:0;padding-top:0;}}@media screen and (min-width: 1385px){.css-pg6uce{margin-top:0;padding-top:0;}}@media screen and (min-width: 1942px){.css-pg6uce{margin-top:4.75rem;padding-top:4.75rem;}}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-pg6uce"><style data-emotion="css wzkleb">.css-wzkleb{box-sizing:border-box;max-width:77rem;padding:2rem;margin-top:0.125rem;margin-left:auto;margin-right:auto;position:relative;}@media screen and (min-width: 768px){.css-wzkleb{padding:4.25rem;}}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-wzkleb"><style data-emotion="css 1xkeua1">.css-1xkeua1{box-sizing:border-box;display:none;right:0;position:absolute;}@media screen and (min-width: 768px){.css-1xkeua1{display:none;}}@media screen and (min-width: 1024px){.css-1xkeua1{display:none;}}@media screen and (min-width: 1385px){.css-1xkeua1{display:block;}}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1xkeua1"><img aria-hidden="true" role="img" alt="" loading="lazy" width="460" height="324" decoding="async" data-nimg="1" style="color:transparent" src="/_next/static/media/footer-min.eb6c3e3d.svg"/></div><style data-emotion="css 1bt0omd">.css-1bt0omd{box-sizing:border-box;position:relative;}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1bt0omd"><style data-emotion="css 1uxvx9z">.css-1uxvx9z{box-sizing:border-box;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;margin-bottom:1.75rem;text-align:center;}@media screen and (min-width: 768px){.css-1uxvx9z{-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;text-align:left;}}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1uxvx9z"><style data-emotion="css 1y16khy">.css-1y16khy{margin:0;padding:0;color:rgb(255, 255, 255);font-size:1.25rem;line-height:1.75rem;font-family:'TwilioSansDisplay','Inter var experimental','Inter var',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Oxygen-Sans,Ubuntu,Cantarell,'Helvetica Neue',sans-serif;font-weight:800;margin-top:0.75rem;}@media screen and (min-width: 400px){.css-1y16khy{font-size:2rem;line-height:2.5rem;margin-top:0;}}</style><h2 data-paste-element="TEXT" data-paste-core-version="20.6.0" class="css-1y16khy">Need some help?</h2></div><style data-emotion="css 1hxyz3w">.css-1hxyz3w{box-sizing:border-box;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;text-align:center;}@media screen and (min-width: 768px){.css-1hxyz3w{-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;text-align:left;}}</style><nav data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1hxyz3w"><style data-emotion="css 1b5a60l">.css-1b5a60l{box-sizing:border-box;-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;margin-bottom:1.25rem;margin-right:0;max-width:100%;}@media screen and (min-width: 768px){.css-1b5a60l{-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;margin-right:3rem;max-width:100%;}}@media screen and (min-width: 1024px){.css-1b5a60l{-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;max-width:100%;}}@media screen and (min-width: 1385px){.css-1b5a60l{-webkit-box-flex:0;-webkit-flex-grow:0;-ms-flex-positive:0;flex-grow:0;max-width:calc(100% - 28rem);}}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1b5a60l"><style data-emotion="css w6f2uy">.css-w6f2uy{margin:0;padding:0;color:rgb(255, 255, 255);font-size:1rem;line-height:1.25rem;}</style><p data-paste-element="TEXT" data-paste-core-version="20.6.0" class="css-w6f2uy">We all do sometimes; code is hard. Get help now from our <style data-emotion="css 1az6u6g">.css-1az6u6g{box-sizing:border-box;color:rgb(255, 255, 255);font-size:inherit;font-weight:inherit;line-height:inherit;outline:none;-webkit-text-decoration:underline;text-decoration:underline;}.css-1az6u6g:active,.css-1az6u6g[data-active=true]{color:rgb(255, 255, 255);-webkit-text-decoration:none;text-decoration:none;}.css-1az6u6g:focus{box-shadow:0 0 0 1px #394762,0 0 0 3px #121c2d,0 0 0 4px #ffffff,0 0 0 6px rgba(255, 255, 255, 0.2);color:rgb(255, 255, 255);-webkit-text-decoration:underline;text-decoration:underline;border-radius:4px;}.css-1az6u6g:hover{color:rgb(255, 255, 255);-webkit-text-decoration:none;text-decoration:none;}</style><a data-paste-element="ANCHOR" data-paste-core-version="20.7.0" href="https://help.twilio.com" rel="noreferrer noopener" target="_blank" title="support team" class="css-1az6u6g"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj">support team<span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1ezs782"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" viewBox="0 0 20 20" aria-labelledby="LinkExternalIcon-:Rl9ailaetasm:"><title id="LinkExternalIcon-:Rl9ailaetasm:">(link takes you to an external page)</title><path fill="currentColor" fill-rule="evenodd" d="M8.4 4.5a.5.5 0 01.5.5v.1a.5.5 0 01-.5.5H5.6v8.8h8.8v-2.8a.5.5 0 01.41-.492l.09-.008h.1a.5.5 0 01.492.41l.008.09V15a.5.5 0 01-.41.492L15 15.5H5a.5.5 0 01-.492-.41L4.5 15V5a.5.5 0 01.41-.492L5 4.5h3.4zm6.6 0a.5.5 0 01.5.5v.1l-.001.01.001 3.29a.5.5 0 01-.5.5h-.1a.5.5 0 01-.5-.5l-.001-1.935-3.967 3.967a.611.611 0 01-.78.07l-.084-.07a.611.611 0 01-.07-.78l.07-.084L13.534 5.6H11.6a.5.5 0 01-.5-.5V5a.5.5 0 01.5-.5H15z"></path></svg></span></span></span></a>, or lean on the wisdom of the crowd by visiting Twilio's <a data-paste-element="ANCHOR" data-paste-core-version="20.7.0" href="https://stackoverflow.com/collectives/twilio" rel="noreferrer noopener" target="_blank" title="Stack Overflow Collective" class="css-1az6u6g"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj">Stack Overflow Collective<span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1ezs782"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" viewBox="0 0 20 20" aria-labelledby="LinkExternalIcon-:Rlaailaetasm:"><title id="LinkExternalIcon-:Rlaailaetasm:">(link takes you to an external page)</title><path fill="currentColor" fill-rule="evenodd" d="M8.4 4.5a.5.5 0 01.5.5v.1a.5.5 0 01-.5.5H5.6v8.8h8.8v-2.8a.5.5 0 01.41-.492l.09-.008h.1a.5.5 0 01.492.41l.008.09V15a.5.5 0 01-.41.492L15 15.5H5a.5.5 0 01-.492-.41L4.5 15V5a.5.5 0 01.41-.492L5 4.5h3.4zm6.6 0a.5.5 0 01.5.5v.1l-.001.01.001 3.29a.5.5 0 01-.5.5h-.1a.5.5 0 01-.5-.5l-.001-1.935-3.967 3.967a.611.611 0 01-.78.07l-.084-.07a.611.611 0 01-.07-.78l.07-.084L13.534 5.6H11.6a.5.5 0 01-.5-.5V5a.5.5 0 01.5-.5H15z"></path></svg></span></span></span></a> or browsing the <a data-paste-element="ANCHOR" data-paste-core-version="20.7.0" href="https://stackoverflow.com/questions/tagged/twilio" rel="noreferrer noopener" target="_blank" title="Twilio tag" class="css-1az6u6g"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj">Twilio tag<span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1ezs782"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" viewBox="0 0 20 20" aria-labelledby="LinkExternalIcon-:Rlbailaetasm:"><title id="LinkExternalIcon-:Rlbailaetasm:">(link takes you to an external page)</title><path fill="currentColor" fill-rule="evenodd" d="M8.4 4.5a.5.5 0 01.5.5v.1a.5.5 0 01-.5.5H5.6v8.8h8.8v-2.8a.5.5 0 01.41-.492l.09-.008h.1a.5.5 0 01.492.41l.008.09V15a.5.5 0 01-.41.492L15 15.5H5a.5.5 0 01-.492-.41L4.5 15V5a.5.5 0 01.41-.492L5 4.5h3.4zm6.6 0a.5.5 0 01.5.5v.1l-.001.01.001 3.29a.5.5 0 01-.5.5h-.1a.5.5 0 01-.5-.5l-.001-1.935-3.967 3.967a.611.611 0 01-.78.07l-.084-.07a.611.611 0 01-.07-.78l.07-.084L13.534 5.6H11.6a.5.5 0 01-.5-.5V5a.5.5 0 01.5-.5H15z"></path></svg></span></span></span></a> on Stack Overflow.</p></div></nav><style data-emotion="css 1o3xt00">.css-1o3xt00{box-sizing:border-box;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;margin-top:2.75rem;text-align:center;}@media screen and (min-width: 768px){.css-1o3xt00{-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;text-align:left;}}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1o3xt00"><style data-emotion="css 2ch0jy">.css-2ch0jy{box-sizing:border-box;display:block;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-flex-wrap:wrap;-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap;}@media screen and (min-width: 768px){.css-2ch0jy{display:block;}}@media screen and (min-width: 1024px){.css-2ch0jy{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}}</style><div data-paste-element="STACK" data-paste-core-version="20.7.0" class="css-2ch0jy"><style data-emotion="css 1hsc1sb">.css-1hsc1sb{box-sizing:border-box;margin-right:0;margin-bottom:1.25rem;}@media screen and (min-width: 768px){.css-1hsc1sb{margin-right:0;margin-bottom:1.25rem;}}@media screen and (min-width: 1024px){.css-1hsc1sb{margin-right:1.25rem;margin-bottom:0;}}</style><div data-paste-element="STACK_CHILD" data-paste-core-version="20.7.0" class="css-1hsc1sb"><style data-emotion="css 6i08t">.css-6i08t{color:rgb(255, 255, 255);}</style><a class="css-6i08t" href="/en-us/legal/tos">Terms of service</a></div><div data-paste-element="STACK_CHILD" data-paste-core-version="20.7.0" class="css-1hsc1sb"><a class="css-6i08t" href="/en-us/legal/privacy">Privacy Policy</a></div><div data-paste-element="STACK_CHILD" data-paste-core-version="20.7.0" class="css-roynbj"><style data-emotion="css g9v2ra">.css-g9v2ra{margin:0;padding:0;color:rgb(255, 255, 255);font-size:0.875rem;line-height:1.25rem;}</style><p data-paste-element="TEXT" data-paste-core-version="20.6.0" class="css-g9v2ra">Copyright © 2024 Twilio Inc.</p></div></div></div><style data-emotion="css 1gyumqz">.css-1gyumqz{box-sizing:border-box;margin-top:2.75rem;text-align:center;}@media screen and (min-width: 768px){.css-1gyumqz{text-align:left;}}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1gyumqz"><a href="https://twilio.com/" aria-label="Go to Twilio homepage"><span style="color:rgb(255, 255, 255);width:5.5rem;height:1.5rem;display:inline-block"><svg aria-hidden="true" aria-labelledby=":Rklaetasm:" height="100%" role="img" viewBox="0 0 88 24" width="100%"><title id=":Rklaetasm:">Twilio</title><path fill="currentColor" d="M11.52 9.04c0 1.36-1.12 2.48-2.48 2.48-1.36 0-2.48-1.12-2.48-2.48 0-1.36 1.12-2.48 2.48-2.48 1.36 0 2.48 1.12 2.48 2.48zm-2.48 3.44c-1.36 0-2.48 1.12-2.48 2.48 0 1.36 1.12 2.48 2.48 2.48 1.36 0 2.48-1.12 2.48-2.48 0-1.36-1.12-2.48-2.48-2.48zM24 12c0 6.64-5.36 12-12 12S0 18.64 0 12 5.36 0 12 0s12 5.36 12 12zm-3.2 0c0-4.88-3.92-8.8-8.8-8.8-4.88 0-8.8 3.92-8.8 8.8 0 4.88 3.92 8.8 8.8 8.8 4.88 0 8.8-3.92 8.8-8.8zm-5.84.48c-1.36 0-2.48 1.12-2.48 2.48 0 1.36 1.12 2.48 2.48 2.48 1.36 0 2.48-1.12 2.48-2.48 0-1.36-1.12-2.48-2.48-2.48zm0-5.92c-1.36 0-2.48 1.12-2.48 2.48 0 1.36 1.12 2.48 2.48 2.48 1.36 0 2.48-1.12 2.48-2.48 0-1.36-1.12-2.48-2.48-2.48zm41.28-1.84c.08 0 .16.08.24.16v2.56c0 .16-.16.24-.24.24H52c-.16 0-.24-.16-.24-.24V4.96c0-.16.16-.24.24-.24h4.24zm-.08 3.6H48c-.08 0-.24.08-.24.24l-1.04 4-.08.24-1.28-4.24c0-.08-.16-.24-.24-.24h-3.2c-.08 0-.24.08-.24.24l-1.2 4-.08.24-.08-.24-.48-2-.48-2c0-.08-.16-.24-.24-.24h-6.4V4.88c0-.08-.16-.24-.32-.16L28.4 6c-.16 0-.24.08-.24.24V8.4h-1.04c-.08 0-.24.08-.24.24v3.04c0 .08.08.24.24.24h1.04v3.76c0 2.64 1.44 3.84 4.08 3.84 1.12 0 2.16-.24 2.88-.64v-3.2c0-.16-.16-.24-.24-.16-.4.16-.8.24-1.12.24-.72 0-1.12-.32-1.12-1.12v-2.72h2.32c.08 0 .24-.08.24-.24V9.12l3.04 10.08c0 .08.16.24.24.24h3.36c.08 0 .24-.08.24-.24l1.44-4.48.72 2.32.64 2.16c0 .08.16.24.24.24h3.36c.08 0 .24-.08.24-.24l3.04-10.08V19.2c0 .08.08.24.24.24h4.08c.08 0 .24-.08.24-.24V8.56c0-.08-.08-.24-.16-.24zm5.36-3.6h-4.08c-.08 0-.24.08-.24.24v14.16c0 .08.08.24.24.24h4.08c.08 0 .24-.08.24-.24V4.88c0-.08-.08-.16-.24-.16zm5.44 0h-4.24c-.08 0-.24.08-.24.24v2.48c0 .08.08.24.24.24h4.24c.08 0 .24-.08.24-.24V4.88c0-.08-.08-.16-.24-.16zm-.08 3.6H62.8c-.08 0-.24.08-.24.24v10.48c0 .08.08.24.24.24h4.08c.08 0 .24-.08.24-.24V8.56c0-.08-.08-.24-.24-.24zm12.88 5.44c0 3.04-2.56 5.68-6.16 5.68-3.52 0-6.08-2.64-6.08-5.68 0-3.04 2.56-5.68 6.16-5.68 3.52 0 6.08 2.64 6.08 5.68zm-4.32.08c0-1.12-.8-2-1.76-1.92-1.04 0-1.76.88-1.76 1.92s.8 1.92 1.76 1.92c1.04 0 1.76-.88 1.76-1.92z"></path></svg></span></a></div></div></div></div></footer></div></div></div></div><div id="consent_blackbar"></div><div id="teconsent" style="position:fixed;bottom:0;right:0;z-index:30"></div><script id="__NEXT_DATA__" type="application/json">{"props":{"pageProps":{"source":{"compiledSource":"\"use strict\";\nconst {Fragment: _Fragment, jsx: _jsx, jsxs: _jsxs} = arguments[0];\nconst {useMDXComponents: _provideComponents} = arguments[0];\nfunction _createMdxContent(props) {\n const _components = {\n a: \"a\",\n br: \"br\",\n code: \"code\",\n em: \"em\",\n h2: \"h2\",\n h3: \"h3\",\n h4: \"h4\",\n li: \"li\",\n ol: \"ol\",\n p: \"p\",\n section: \"section\",\n strong: \"strong\",\n ul: \"ul\",\n ..._provideComponents(),\n ...props.components\n }, {CodeBlock, Image, Info, Tab, TabGroup} = _components;\n if (!CodeBlock) _missingMdxReference(\"CodeBlock\", true);\n if (!Image) _missingMdxReference(\"Image\", true);\n if (!Info) _missingMdxReference(\"Info\", true);\n if (!Tab) _missingMdxReference(\"Tab\", true);\n if (!TabGroup) _missingMdxReference(\"TabGroup\", true);\n return _jsxs(_Fragment, {\n children: [_jsxs(_components.p, {\n children: [\"With their lightweight nature and ability to execute JavaScript, Functions are an excellent companion to \", _jsx(_components.a, {\n href: \"/docs/studio\",\n children: \"Studio Flows\"\n }), \". Whether you need to gather some data from an API or run any other custom code to fit your business logic, Functions help to fill in the gaps in your application that existing \", _jsx(_components.a, {\n href: \"/docs/studio/widget-library\",\n children: \"Studio widgets\"\n }), \" may not cover.\"]\n }), \"\\n\", _jsxs(_components.p, {\n children: [\"In order to ease the integration of Functions into your Studio Flows, Studio provides the \", _jsx(_components.a, {\n href: \"/docs/studio/widget-library/run-function\",\n children: \"Run Function\"\n }), \" widget. This widget, as the name implies, allows you to run a Twilio Function; you may pass in any desired parameters, and leverage any generated values later on in your Studio Flow.\"]\n }), \"\\n\", _jsx(_components.p, {\n children: \"To test this out we'll create a Studio Flow that accepts incoming text messages, prompts the user for their desired dog breed, and returns an MMS containing some text and an image of their requested breed (assuming they provided a valid breed). The finished flow would look like this:\"\n }), \"\\n\", _jsx(Image, {\n src: \"https://docs-assets.prod.twilio.com/fb6cbf887eec54bc01fa2777ec6bf5fe7c3d1f9e3732f00191103246ef5741fa.png\",\n blurDataURL: \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAACCAYAAAB/qH1jAAAACXBIWXMAABYlAAAWJQFJUiTwAAAALUlEQVR4nAEiAN3/AC0jJf9dXFz/d318/5GPkf8ASEhI/5eYmv/g4eT/xMXG/yarFDn8jkPjAAAAAElFTkSuQmCC\",\n width: 1600,\n height: 833,\n isOpaque: true,\n placeholder: \"blur\",\n alt: \"Completed Studio Flow for Run Function example.\",\n unoptimized: false\n }), \"\\n\", _jsxs(_components.section, {\n id: \"create-a-studio-flow-and-a-user-prompt-section-indexable\",\n children: [_jsx(_components.h2, {\n id: \"create-a-studio-flow-and-a-user-prompt\",\n children: \"Create a Studio Flow and a user prompt\"\n }), _jsxs(_components.p, {\n children: [\"If you haven't created a Flow before, we suggest following the \", _jsx(_components.a, {\n href: \"/docs/studio/tutorials/how-to-build-a-chatbot#create-your-flow\",\n children: \"Create Your Flow\"\n }), \" steps in the chatbot tutorial to get one established.\"]\n }), _jsxs(_components.p, {\n children: [\"Once you are inside of your newly created Studio Flow, create the prompt for dog breed by dragging a \", _jsx(_components.a, {\n href: \"/docs/studio/widget-library/send-wait-reply\",\n children: \"Send \u0026 Wait For Reply\"\n }), \" widget onto the Studio canvas. Name it and provide some text to prompt the user; the text can be anything you'd like for this example, something along the general lines of \\\"which dog breed would you like to see?\\\"\"]\n }), _jsxs(_components.p, {\n children: [\"Here, we'll name the widget \", _jsx(_components.code, {\n children: \"request-breed\"\n }), \", and provide the following prompt:\"]\n }), _jsx(CodeBlock, {\n codeblock: {\n \"value\": \"Hello! Please respond with your requested dog breed to receive a photo! 🐶\",\n \"lang\": \"shellscript\",\n \"meta\": \"\",\n \"code\": \"Hello! Please respond with your requested dog breed to receive a photo! 🐶\",\n \"tokens\": [[\"Hello!\", \"#FFA657\"], \" \", [\"Please respond with your requested dog breed to receive a photo! 🐶\", \"#A5D6FF\"]],\n \"annotations\": [],\n \"themeName\": \"github-dark\",\n \"style\": {\n \"color\": \"#c9d1d9\",\n \"background\": \"#0d1117\"\n }\n }\n }), _jsx(_components.p, {\n children: \"Before we can proceed any further, we must first create the Function that we'll be calling in the next step of the Flow.\"\n })]\n }), \"\\n\", _jsxs(_components.section, {\n id: \"create-and-host-a-function-section-indexable\",\n children: [_jsx(_components.h2, {\n id: \"create-and-host-a-function\",\n children: \"Create and host a Function\"\n }), _jsxs(_components.p, {\n children: [\"In order to run any of the following examples, you will first need to create a Function into which you can paste the example code. You can create a Function using the Twilio Console or the \", _jsx(_components.a, {\n href: \"/docs/labs/serverless-toolkit\",\n children: \"Serverless Toolkit\"\n }), \" as explained below:\"]\n }), _jsxs(TabGroup, {\n children: [_jsxs(Tab, {\n title: \"Console\",\n children: [_jsx(_components.p, {\n children: \"If you prefer a UI-driven approach, creating and deploying a Function can be done entirely using the Twilio Console and the following steps:\"\n }), _jsxs(_components.ol, {\n children: [\"\\n\", _jsxs(_components.li, {\n children: [\"Log in to the Twilio Console and navigate to the \", _jsx(_components.a, {\n href: \"https://www.twilio.com/console/functions/overview\",\n children: \"Functions tab\"\n }), \". If you need an account, you can sign up for a free Twilio account \", _jsx(_components.a, {\n href: \"https://www.twilio.com/try-twilio\",\n children: \"here\"\n }), \"!\"]\n }), \"\\n\", _jsxs(_components.li, {\n children: [\"Functions are contained within \", _jsx(_components.strong, {\n children: \"Services\"\n }), \". Create a \", _jsx(_components.strong, {\n children: _jsx(_components.a, {\n href: \"/docs/serverless/functions-assets/functions/create-service\",\n children: \"Service\"\n })\n }), \" by clicking the \", _jsx(_components.strong, {\n children: _jsx(_components.a, {\n href: \"https://www.twilio.com/console/functions/overview/services\",\n children: \"Create Service\"\n })\n }), \" button and providing a name such as \", _jsx(_components.em, {\n children: \"test-function\"\n }), \".\"]\n }), \"\\n\", _jsxs(_components.li, {\n children: [\"Once you've been redirected to the new Service, click the \", _jsx(_components.strong, {\n children: \"Add +\"\n }), \" button and select \", _jsx(_components.strong, {\n children: \"Add Function\"\n }), \" from the dropdown.\"]\n }), \"\\n\", _jsxs(_components.li, {\n children: [\"This will create a new \", _jsx(_components.a, {\n href: \"/docs/serverless/functions-assets/visibility\",\n children: \"Protected\"\n }), \" Function for you with the option to rename it. The name of the file will be path it is accessed from.\"]\n }), \"\\n\", _jsx(_components.li, {\n children: \"Copy any one of the example code snippets from this page that you want to experiment with, and paste the code into your newly created Function. You can quickly switch examples by using the dropdown menu of the code rail.\"\n }), \"\\n\", _jsxs(_components.li, {\n children: [\"Click \", _jsx(_components.strong, {\n children: \"Save\"\n }), \" to save your Function's contents.\"]\n }), \"\\n\", _jsxs(_components.li, {\n children: [\"Click \", _jsx(_components.strong, {\n children: \"Deploy All\"\n }), \" to build and deploy the Function. After a short delay, your Function will be accessible from: \", _jsx(_components.code, {\n children: \"https://\u003cservice-name\u003e-\u003crandom-characters\u003e-\u003coptional-domain-suffix\u003e.twil.io/\u003cfunction-path\u003e\"\n }), _jsx(_components.br, {}), \"\\n\", \"For example: \", _jsx(_components.code, {\n children: \"test-function-3548.twil.io/hello-world\"\n }), \".\"]\n }), \"\\n\"]\n })]\n }), _jsxs(Tab, {\n title: \"Serverless Toolkit\",\n children: [_jsxs(_components.p, {\n children: [\"The \", _jsx(_components.a, {\n href: \"/docs/labs/serverless-toolkit\",\n children: \"Serverless Toolkit\"\n }), \" enables you with local development, project deployment, and other functionality via the \", _jsx(_components.a, {\n href: \"/docs/twilio-cli/quickstart\",\n children: \"Twilio CLI\"\n }), \". To get up and running with these examples using Serverless Toolkit, follow this process:\"]\n }), _jsxs(_components.ol, {\n children: [\"\\n\", _jsxs(_components.li, {\n children: [\"\\n\", _jsxs(_components.p, {\n children: [\"From the CLI, run \", _jsx(_components.code, {\n children: \"twilio serverless:init \u003cyour-service-name\u003e --empty\"\n }), \" to bootstrap your local environment.\"]\n }), \"\\n\"]\n }), \"\\n\", _jsxs(_components.li, {\n children: [\"\\n\", _jsxs(_components.p, {\n children: [\"Navigate into your new project directory using \", _jsx(_components.code, {\n children: \"cd \u003cyour-service-name\u003e\"\n })]\n }), \"\\n\"]\n }), \"\\n\", _jsxs(_components.li, {\n children: [\"\\n\", _jsxs(_components.p, {\n children: [\"In the \", _jsx(_components.code, {\n children: \"/functions\"\n }), \" directory, create a new JavaScript file that is named respective to the purpose of the Function. For example, \", _jsx(_components.code, {\n children: \"sms-reply.protected.js\"\n }), \" for a \", _jsx(_components.a, {\n href: \"/docs/serverless/functions-assets/visibility\",\n children: \"Protected\"\n }), \" Function intended to handle incoming SMS.\"]\n }), \"\\n\"]\n }), \"\\n\", _jsxs(_components.li, {\n children: [\"\\n\", _jsxs(_components.p, {\n children: [\"Populate the file using the code example of your choice and save. \", _jsx(_components.strong, {\n children: \"Note\"\n }), \" A Function can only export a single handler. You will want to create separate files if you want to run and/or deploy multiple examples at once.\"]\n }), \"\\n\"]\n }), \"\\n\"]\n }), _jsxs(_components.p, {\n children: [\"Once your Function(s) code is written and saved, you can test it either by running it locally (and optionally tunneling requests to it via a tool like \", _jsx(_components.a, {\n href: \"https://ngrok.com/\",\n children: \"ngrok\"\n }), \"), or by deploying the Function and executing against the deployed url(s).\"]\n }), _jsx(_components.h3, {\n children: \"Run your Function in local development\"\n }), _jsxs(_components.p, {\n children: [\"Run \", _jsx(_components.code, {\n children: \"twilio serverless:start\"\n }), \" from your CLI to start the project locally. The Function(s) in your project will be accessible from \", _jsx(_components.code, {\n children: \"http://localhost:3000/sms-reply\"\n })]\n }), _jsxs(_components.ul, {\n children: [\"\\n\", _jsxs(_components.li, {\n children: [\"\\n\", _jsxs(_components.p, {\n children: [\"If you want to test a Function as a \", _jsx(_components.a, {\n href: \"/docs/usage/webhooks/getting-started-twilio-webhooks\",\n children: \"Twilio webhook\"\n }), \", run: \", _jsx(_components.code, {\n children: \"twilio phone-numbers:update \u003cyour Twilio phone number\u003e --sms-url \\\"http://localhost:3000/sms-reply\\\"\"\n }), _jsx(_components.br, {}), \"\\n\", \"This will automatically generate an ngrok tunnel from Twilio to your locally running Function, so you can start sending texts to it. You can apply the same process but with the \", _jsx(_components.code, {\n children: \"voice-url\"\n }), \" flag instead if you want to test with \", _jsx(_components.a, {\n href: \"/docs/voice\",\n children: \"Twilio Voice\"\n }), \".\"]\n }), \"\\n\"]\n }), \"\\n\", _jsxs(_components.li, {\n children: [\"\\n\", _jsxs(_components.p, {\n children: [\"If your code does \", _jsx(_components.em, {\n children: \"not\"\n }), \" connect to Twilio Voice/Messages as a webhook, you can start your dev server and start an ngrok tunnel in the same command with the \", _jsx(_components.code, {\n children: \"ngrok\"\n }), \" flag. For example: \", _jsx(_components.code, {\n children: \"twilio serverless:start --ngrok=\\\"\\\"\"\n })]\n }), \"\\n\"]\n }), \"\\n\"]\n }), _jsx(_components.h3, {\n children: \"Deploy your Function\"\n }), _jsxs(_components.p, {\n children: [\"To deploy your Function and have access to live url(s), run \", _jsx(_components.code, {\n children: \"twilio serverless:deploy\"\n }), \" from your CLI. This will deploy your Function(s) to Twilio under a development environment by default, where they can be accessed from:\"]\n }), _jsx(_components.p, {\n children: _jsx(_components.code, {\n children: \"https://\u003cservice-name\u003e-\u003crandom-characters\u003e-dev.twil.io/\u003cfunction-path\u003e\"\n })\n }), _jsxs(_components.p, {\n children: [\"For example: \", _jsx(_components.code, {\n children: \"https://incoming-sms-examples-3421-dev.twil.io/sms-reply\"\n })]\n })]\n })]\n }), _jsxs(_components.p, {\n children: [\"Your Function is now ready to be invoked by HTTP requests, set as the \", _jsx(_components.a, {\n href: \"/docs/usage/webhooks/getting-started-twilio-webhooks\",\n children: \"webhook\"\n }), \" of a Twilio phone number, invoked by a Twilio Studio \", _jsx(_components.strong, {\n children: _jsx(_components.a, {\n href: \"/docs/studio/widget-library/run-function\",\n children: \"Run Function Widget\"\n })\n }), \", and more!\"]\n })]\n }), \"\\n\", _jsxs(_components.section, {\n id: \"install-dependencies-and-define-the-function-body-section-indexable\",\n children: [_jsx(_components.h2, {\n id: \"install-dependencies-and-define-the-function-body\",\n children: \"Install Dependencies and define the Function body\"\n }), _jsx(_components.p, {\n children: \"Studio Widgets can handle the elements of gathering user input and sending back a response text. However, custom logic like handling breed names that contain spaces lives best inside of a Function.\"\n }), _jsxs(_components.p, {\n children: [\"Let's add some code to this Function. Install \", _jsx(_components.code, {\n children: \"axios\"\n }), \" as a \", _jsx(_components.a, {\n href: \"/docs/serverless/functions-assets/functions/dependencies\",\n children: \"Dependency\"\n }), \", copy the following code example into your Function, save, and deploy your Service so that we can look more closely at how to integrate the Run Widget into a Studio Flow.\"]\n }), _jsxs(_components.p, {\n children: [\"Note that this Function expects an input of \", _jsx(_components.code, {\n children: \"breed\"\n }), \", and returns JSON that includes some \", _jsx(_components.code, {\n children: \"text\"\n }), \" and an image \", _jsx(_components.code, {\n children: \"url\"\n }), \".\"]\n }), _jsx(Info, {\n children: _jsxs(_components.p, {\n children: [\"If you're curious about why we're using \", _jsx(_components.code, {\n children: \"axios\"\n }), \" and keywords such as \", _jsx(_components.code, {\n children: \"async\"\n }), \" and \", _jsx(_components.code, {\n children: \"await\"\n }), \", be sure to read up on \", _jsx(_components.a, {\n href: \"/docs/serverless/functions-assets/quickstart/api-request\",\n children: \"how to make API requests in Functions\"\n }), \".\"]\n })\n })]\n }), \"\\n\", _jsxs(_components.section, {\n id: \"return-json-to-a-studio-flow-based-on-input-parameters-section\",\n children: [_jsx(_components.h4, {\n id: \"return-json-to-a-studio-flow-based-on-input-parameters\",\n children: \"Return JSON to a Studio Flow based on input parameters\"\n }), _jsx(CodeBlock, {\n codeblock: {\n \"value\": \"const axios = require('axios');\\n\\nexports.handler = async (context, event, callback) =\u003e {\\n // Any parameters provided to the Function will be accessible from `event`.\\n // In Function Parameters, we defined `breed` as the inbound Body from\\n // our Send \u0026 Wait For Reply Widget. We can access that via `event.breed`.\\n // To minimize the potential for errors, lowercase and trim the user input.\\n let dogBreed = event.breed.toLowerCase().trim();\\n\\n // The Dog API also supports sub-breeds, so we need to handle that case.\\n // For example, if the user requests \\\"Golden Retriever\\\", we need to format\\n // the breed as \\\"retriever/golden\\\".\\n if (dogBreed.includes(' ')) {\\n const [subBreed, breed] = dogBreed.split(' ');\\n dogBreed = `${breed}/${subBreed}`;\\n }\\n\\n const dogApiUrl = `https://dog.ceo/api/breed/${dogBreed}/images/random`;\\n\\n try {\\n // Make the request to the Dog API. Remember to use `await` since this\\n // is an asynchronous request!\\n const response = await axios.get(dogApiUrl);\\n // Return the response to the Send \u0026 Wait For Reply Widget.\\n return callback(null, {\\n text: `Here's an image of a ${event.breed}! 🐶`,\\n // The `message` property of the response is the URL of the dog image.\\n url: response.data.message,\\n });\\n } catch (error) {\\n // Remember to handle any errors that may occur!\\n // In the case of a 404, the breed was not found.\\n if (error.response \u0026\u0026 error.response.status === 404) {\\n return callback(null, {\\n text: `Sorry, we couldn't find any ${event.breed}s 🥲`,\\n });\\n }\\n // Otherwise, there may have been a network or server error.\\n return callback(error);\\n }\\n};\",\n \"lang\": \"javascript\",\n \"meta\": \"title=\\\"Return JSON to a Studio Flow based on input parameters\\\"\",\n \"code\": \"const axios = require('axios');\\n\\nexports.handler = async (context, event, callback) =\u003e {\\n // Any parameters provided to the Function will be accessible from `event`.\\n // In Function Parameters, we defined `breed` as the inbound Body from\\n // our Send \u0026 Wait For Reply Widget. We can access that via `event.breed`.\\n // To minimize the potential for errors, lowercase and trim the user input.\\n let dogBreed = event.breed.toLowerCase().trim();\\n\\n // The Dog API also supports sub-breeds, so we need to handle that case.\\n // For example, if the user requests \\\"Golden Retriever\\\", we need to format\\n // the breed as \\\"retriever/golden\\\".\\n if (dogBreed.includes(' ')) {\\n const [subBreed, breed] = dogBreed.split(' ');\\n dogBreed = `${breed}/${subBreed}`;\\n }\\n\\n const dogApiUrl = `https://dog.ceo/api/breed/${dogBreed}/images/random`;\\n\\n try {\\n // Make the request to the Dog API. Remember to use `await` since this\\n // is an asynchronous request!\\n const response = await axios.get(dogApiUrl);\\n // Return the response to the Send \u0026 Wait For Reply Widget.\\n return callback(null, {\\n text: `Here's an image of a ${event.breed}! 🐶`,\\n // The `message` property of the response is the URL of the dog image.\\n url: response.data.message,\\n });\\n } catch (error) {\\n // Remember to handle any errors that may occur!\\n // In the case of a 404, the breed was not found.\\n if (error.response \u0026\u0026 error.response.status === 404) {\\n return callback(null, {\\n text: `Sorry, we couldn't find any ${event.breed}s 🥲`,\\n });\\n }\\n // Otherwise, there may have been a network or server error.\\n return callback(error);\\n }\\n};\",\n \"tokens\": [[\"const\", \"#FF7B72\"], \" \", [\"axios\", \"#79C0FF\"], \" \", [\"=\", \"#FF7B72\"], \" \", [\"require\", \"#D2A8FF\"], [\"(\", \"#C9D1D9\"], [\"'axios'\", \"#A5D6FF\"], [\");\", \"#C9D1D9\"], \"\\n\\n\", [\"exports\", \"#79C0FF\"], [\".\", \"#C9D1D9\"], [\"handler\", \"#D2A8FF\"], \" \", [\"= async\", \"#FF7B72\"], \" \", [\"(\", \"#C9D1D9\"], [\"context\", \"#FFA657\"], [\",\", \"#C9D1D9\"], \" \", [\"event\", \"#FFA657\"], [\",\", \"#C9D1D9\"], \" \", [\"callback\", \"#FFA657\"], [\")\", \"#C9D1D9\"], \" \", [\"=\u003e\", \"#FF7B72\"], \" \", [\"{\", \"#C9D1D9\"], \"\\n \", [\"// Any parameters provided to the Function will be accessible from `event`.\", \"#8B949E\"], \"\\n \", [\"// In Function Parameters, we defined `breed` as the inbound Body from\", \"#8B949E\"], \"\\n \", [\"// our Send \u0026 Wait For Reply Widget. We can access that via `event.breed`.\", \"#8B949E\"], \"\\n \", [\"// To minimize the potential for errors, lowercase and trim the user input.\", \"#8B949E\"], \"\\n \", [\"let\", \"#FF7B72\"], \" \", [\"dogBreed\", \"#C9D1D9\"], \" \", [\"=\", \"#FF7B72\"], \" \", [\"event.breed.\", \"#C9D1D9\"], [\"toLowerCase\", \"#D2A8FF\"], [\"().\", \"#C9D1D9\"], [\"trim\", \"#D2A8FF\"], [\"();\", \"#C9D1D9\"], \"\\n\\n \", [\"// The Dog API also supports sub-breeds, so we need to handle that case.\", \"#8B949E\"], \"\\n \", [\"// For example, if the user requests \\\"Golden Retriever\\\", we need to format\", \"#8B949E\"], \"\\n \", [\"// the breed as \\\"retriever/golden\\\".\", \"#8B949E\"], \"\\n \", [\"if\", \"#FF7B72\"], \" \", [\"(dogBreed.\", \"#C9D1D9\"], [\"includes\", \"#D2A8FF\"], [\"(\", \"#C9D1D9\"], [\"' '\", \"#A5D6FF\"], [\")) {\", \"#C9D1D9\"], \"\\n \", [\"const\", \"#FF7B72\"], \" \", [\"[\", \"#C9D1D9\"], [\"subBreed\", \"#79C0FF\"], [\",\", \"#C9D1D9\"], \" \", [\"breed\", \"#79C0FF\"], [\"]\", \"#C9D1D9\"], \" \", [\"=\", \"#FF7B72\"], \" \", [\"dogBreed.\", \"#C9D1D9\"], [\"split\", \"#D2A8FF\"], [\"(\", \"#C9D1D9\"], [\"' '\", \"#A5D6FF\"], [\");\", \"#C9D1D9\"], \"\\n \", [\"dogBreed\", \"#C9D1D9\"], \" \", [\"=\", \"#FF7B72\"], \" \", [\"`${\", \"#A5D6FF\"], [\"breed\", \"#C9D1D9\"], [\"}/${\", \"#A5D6FF\"], [\"subBreed\", \"#C9D1D9\"], [\"}`\", \"#A5D6FF\"], [\";\", \"#C9D1D9\"], \"\\n \", [\"}\", \"#C9D1D9\"], \"\\n\\n \", [\"const\", \"#FF7B72\"], \" \", [\"dogApiUrl\", \"#79C0FF\"], \" \", [\"=\", \"#FF7B72\"], \" \", [\"`https://dog.ceo/api/breed/${\", \"#A5D6FF\"], [\"dogBreed\", \"#C9D1D9\"], [\"}/images/random`\", \"#A5D6FF\"], [\";\", \"#C9D1D9\"], \"\\n\\n \", [\"try\", \"#FF7B72\"], \" \", [\"{\", \"#C9D1D9\"], \"\\n \", [\"// Make the request to the Dog API. Remember to use `await` since this\", \"#8B949E\"], \"\\n \", [\"// is an asynchronous request!\", \"#8B949E\"], \"\\n \", [\"const\", \"#FF7B72\"], \" \", [\"response\", \"#79C0FF\"], \" \", [\"= await\", \"#FF7B72\"], \" \", [\"axios.\", \"#C9D1D9\"], [\"get\", \"#D2A8FF\"], [\"(dogApiUrl);\", \"#C9D1D9\"], \"\\n \", [\"// Return the response to the Send \u0026 Wait For Reply Widget.\", \"#8B949E\"], \"\\n \", [\"return\", \"#FF7B72\"], \" \", [\"callback\", \"#D2A8FF\"], [\"(\", \"#C9D1D9\"], [\"null\", \"#79C0FF\"], [\", {\", \"#C9D1D9\"], \"\\n \", [\"text:\", \"#C9D1D9\"], \" \", [\"`Here's an image of a ${\", \"#A5D6FF\"], [\"event\", \"#C9D1D9\"], [\".\", \"#A5D6FF\"], [\"breed\", \"#C9D1D9\"], [\"}! 🐶`\", \"#A5D6FF\"], [\",\", \"#C9D1D9\"], \"\\n \", [\"// The `message` property of the response is the URL of the dog image.\", \"#8B949E\"], \"\\n \", [\"url: response.data.message,\", \"#C9D1D9\"], \"\\n \", [\"});\", \"#C9D1D9\"], \"\\n \", [\"}\", \"#C9D1D9\"], \" \", [\"catch\", \"#FF7B72\"], \" \", [\"(error) {\", \"#C9D1D9\"], \"\\n \", [\"// Remember to handle any errors that may occur!\", \"#8B949E\"], \"\\n \", [\"// In the case of a 404, the breed was not found.\", \"#8B949E\"], \"\\n \", [\"if\", \"#FF7B72\"], \" \", [\"(error.response\", \"#C9D1D9\"], \" \", [\"\u0026\u0026\", \"#FF7B72\"], \" \", [\"error.response.status\", \"#C9D1D9\"], \" \", [\"===\", \"#FF7B72\"], \" \", [\"404\", \"#79C0FF\"], [\") {\", \"#C9D1D9\"], \"\\n \", [\"return\", \"#FF7B72\"], \" \", [\"callback\", \"#D2A8FF\"], [\"(\", \"#C9D1D9\"], [\"null\", \"#79C0FF\"], [\", {\", \"#C9D1D9\"], \"\\n \", [\"text:\", \"#C9D1D9\"], \" \", [\"`Sorry, we couldn't find any ${\", \"#A5D6FF\"], [\"event\", \"#C9D1D9\"], [\".\", \"#A5D6FF\"], [\"breed\", \"#C9D1D9\"], [\"}s 🥲`\", \"#A5D6FF\"], [\",\", \"#C9D1D9\"], \"\\n \", [\"});\", \"#C9D1D9\"], \"\\n \", [\"}\", \"#C9D1D9\"], \"\\n \", [\"// Otherwise, there may have been a network or server error.\", \"#8B949E\"], \"\\n \", [\"return\", \"#FF7B72\"], \" \", [\"callback\", \"#D2A8FF\"], [\"(error);\", \"#C9D1D9\"], \"\\n \", [\"}\", \"#C9D1D9\"], \"\\n\", [\"};\", \"#C9D1D9\"]],\n \"annotations\": [],\n \"themeName\": \"github-dark\",\n \"style\": {\n \"color\": \"#c9d1d9\",\n \"background\": \"#0d1117\"\n }\n }\n })]\n }), \"\\n\", _jsxs(_components.section, {\n id: \"use-the-run-function-widget-section-indexable\",\n children: [_jsx(_components.h2, {\n id: \"use-the-run-function-widget\",\n children: \"Use the Run Function widget\"\n }), _jsxs(_components.p, {\n children: [\"Once your prompt is complete, drag a \", _jsx(_components.a, {\n href: \"/docs/studio/widget-library/run-function\",\n children: \"Run Function\"\n }), \" widget onto the canvas, and connect it to the \", _jsx(_components.code, {\n children: \"Reply\"\n }), \" condition of the \", _jsx(_components.code, {\n children: \"request-breed\"\n }), \" widget.\"]\n }), _jsxs(_components.p, {\n children: [\"You'll be able to provide a name for the widget (\", _jsx(_components.code, {\n children: \"get-doge-image\"\n }), \"), a configuration that will point this widget at your intended Function, and any parameters or arguments that you'd like to pass from the Flow to the Function when it's executed.\"]\n }), _jsxs(_components.p, {\n children: [\"For this example, we'll point the Run Function widget at our Function, which was deployed to the \", _jsx(_components.code, {\n children: \"doge\"\n }), \" Service in a production environment, and the path to the Function is \", _jsx(_components.code, {\n children: \"/get-doge\"\n }), \". Replace the Service, Environment, and Function configuration options with the values specific to the Function you created earlier.\"]\n }), _jsx(Image, {\n src: \"https://docs-assets.prod.twilio.com/57d777cb1509522026cb3096a92a3504848d2466357e6108733f4d1cac1c1139.png\",\n blurDataURL: \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAADCAYAAAC09K7GAAAACXBIWXMAABYlAAAWJQFJUiTwAAAAPklEQVR4nAEzAMz/AB0QEv9JSU3/NTY6/5mUlP8AeHl6/3+Chv+EhYT/kJGR/wD4+vr/z8/Q/yklJv9ycnP/msQcz2yPaNkAAAAASUVORK5CYII=\",\n width: 1600,\n height: 1130,\n isOpaque: true,\n placeholder: \"blur\",\n alt: \"Configuration for the Run Function widget to call the get-doge function with breed as an input parameter.\",\n unoptimized: false\n }), _jsxs(_components.p, {\n children: [\"The final important configuration to note is the section labeled \", _jsx(_components.strong, {\n children: \"Function Parameters\"\n }), \". Here, we define the parameters that we will pass to the Function's \", _jsx(_components.code, {\n children: \"event\"\n }), \" object.\"]\n }), _jsxs(_components.p, {\n children: [\"Here, we want to provide a variable called \", _jsx(_components.code, {\n children: \"breed\"\n }), \" which is equal to the user's response to the prompt. We can do this by creating a new parameter, naming it \", _jsx(_components.code, {\n children: \"breed\"\n }), \", and setting the value to the user's response to the \", _jsx(_components.code, {\n children: \"request-breed\"\n }), \" widget.\"]\n }), _jsx(Info, {\n children: _jsxs(_components.p, {\n children: [\"We are using the Liquid template language to set a variable to the value gathered by the \", _jsx(_components.code, {\n children: \"request-breed\"\n }), \" widget. Read the \", _jsx(_components.a, {\n href: \"/docs/studio/user-guide/liquid-template-language\",\n children: \"Studio guide on Liquid\"\n }), \" to learn more about this syntax and what else you can do with these expressions!\"]\n })\n })]\n }), \"\\n\", _jsxs(_components.section, {\n id: \"consume-the-output-of-the-run-function-widget-section-indexable\",\n children: [_jsx(_components.h2, {\n id: \"consume-the-output-of-the-run-function-widget\",\n children: \"Consume the output of the Run Function widget\"\n }), _jsx(_components.p, {\n children: \"With our prompt and Run Function widgets in place, the last step is to generate a response to the user which incorporates the Function's result.\"\n }), _jsxs(_components.p, {\n children: [\"Drag a \", _jsx(_components.a, {\n href: \"/docs/studio/widget-library/send-message\",\n children: \"Send Message\"\n }), \" widget onto the canvas, and connect it to the \", _jsx(_components.code, {\n children: \"Success\"\n }), \" condition of the \", _jsx(_components.code, {\n children: \"get-doge-image\"\n }), \" widget.\"]\n }), _jsxs(_components.p, {\n children: [\"The configuration for this widget is much shorter, and consists only of a name for the widget, the text body, and any media URL (s) you may want to attach. Luckily, the \", _jsx(_components.code, {\n children: \"/get-doge\"\n }), \" Function returns \", _jsx(_components.code, {\n children: \"text\"\n }), \" and \", _jsx(_components.code, {\n children: \"uri\"\n }), \" values for us, so we can template these values into the config using \", _jsx(_components.a, {\n href: \"/docs/studio/user-guide/liquid-template-language\",\n children: \"Liquid\"\n }), \".\"]\n }), _jsxs(_components.p, {\n children: [\"In order to access the return value of a Run Function widget, you will need to access a special property called \", _jsx(_components.code, {\n children: \"parsed\"\n }), \". This object will contain any and all contents returned by the targeted Function.\"]\n }), _jsx(Info, {\n children: _jsxs(_components.p, {\n children: [\"The general syntax to access a property from the result of a Run Function widget is \", _jsx(_components.code, {\n children: \"{{widgets.\u003cwidget-name\u003e.parsed.\u003cproperty\u003e}}\"\n }), \".\"]\n })\n }), _jsxs(_components.p, {\n children: [\"For example, to access the \", _jsx(_components.code, {\n children: \"text\"\n }), \" and \", _jsx(_components.code, {\n children: \"url\"\n }), \" returned from the \", _jsx(_components.code, {\n children: \"get-doge-image\"\n }), \" widget, the respective Liquid template strings would be the following:\"]\n }), _jsx(CodeBlock, {\n codeblock: {\n \"value\": \"{{widgets.get-doge-image.parsed.text}}\\n{{widgets.get-doge-image.parsed.url}}\",\n \"lang\": \"shellscript\",\n \"meta\": \"\",\n \"code\": \"{{widgets.get-doge-image.parsed.text}}\\n{{widgets.get-doge-image.parsed.url}}\",\n \"tokens\": [[\"{{widgets.get-doge-image.parsed.text}}\", \"#C9D1D9\"], \"\\n\", [\"{{widgets.get-doge-image.parsed.url}}\", \"#C9D1D9\"]],\n \"annotations\": [],\n \"themeName\": \"github-dark\",\n \"style\": {\n \"color\": \"#c9d1d9\",\n \"background\": \"#0d1117\"\n }\n }\n }), _jsxs(_components.p, {\n children: [\"Once you have set \", _jsx(_components.strong, {\n children: \"Message Body\"\n }), \" to \", _jsx(_components.code, {\n children: \"{{widgets.get-doge-image.parsed.text}}\"\n }), \" and \", _jsx(_components.strong, {\n children: \"Media URL\"\n }), \" to \", _jsx(_components.code, {\n children: \"{{widgets.get-doge-image.parsed.url}}\"\n }), \" on the Send Message widget, your configuration should look like this:\"]\n }), _jsx(Image, {\n src: \"https://docs-assets.prod.twilio.com/c4d76302ce943d5b8a1bb59546da381516775118e8c4b20b847943c58a4dca93.png\",\n blurDataURL: \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAACCAYAAAB/qH1jAAAACXBIWXMAABYlAAAWJQFJUiTwAAAALUlEQVR4nAEiAN3/AHNwcf+GjJD/IiIm/5qXl/8Aq7Cz/5KSlf99env/1dfY/0TXFN7L6MSnAAAAAElFTkSuQmCC\",\n width: 1600,\n height: 831,\n isOpaque: true,\n placeholder: \"blur\",\n alt: \"Define the configuration of the Send Message widget using liquid template values from the Run Function output.\",\n unoptimized: false\n })]\n }), \"\\n\", _jsxs(_components.section, {\n id: \"test-it-section-indexable\",\n children: [_jsx(_components.h2, {\n id: \"test-it\",\n children: \"Test it\"\n }), _jsxs(_components.p, {\n children: [\"With the Function deployed and all the widgets in the Studio Flow connected and configured, all that's left is to see this little application in action. If you haven't already, click the \", _jsx(_components.strong, {\n children: \"Publish\"\n }), \" button on the Studio canvas to save all your progress on the Flow and ensure that its code is live.\"]\n }), _jsxs(_components.p, {\n children: [\"Next, you'll want to connect this Flow to one of your Twilio phone numbers. You can follow \", _jsx(_components.a, {\n href: \"/docs/studio/user-guide#configuring-your-twilio-number-for-studio\",\n children: \"these directions\"\n }), \" in order to do so.\"]\n }), _jsx(_components.p, {\n children: \"Once you have published your Flow and connected it to your Twilio phone number, send it a brief message to start the conversation. A simple \\\"Ahoy!\\\" will do. Respond to the incoming prompt with a breed of dog, and you will see an MMS of that breed after a momentary delay.\"\n }), _jsx(Image, {\n src: \"https://docs-assets.prod.twilio.com/739cdb68721dedba77ba90d69562c89cccfebb9de32c496ea8d9c3502e9b7721.jpg\",\n blurDataURL: \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAMAAAAECAIAAADETxJQAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAM0lEQVR4nAEoANf/AF1nbXF1eby/xwA1LzFjVlnCy9IAy6KjtJOWAAUIAO7z/+De7iIjJmvJEsrG7rR7AAAAAElFTkSuQmCC\",\n width: 1080,\n height: 1376,\n isOpaque: true,\n placeholder: \"blur\",\n alt: \"Flow example with a golden retriever.\",\n unoptimized: false\n })]\n }), \"\\n\", _jsxs(_components.section, {\n id: \"go-further-with-loops-and-failure-flows-section-indexable\",\n children: [_jsx(_components.h2, {\n id: \"go-further-with-loops-and-failure-flows\",\n children: \"Go further with loops and failure flows\"\n }), _jsxs(_components.p, {\n children: [\"So far, while the Function code does contain some catch logic, it otherwise doesn't really have any resilience to missing breed types or even network errors, and it definitely doesn't show that to the user. To improve the experience, let's see what happens if we expand our flow to handle the fail condition of \", _jsx(_components.code, {\n children: \"get-doge-image\"\n }), \".\"]\n }), _jsxs(_components.p, {\n children: [\"To get started, drag a new Send Message widget onto the canvas, give it a name such as \", _jsx(_components.code, {\n children: \"send-fail-message\"\n }), \", and connect it to the \", _jsx(_components.code, {\n children: \"Fail\"\n }), \" transition from \", _jsx(_components.code, {\n children: \"get-doge-image\"\n }), \". By doing this, we're introducing an alternative flow of logic for our application in case the Function runs into an error.\"]\n }), _jsxs(_components.p, {\n children: [\"To take this a step further, connect the \", _jsx(_components.code, {\n children: \"Sent\"\n }), \" condition of the newly made \", _jsx(_components.code, {\n children: \"send-fail-message\"\n }), \" to \", _jsx(_components.code, {\n children: \"get-doge-image\"\n }), \". In doing so, you've just created a loop! If the Function fails to get a dog image, the flow will send the user a message then try to re-run the Function, and will do so until it succeeds.\"]\n }), _jsxs(_components.p, {\n children: [\"Set the message body to \", _jsx(_components.code, {\n children: \"{{widgets.get-doge-image.body}} Trying again!\"\n }), \", click \", _jsx(_components.strong, {\n children: \"Save\"\n }), \", and finally click \", _jsx(_components.strong, {\n children: \"Publish\"\n }), \" to publish this update to the flow.\"]\n }), _jsxs(_components.p, {\n children: [\"These connections and the configuration for \", _jsx(_components.code, {\n children: \"send-fail-message\"\n }), \" should appear as shown below:\"]\n }), _jsx(Image, {\n src: \"https://docs-assets.prod.twilio.com/30f6bc37a7548ad7297d4769d4d1500961b04befb6e4bf3bebdb2df22513ea56.png\",\n blurDataURL: \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAACCAYAAAB/qH1jAAAACXBIWXMAABYlAAAWJQFJUiTwAAAAK0lEQVR4nGNQEpf4HxMe8X/Tnm3/+3r6/jOoKCv/T0rN/P/lw+f/jXX1/wEjMRMQ3s4SLQAAAABJRU5ErkJggg==\",\n width: 1600,\n height: 911,\n isOpaque: true,\n placeholder: \"blur\",\n alt: \"Create a retry loop by connecting the Run Function Fail transition to a Send Message widget.\",\n unoptimized: false\n }), _jsx(_components.p, {\n children: \"With the flow updated to handle failures from our Function, let's quickly edit our code to make it artificially error-prone; only for the sake of testing, of course!\"\n })]\n }), \"\\n\", _jsxs(_components.section, {\n id: \"randomly-return-an-error-instead-of-json-section\",\n children: [_jsx(_components.h4, {\n id: \"randomly-return-an-error-instead-of-json\",\n children: \"Randomly return an error instead of JSON\"\n }), _jsx(CodeBlock, {\n codeblock: {\n \"value\": \"// !mark(20,21,33,34)\\nconst axios = require('axios');\\n\\nexports.handler = async (context, event, callback) =\u003e {\\n // In Function Parameters, we defined `breed` as the inbound Body from\\n // our Send \u0026 Wait For Reply Widget. We can access that via `event.breed`.\\n // To minimize the potential for errors, lowercase and trim the user input.\\n let breed = event.breed.toLowerCase().trim();\\n\\n // The Dog API also supports sub-breeds, so we need to handle that case.\\n // For example, if the user requests \\\"Golden Retriever\\\", we need to format\\n // the breed as \\\"retriever/golden\\\".\\n if (breed.includes(' ')) {\\n const [first, second] = breed.split(' ');\\n breed = `${second}/${first}`;\\n }\\n\\n const dogApiUrl = `https://dog.ceo/api/breed/${breed}/images/random`;\\n\\n try {\\n // Let's introduce some inconsistency by randomly throwing an error\\n if (Math.random() \u003e 0.3) throw new Error('No doge~');\\n // Make the request to the Dog API. Remember to use `await` since this\\n // is an asynchronous request!\\n const response = await axios.get(dogApiUrl);\\n // Return the response to the Send \u0026 Wait For Reply Widget.\\n return callback(null, {\\n text: `Here's an image of a ${event.breed}! 🐶`,\\n // The `message` property of the response is the URL of the dog image.\\n url: response.data.message,\\n });\\n } catch (error) {\\n // Remember to handle any errors that may occur!\\n // This error message will be accessible as `widgets.get-doge-image.body`\\n return callback(`Sorry, we couldn't find any ${event.breed}s 🥲`);\\n }\\n};\",\n \"lang\": \"javascript\",\n \"meta\": \"title=\\\"Randomly return an error instead of JSON\\\"\",\n \"code\": \"const axios = require('axios');\\n\\nexports.handler = async (context, event, callback) =\u003e {\\n // In Function Parameters, we defined `breed` as the inbound Body from\\n // our Send \u0026 Wait For Reply Widget. We can access that via `event.breed`.\\n // To minimize the potential for errors, lowercase and trim the user input.\\n let breed = event.breed.toLowerCase().trim();\\n\\n // The Dog API also supports sub-breeds, so we need to handle that case.\\n // For example, if the user requests \\\"Golden Retriever\\\", we need to format\\n // the breed as \\\"retriever/golden\\\".\\n if (breed.includes(' ')) {\\n const [first, second] = breed.split(' ');\\n breed = `${second}/${first}`;\\n }\\n\\n const dogApiUrl = `https://dog.ceo/api/breed/${breed}/images/random`;\\n\\n try {\\n // Let's introduce some inconsistency by randomly throwing an error\\n if (Math.random() \u003e 0.3) throw new Error('No doge~');\\n // Make the request to the Dog API. Remember to use `await` since this\\n // is an asynchronous request!\\n const response = await axios.get(dogApiUrl);\\n // Return the response to the Send \u0026 Wait For Reply Widget.\\n return callback(null, {\\n text: `Here's an image of a ${event.breed}! 🐶`,\\n // The `message` property of the response is the URL of the dog image.\\n url: response.data.message,\\n });\\n } catch (error) {\\n // Remember to handle any errors that may occur!\\n // This error message will be accessible as `widgets.get-doge-image.body`\\n return callback(`Sorry, we couldn't find any ${event.breed}s 🥲`);\\n }\\n};\",\n \"tokens\": [[\"const\", \"#FF7B72\"], \" \", [\"axios\", \"#79C0FF\"], \" \", [\"=\", \"#FF7B72\"], \" \", [\"require\", \"#D2A8FF\"], [\"(\", \"#C9D1D9\"], [\"'axios'\", \"#A5D6FF\"], [\");\", \"#C9D1D9\"], \"\\n\\n\", [\"exports\", \"#79C0FF\"], [\".\", \"#C9D1D9\"], [\"handler\", \"#D2A8FF\"], \" \", [\"= async\", \"#FF7B72\"], \" \", [\"(\", \"#C9D1D9\"], [\"context\", \"#FFA657\"], [\",\", \"#C9D1D9\"], \" \", [\"event\", \"#FFA657\"], [\",\", \"#C9D1D9\"], \" \", [\"callback\", \"#FFA657\"], [\")\", \"#C9D1D9\"], \" \", [\"=\u003e\", \"#FF7B72\"], \" \", [\"{\", \"#C9D1D9\"], \"\\n \", [\"// In Function Parameters, we defined `breed` as the inbound Body from\", \"#8B949E\"], \"\\n \", [\"// our Send \u0026 Wait For Reply Widget. We can access that via `event.breed`.\", \"#8B949E\"], \"\\n \", [\"// To minimize the potential for errors, lowercase and trim the user input.\", \"#8B949E\"], \"\\n \", [\"let\", \"#FF7B72\"], \" \", [\"breed\", \"#C9D1D9\"], \" \", [\"=\", \"#FF7B72\"], \" \", [\"event.breed.\", \"#C9D1D9\"], [\"toLowerCase\", \"#D2A8FF\"], [\"().\", \"#C9D1D9\"], [\"trim\", \"#D2A8FF\"], [\"();\", \"#C9D1D9\"], \"\\n\\n \", [\"// The Dog API also supports sub-breeds, so we need to handle that case.\", \"#8B949E\"], \"\\n \", [\"// For example, if the user requests \\\"Golden Retriever\\\", we need to format\", \"#8B949E\"], \"\\n \", [\"// the breed as \\\"retriever/golden\\\".\", \"#8B949E\"], \"\\n \", [\"if\", \"#FF7B72\"], \" \", [\"(breed.\", \"#C9D1D9\"], [\"includes\", \"#D2A8FF\"], [\"(\", \"#C9D1D9\"], [\"' '\", \"#A5D6FF\"], [\")) {\", \"#C9D1D9\"], \"\\n \", [\"const\", \"#FF7B72\"], \" \", [\"[\", \"#C9D1D9\"], [\"first\", \"#79C0FF\"], [\",\", \"#C9D1D9\"], \" \", [\"second\", \"#79C0FF\"], [\"]\", \"#C9D1D9\"], \" \", [\"=\", \"#FF7B72\"], \" \", [\"breed.\", \"#C9D1D9\"], [\"split\", \"#D2A8FF\"], [\"(\", \"#C9D1D9\"], [\"' '\", \"#A5D6FF\"], [\");\", \"#C9D1D9\"], \"\\n \", [\"breed\", \"#C9D1D9\"], \" \", [\"=\", \"#FF7B72\"], \" \", [\"`${\", \"#A5D6FF\"], [\"second\", \"#C9D1D9\"], [\"}/${\", \"#A5D6FF\"], [\"first\", \"#C9D1D9\"], [\"}`\", \"#A5D6FF\"], [\";\", \"#C9D1D9\"], \"\\n \", [\"}\", \"#C9D1D9\"], \"\\n\\n \", [\"const\", \"#FF7B72\"], \" \", [\"dogApiUrl\", \"#79C0FF\"], \" \", [\"=\", \"#FF7B72\"], \" \", [\"`https://dog.ceo/api/breed/${\", \"#A5D6FF\"], [\"breed\", \"#C9D1D9\"], [\"}/images/random`\", \"#A5D6FF\"], [\";\", \"#C9D1D9\"], \"\\n\\n \", [\"try\", \"#FF7B72\"], \" \", [\"{\", \"#C9D1D9\"], \"\\n \", [\"// Let's introduce some inconsistency by randomly throwing an error\", \"#8B949E\"], \"\\n \", [\"if\", \"#FF7B72\"], \" \", [\"(Math.\", \"#C9D1D9\"], [\"random\", \"#D2A8FF\"], [\"()\", \"#C9D1D9\"], \" \", [\"\u003e\", \"#FF7B72\"], \" \", [\"0.3\", \"#79C0FF\"], [\")\", \"#C9D1D9\"], \" \", [\"throw new\", \"#FF7B72\"], \" \", [\"Error\", \"#D2A8FF\"], [\"(\", \"#C9D1D9\"], [\"'No doge~'\", \"#A5D6FF\"], [\");\", \"#C9D1D9\"], \"\\n \", [\"// Make the request to the Dog API. Remember to use `await` since this\", \"#8B949E\"], \"\\n \", [\"// is an asynchronous request!\", \"#8B949E\"], \"\\n \", [\"const\", \"#FF7B72\"], \" \", [\"response\", \"#79C0FF\"], \" \", [\"= await\", \"#FF7B72\"], \" \", [\"axios.\", \"#C9D1D9\"], [\"get\", \"#D2A8FF\"], [\"(dogApiUrl);\", \"#C9D1D9\"], \"\\n \", [\"// Return the response to the Send \u0026 Wait For Reply Widget.\", \"#8B949E\"], \"\\n \", [\"return\", \"#FF7B72\"], \" \", [\"callback\", \"#D2A8FF\"], [\"(\", \"#C9D1D9\"], [\"null\", \"#79C0FF\"], [\", {\", \"#C9D1D9\"], \"\\n \", [\"text:\", \"#C9D1D9\"], \" \", [\"`Here's an image of a ${\", \"#A5D6FF\"], [\"event\", \"#C9D1D9\"], [\".\", \"#A5D6FF\"], [\"breed\", \"#C9D1D9\"], [\"}! 🐶`\", \"#A5D6FF\"], [\",\", \"#C9D1D9\"], \"\\n \", [\"// The `message` property of the response is the URL of the dog image.\", \"#8B949E\"], \"\\n \", [\"url: response.data.message,\", \"#C9D1D9\"], \"\\n \", [\"});\", \"#C9D1D9\"], \"\\n \", [\"}\", \"#C9D1D9\"], \" \", [\"catch\", \"#FF7B72\"], \" \", [\"(error) {\", \"#C9D1D9\"], \"\\n \", [\"// Remember to handle any errors that may occur!\", \"#8B949E\"], \"\\n \", [\"// This error message will be accessible as `widgets.get-doge-image.body`\", \"#8B949E\"], \"\\n \", [\"return\", \"#FF7B72\"], \" \", [\"callback\", \"#D2A8FF\"], [\"(\", \"#C9D1D9\"], [\"`Sorry, we couldn't find any ${\", \"#A5D6FF\"], [\"event\", \"#C9D1D9\"], [\".\", \"#A5D6FF\"], [\"breed\", \"#C9D1D9\"], [\"}s 🥲`\", \"#A5D6FF\"], [\");\", \"#C9D1D9\"], \"\\n \", [\"}\", \"#C9D1D9\"], \"\\n\", [\"};\", \"#C9D1D9\"]],\n \"annotations\": [{\n \"name\": \"mark\",\n \"query\": \"\",\n \"fromLineNumber\": 20,\n \"toLineNumber\": 20\n }, {\n \"name\": \"mark\",\n \"query\": \"\",\n \"fromLineNumber\": 21,\n \"toLineNumber\": 21\n }, {\n \"name\": \"mark\",\n \"query\": \"\",\n \"fromLineNumber\": 33,\n \"toLineNumber\": 33\n }, {\n \"name\": \"mark\",\n \"query\": \"\",\n \"fromLineNumber\": 34,\n \"toLineNumber\": 34\n }],\n \"themeName\": \"github-dark\",\n \"style\": {\n \"color\": \"#c9d1d9\",\n \"background\": \"#0d1117\"\n }\n }\n }), _jsx(Info, {\n children: _jsxs(_components.p, {\n children: [\"To get access to a returned error message, you will need to access the \", _jsx(_components.code, {\n children: \"body\"\n }), \" property returned by the Run Function Widget. This will look like \", _jsx(_components.code, {\n children: \"{{widgets.\u003cwidget-name\u003e.body}}\"\n }), \" if used in a liquid template.\"]\n })\n }), _jsx(_components.p, {\n children: \"Deploy your Function with this updated code, and once completed, send a new message to your Twilio phone number. Between this code change and the new widget in the Studio flow, you will (most likely, this is random, of course) see one or more error messages, ultimately followed by an image of your requested dog breed!\"\n }), _jsx(Image, {\n src: \"https://docs-assets.prod.twilio.com/509282620f794e4dc6d2d862d733c1d5ce847dbddf08f9d57e26964488870927.jpg\",\n blurDataURL: \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAMAAAAECAIAAADETxJQAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAM0lEQVR4nAEoANf/ADc8RUJCRKexxgBianBcW15WXWkA//b20cvLAAMPANna4KeenBEUGkgvESNscZ39AAAAAElFTkSuQmCC\",\n width: 1507,\n height: 2048,\n isOpaque: true,\n placeholder: \"blur\",\n alt: \"Error recovery loop and message.\",\n unoptimized: false\n }), _jsx(_components.p, {\n children: \"This is a very brief introduction to what is possible! Instead of a retry loop with a message, you could create an entirely new, logical flow of widgets where you ask the user for other information; your imagination is the only true limit here.\"\n })]\n })]\n });\n}\nfunction MDXContent(props = {}) {\n const {wrapper: MDXLayout} = {\n ..._provideComponents(),\n ...props.components\n };\n return MDXLayout ? _jsx(MDXLayout, {\n ...props,\n children: _jsx(_createMdxContent, {\n ...props\n })\n }) : _createMdxContent(props);\n}\nreturn {\n default: MDXContent\n};\nfunction _missingMdxReference(id, component) {\n throw new Error(\"Expected \" + (component ? \"component\" : \"object\") + \" `\" + id + \"` to be defined: you likely forgot to import, pass, or provide it.\");\n}\n","frontmatter":{"title":"Use the Run Function widget in Studio","seo_description":"Serverless Functions","show_breadcrumbs":false,"show_table_of_content":false,"page_type":"docs","headings":[{"depth":2,"value":"Create a Studio Flow and a user prompt","id":"create-a-studio-flow-and-a-user-prompt"},{"depth":2,"value":"Create and host a Function","id":"create-and-host-a-function"},{"depth":2,"value":"Install Dependencies and define the Function body","id":"install-dependencies-and-define-the-function-body"},{"depth":2,"value":"Use the Run Function widget","id":"use-the-run-function-widget"},{"depth":2,"value":"Consume the output of the Run Function widget","id":"consume-the-output-of-the-run-function-widget"},{"depth":2,"value":"Test it","id":"test-it"},{"depth":2,"value":"Go further with loops and failure flows","id":"go-further-with-loops-and-failure-flows"}]},"scope":{}},"matter":{"title":"Use the Run Function widget in Studio","seo_description":"Serverless Functions","show_breadcrumbs":false,"show_table_of_content":false,"page_type":"docs","headings":[{"depth":2,"value":"Create a Studio Flow and a user prompt","id":"create-a-studio-flow-and-a-user-prompt"},{"depth":2,"value":"Create and host a Function","id":"create-and-host-a-function"},{"depth":2,"value":"Install Dependencies and define the Function body","id":"install-dependencies-and-define-the-function-body"},{"depth":2,"value":"Use the Run Function widget","id":"use-the-run-function-widget"},{"depth":2,"value":"Consume the output of the Run Function widget","id":"consume-the-output-of-the-run-function-widget"},{"depth":2,"value":"Test it","id":"test-it"},{"depth":2,"value":"Go further with loops and failure flows","id":"go-further-with-loops-and-failure-flows"}]},"sidebarMenu":{"name":"Functions and Assets","path":"/docs/serverless/functions-assets","type":"file","children":[{"type":"file","name":"Return to Serverless overview","path":"/docs/serverless"},{"type":"file","name":"Overview","path":"/docs/serverless/functions-assets/functions"},{"type":"directory","path":"","name":"Technical concepts","children":[{"type":"file","name":"Function request flow","path":"/docs/serverless/functions-assets/functions/request-flow"},{"type":"file","name":"Function execution","path":"/docs/serverless/functions-assets/functions/invocation"},{"type":"file","name":"Visibility of Functions and Assets","path":"/docs/serverless/functions-assets/visibility"}]},{"type":"directory","path":"","name":"Get started","children":[{"type":"file","name":"Create a Service","path":"/docs/serverless/functions-assets/functions/create-service"},{"type":"file","name":"Assets","path":"/docs/serverless/functions-assets/assets"}]},{"type":"link","isExternal":true,"path":"/docs/labs/serverless-toolkit","name":"Serverless Toolkit"},{"type":"directory","path":"","name":"Developer guides","children":[{"type":"file","name":"Runtime Client","path":"/docs/serverless/functions-assets/client"},{"type":"file","name":"Runtime Handler","path":"/docs/serverless/functions-assets/handler"},{"type":"file","name":"Environment variables","path":"/docs/serverless/functions-assets/functions/variables"},{"type":"file","name":"Dependencies","path":"/docs/serverless/functions-assets/functions/dependencies"},{"type":"directory","path":"","name":"Headers and cookies","children":[{"type":"file","name":"Overview","path":"/docs/serverless/functions-assets/functions/headers-and-cookies"},{"type":"file","name":"Access values","path":"/docs/serverless/functions-assets/functions/headers-and-cookies/access"},{"type":"file","name":"Set and modify values","path":"/docs/serverless/functions-assets/functions/headers-and-cookies/setting-and-modifying"},{"type":"file","name":"Limitations","path":"/docs/serverless/functions-assets/functions/headers-and-cookies/limitations"},{"type":"link","isExternal":false,"path":"/docs/serverless/functions-assets/quickstart#learn-how-headers-and-cookies-can-add-extra-functionality-and-security","name":"Examples"}]},{"type":"file","name":"Debugging","path":"/docs/serverless/functions-assets/functions/debugging"},{"type":"file","name":"Frequently asked questions","path":"/docs/serverless/functions-assets/faq"}]},{"type":"directory","path":"","name":"Examples","children":[{"type":"file","name":"Receive an inbound SMS","path":"/docs/serverless/functions-assets/quickstart/receive-sms"},{"type":"file","name":"Send SMS and MMS","path":"/docs/serverless/functions-assets/quickstart/send-sms-and-mms"},{"type":"file","name":"Receive an incoming phone call","path":"/docs/serverless/functions-assets/quickstart/receive-call"},{"type":"file","name":"Make a Call","path":"/docs/serverless/functions-assets/quickstart/make-a-call"},{"type":"file","name":"Make an API request","path":"/docs/serverless/functions-assets/quickstart/api-request"},{"type":"file","name":"Use the Run Function widget in Studio","path":"/docs/serverless/functions-assets/quickstart/run-function-studio-widget"},{"type":"file","name":"Handle real-time data with Twilio Sync","path":"/docs/serverless/functions-assets/quickstart/real-time-data-sync"},{"type":"file","name":"Protect your Function with Basic Auth","path":"/docs/serverless/functions-assets/quickstart/basic-auth"},{"type":"file","name":"Protect your Function with JSON Web Token","path":"/docs/serverless/functions-assets/quickstart/json-web-token"},{"type":"file","name":"Manage application state with cookies","path":"/docs/serverless/functions-assets/quickstart/cookies-state"},{"type":"file","name":"Validate Webhook requests from SendGrid","path":"/docs/serverless/functions-assets/quickstart/validate-webhook-requests-from-sendgrid"},{"type":"file","name":"Enable CORS between Flex Plugins and Functions","path":"/docs/serverless/functions-assets/quickstart/enabling-cors-between-flex-plugins-and-functions"},{"type":"file","name":"Add delay","path":"/docs/serverless/functions-assets/quickstart/add-delay"},{"type":"file","name":"Determine carrier, phone number type, and caller info","path":"/docs/serverless/functions-assets/quickstart/lookup-carrier-and-caller-info"},{"type":"file","name":"Time of day routing with Functions","path":"/docs/serverless/functions-assets/quickstart/time-of-day-routing"},{"type":"file","name":"Normalize telephone numbers","path":"/docs/serverless/functions-assets/quickstart/normalize-telephone-numbers"},{"type":"file","name":"Prevent blocked numbers from calling your application","path":"/docs/serverless/functions-assets/quickstart/blocked-numbers"},{"type":"file","name":"Display Node.js and Twilio Helper Library versions","path":"/docs/serverless/functions-assets/quickstart/display-versions"},{"type":"file","name":"How to call Functions from Android","path":"/docs/serverless/functions-assets/quickstart/how-to-call-twilio-functions-android"},{"type":"file","name":"How to call Functions from iOS","path":"/docs/serverless/functions-assets/quickstart/how-to-call-twilio-functions-ios"}]},{"type":"directory","path":"","name":"Migration guides","children":[{"type":"file","name":"Migrating from Functions(Classic) to the new Functions Editor","path":"/docs/serverless/functions-assets/functions/migrating-functionsclassic-new-functions-editor"},{"type":"file","name":"Node.js v18 upgrade","path":"/docs/serverless/functions-assets/node-upgrade"}]}]},"editUrl":"https://github.com/twilio-internal/docs/blob/main/docs/serverless/functions-assets/quickstart/run-function-studio-widget.mdx"},"__N_SSG":true},"page":"/docs/[...path]","query":{"path":["serverless","functions-assets","quickstart","run-function-studio-widget"]},"buildId":"nWtU_5WJsvLGK2x62E_3J","isFallback":false,"gsp":true,"scriptLoader":[]}</script></body></html>