{"id":2584,"date":"2018-08-17T16:26:53","date_gmt":"2018-08-17T14:26:53","guid":{"rendered":"https:\/\/www.itidea.nl\/?p=2584"},"modified":"2018-08-28T15:01:28","modified_gmt":"2018-08-28T13:01:28","slug":"ngrok-testing-local-azure-function","status":"publish","type":"post","link":"https:\/\/www.itidea.nl\/index.php\/ngrok-testing-local-azure-function\/","title":{"rendered":"ngrok &#8211; Testing local Azure Function"},"content":{"rendered":"<p>The other day I was creating a SharePoint webhook using an Azure Function. I like to develop and debug Azure Functions locally on my machine.<br \/>\nA publicly accessible URL is necessary to create a webhook subscription , so I fired up <a href=\"https:\/\/ngrok.com\" target=\"_blank\" rel=\"noopener\">ngrok<\/a>.<\/p>\n<p>ngrok allows you to expose a web server running on your local machine to the internet. It therefor creates a temporary host name that forwards all traffic to a port on your local machine.<\/p>\n<p>It took me a little while to get ngrok to work so I could debug the local Azure Function.<\/p>\n<p>When debugging the Azure Function in Visual Studio the console will show the local url of the function, like <a href=\"http:\/\/localhost:7071\/api\/functionname\">http:\/\/localhost:7071\/api\/functionname<\/a> or https when configured, which I had.<\/p>\n<blockquote><p>Do not start the local Azure Function with https, just leave it http.<\/p><\/blockquote>\n<p>Start ngrok and add this port number<br \/>\n<strong>ngrok http 7071<\/strong><\/p>\n<p>Calling the temporary forwarding url provided by ngrok won&#8217;t work, because the hostname is now invalid.<\/p>\n<p>Azure Functions host only listens to the hostname &#8216;localhost&#8217;, but ngrok forwards the temporary domain as the host header. Therefor the host-header switch has to be used, like:<br \/>\n<strong>ngrok http 7071 &#8211;host-header localhost<\/strong><br \/>\nTo explicitly rewrite the host header to the specified value, or<br \/>\n<strong>ngrok http 7071 &#8211;host-header rewrite<\/strong><br \/>\ncan be used, where &#8216;rewrite&#8217; rewrites the host header to match the hostname of the forwarding address, here &#8216;localhost&#8217;.<\/p>\n<p>ngrok now provides a temporary url which is publicly accessible.<\/p>\n<p><a href=\"http:\/\/localhost:7071\/api\/functionname\">http:\/\/localhost:7071\/api\/functionname<\/a>\u00a0 now becomes something like <a href=\"https:\/\/temporarysubdomain.ngrok.io\/api\/functionname\">https:\/\/temporarysubdomain.ngrok.io\/api\/functionname<\/a><\/p>\n<p><a href=\"https:\/\/www.itidea.nl\/wp-content\/uploads\/2018\/08\/1-ngrok.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-2585\" src=\"https:\/\/www.itidea.nl\/wp-content\/uploads\/2018\/08\/1-ngrok.png\" alt=\"\" width=\"462\" height=\"98\" srcset=\"https:\/\/www.itidea.nl\/wp-content\/uploads\/2018\/08\/1-ngrok.png 462w, https:\/\/www.itidea.nl\/wp-content\/uploads\/2018\/08\/1-ngrok-300x64.png 300w\" sizes=\"auto, (max-width: 462px) 100vw, 462px\" \/><\/a><\/p>\n<p style=\"margin: 0in; font-family: Calibri; font-size: 11.0pt;\">Keep in mind that with a Free plan of ngrok the forwarding url changes at every restart.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>The other day I was creating a SharePoint webhook using an Azure Function. I like to develop and debug Azure Functions locally on my machine. A publicly accessible URL is necessary to create a webhook subscription , so I fired &#8230; <a class=\"more-link\" href=\"https:\/\/www.itidea.nl\/index.php\/ngrok-testing-local-azure-function\/\">Read More &raquo;<\/a><\/p>\n","protected":false},"author":2,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[49,31],"tags":[50,6],"class_list":["post-2584","post","type-post","status-publish","format-standard","hentry","category-azure","category-visual-studio","tag-azure","tag-visual-studio"],"_links":{"self":[{"href":"https:\/\/www.itidea.nl\/index.php\/wp-json\/wp\/v2\/posts\/2584","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.itidea.nl\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.itidea.nl\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.itidea.nl\/index.php\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/www.itidea.nl\/index.php\/wp-json\/wp\/v2\/comments?post=2584"}],"version-history":[{"count":6,"href":"https:\/\/www.itidea.nl\/index.php\/wp-json\/wp\/v2\/posts\/2584\/revisions"}],"predecessor-version":[{"id":2595,"href":"https:\/\/www.itidea.nl\/index.php\/wp-json\/wp\/v2\/posts\/2584\/revisions\/2595"}],"wp:attachment":[{"href":"https:\/\/www.itidea.nl\/index.php\/wp-json\/wp\/v2\/media?parent=2584"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.itidea.nl\/index.php\/wp-json\/wp\/v2\/categories?post=2584"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.itidea.nl\/index.php\/wp-json\/wp\/v2\/tags?post=2584"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}