Sending requests from Function service
From Function service, you can send HTTP requests to 3rd party applications.
This allows you to integrate with external services and get data from them.
Here, we'll show you how to send an HTTP request from Function service by using npm packages.
1. Write your function and bundle it for deployment
When you use npm packages in Function service, you need to bundle your function with the packages.
In this guide, we use esbuild to bundle your function with npm packages but any bundlers can be used.
Assuming you have a function like below:
<span><span style="color: var(--shiki-token-keyword)">import</span><span style="color: var(--shiki-color-text)"> { gql</span><span style="color: var(--shiki-token-punctuation)">,</span><span style="color: var(--shiki-color-text)"> request } </span><span style="color: var(--shiki-token-keyword)">from</span><span style="color: var(--shiki-color-text)"> </span><span style="color: var(--shiki-token-string-expression)">"graphql-request"</span><span style="color: var(--shiki-color-text)">;</span></span>
<span></span>
<span><span style="color: var(--shiki-token-constant)">globalThis</span><span style="color: var(--shiki-color-text)">.</span><span style="color: var(--shiki-token-function)">main</span><span style="color: var(--shiki-color-text)"> </span><span style="color: var(--shiki-token-keyword)">=</span><span style="color: var(--shiki-color-text)"> </span><span style="color: var(--shiki-token-keyword)">async</span><span style="color: var(--shiki-color-text)"> </span><span style="color: var(--shiki-token-keyword)">function</span><span style="color: var(--shiki-color-text)"> (args) {</span></span>
<span><span style="color: var(--shiki-color-text)"> </span><span style="color: var(--shiki-token-keyword)">const</span><span style="color: var(--shiki-color-text)"> </span><span style="color: var(--shiki-token-constant)">document</span><span style="color: var(--shiki-color-text)"> </span><span style="color: var(--shiki-token-keyword)">=</span><span style="color: var(--shiki-color-text)"> </span><span style="color: var(--shiki-token-function)">gql</span><span style="color: var(--shiki-token-string-expression)">`</span></span>
<span><span style="color: var(--shiki-token-string-expression)"> query ExampleQuery($pokemon: String!) {</span></span>
<span><span style="color: var(--shiki-token-string-expression)"> getFuzzyPokemon(pokemon: $pokemon) {</span></span>
<span><span style="color: var(--shiki-token-string-expression)"> species</span></span>
<span><span style="color: var(--shiki-token-string-expression)"> }</span></span>
<span><span style="color: var(--shiki-token-string-expression)"> }</span></span>
<span><span style="color: var(--shiki-token-string-expression)"> `</span><span style="color: var(--shiki-color-text)">;</span></span>
<span></span>
<span><span style="color: var(--shiki-color-text)"> </span><span style="color: var(--shiki-token-keyword)">const</span><span style="color: var(--shiki-color-text)"> </span><span style="color: var(--shiki-token-constant)">variables</span><span style="color: var(--shiki-color-text)"> </span><span style="color: var(--shiki-token-keyword)">=</span><span style="color: var(--shiki-color-text)"> {</span></span>
<span><span style="color: var(--shiki-color-text)"> pokemon</span><span style="color: var(--shiki-token-keyword)">:</span><span style="color: var(--shiki-color-text)"> </span><span style="color: var(--shiki-token-constant)">args</span><span style="color: var(--shiki-color-text)">.pokemon</span><span style="color: var(--shiki-token-punctuation)">,</span><span style="color: var(--shiki-color-text)"> </span><span style="color: var(--shiki-token-comment)">// e.g., "rayquaza"</span></span>
<span><span style="color: var(--shiki-color-text)"> };</span></span>
<span><span style="color: var(--shiki-color-text)"> </span><span style="color: var(--shiki-token-keyword)">let</span><span style="color: var(--shiki-color-text)"> res </span><span style="color: var(--shiki-token-keyword)">=</span><span style="color: var(--shiki-color-text)"> </span><span style="color: var(--shiki-token-keyword)">await</span><span style="color: var(--shiki-color-text)"> </span><span style="color: var(--shiki-token-function)">request</span><span style="color: var(--shiki-color-text)">(</span></span>
<span><span style="color: var(--shiki-color-text)"> </span><span style="color: var(--shiki-token-string-expression)">"https://graphqlpokemon.favware.tech/v8"</span><span style="color: var(--shiki-token-punctuation)">,</span></span>
<span><span style="color: var(--shiki-color-text)"> document</span><span style="color: var(--shiki-token-punctuation)">,</span></span>
<span><span style="color: var(--shiki-color-text)"> variables</span><span style="color: var(--shiki-token-punctuation)">,</span></span>
<span><span style="color: var(--shiki-color-text)"> );</span></span>
<span></span>
<span><span style="color: var(--shiki-color-text)"> </span><span style="color: var(--shiki-token-keyword)">return</span><span style="color: var(--shiki-color-text)"> { species</span><span style="color: var(--shiki-token-keyword)">:</span><span style="color: var(--shiki-color-text)"> </span><span style="color: var(--shiki-token-constant)">res</span><span style="color: var(--shiki-color-text)">.getFuzzyPokemon[</span><span style="color: var(--shiki-token-constant)">0</span><span style="color: var(--shiki-color-text)">].species };</span></span>
<span><span style="color: var(--shiki-color-text)">};</span></span>
<span></span>You need to bundle the function with a bundler.
In this case, we use esbuild to bundle the function.
<span><span style="color: var(--shiki-token-function)">esbuild</span><span style="color: var(--shiki-color-text)"> </span><span style="color: var(--shiki-token-string)">get_pokemon_function.js</span><span style="color: var(--shiki-color-text)"> </span><span style="color: var(--shiki-token-string)">--bundle</span><span style="color: var(--shiki-color-text)"> </span><span style="color: var(--shiki-token-string)">--minify</span><span style="color: var(--shiki-color-text)"> </span><span style="color: var(--shiki-token-string)">--outfile=dist/get_pokemon_function.js</span></span>
<span></span>caveat: You have to setup package.json and install the packages before bundling the function.
Once you bundle the function, you can deploy it to Tailor Platform.
2. Deploy your function
Directory Structure
Here's the sample directory structure for a Terraform project.
In this example, we placed the function code in the scripts directory and the bundled code in the dist directory.
<span><span style="color: var(--shiki-token-function)">.</span></span>
<span><span style="color: var(--shiki-token-function)">├──</span><span style="color: var(--shiki-color-text)"> </span><span style="color: var(--shiki-token-string)">applications.tf</span></span>
<span><span style="color: var(--shiki-token-function)">├──</span><span style="color: var(--shiki-color-text)"> </span><span style="color: var(--shiki-token-string)">pipeline.tf</span></span>
<span><span style="color: var(--shiki-token-function)">├──</span><span style="color: var(--shiki-color-text)"> </span><span style="color: var(--shiki-token-string)">pipeline_sample_function.tf</span></span>
<span><span style="color: var(--shiki-token-function)">├──</span><span style="color: var(--shiki-color-text)"> </span><span style="color: var(--shiki-token-string)">schema</span></span>
<span><span style="color: var(--shiki-token-function)">│ </span><span style="color: var(--shiki-color-text)"> </span><span style="color: var(--shiki-token-string)">└──</span><span style="color: var(--shiki-color-text)"> </span><span style="color: var(--shiki-token-string)">get_pokemon_function.graphql</span></span>
<span><span style="color: var(--shiki-token-function)">├──</span><span style="color: var(--shiki-color-text)"> </span><span style="color: var(--shiki-token-string)">scripts</span></span>
<span><span style="color: var(--shiki-token-function)">│ </span><span style="color: var(--shiki-color-text)"> </span><span style="color: var(--shiki-token-string)">├──</span><span style="color: var(--shiki-color-text)"> </span><span style="color: var(--shiki-token-string)">dist</span></span>
<span><span style="color: var(--shiki-token-function)">│ </span><span style="color: var(--shiki-color-text)"> </span><span style="color: var(--shiki-token-string)">│ </span><span style="color: var(--shiki-color-text)"> </span><span style="color: var(--shiki-token-string)">└──</span><span style="color: var(--shiki-color-text)"> </span><span style="color: var(--shiki-token-string)">get_pokemon_function.js</span></span>
<span><span style="color: var(--shiki-token-function)">│ </span><span style="color: var(--shiki-color-text)"> </span><span style="color: var(--shiki-token-string)">└──</span><span style="color: var(--shiki-color-text)"> </span><span style="color: var(--shiki-token-string)">get_pokemon_function.js</span></span>
<span><span style="color: var(--shiki-token-function)">├──</span><span style="color: var(--shiki-color-text)"> </span><span style="color: var(--shiki-token-string)">tailordb.tf</span></span>
<span><span style="color: var(--shiki-token-function)">├──</span><span style="color: var(--shiki-color-text)"> </span><span style="color: var(--shiki-token-string)">variables.tf</span></span>
<span><span style="color: var(--shiki-token-function)">└──</span><span style="color: var(--shiki-color-text)"> </span><span style="color: var(--shiki-token-string)">workspaces.tf</span></span>
<span></span>Pipeline Resolver Example
In order to run your function script, specify the function object inside the Pipeline step's operation.
Here's an example of Terraform code to set up the function in the Pipeline resolver.
<span><span style="color: var(--shiki-color-text)">resource </span><span style="color: var(--shiki-token-string-expression)">"tailor_pipeline_resolver"</span><span style="color: var(--shiki-color-text)"> </span><span style="color: var(--shiki-token-string-expression)">"pipeline_get_pokemon_function"</span><span style="color: var(--shiki-color-text)"> {</span></span>
<span><span style="color: var(--shiki-color-text)"> workspace_id </span><span style="color: var(--shiki-token-keyword)">=</span><span style="color: var(--shiki-color-text)"> </span><span style="color: var(--shiki-token-constant)">tailor_workspace</span><span style="color: var(--shiki-color-text)">.</span><span style="color: var(--shiki-token-constant)">starwars</span><span style="color: var(--shiki-color-text)">.id</span></span>
<span><span style="color: var(--shiki-color-text)"> namespace </span><span style="color: var(--shiki-token-keyword)">=</span><span style="color: var(--shiki-color-text)"> </span><span style="color: var(--shiki-token-constant)">tailor_pipeline</span><span style="color: var(--shiki-color-text)">.</span><span style="color: var(--shiki-token-constant)">starwars</span><span style="color: var(--shiki-color-text)">.namespace</span></span>
<span><span style="color: var(--shiki-color-text)"> name </span><span style="color: var(--shiki-token-keyword)">=</span><span style="color: var(--shiki-color-text)"> </span><span style="color: var(--shiki-token-string-expression)">"getPokemon"</span></span>
<span><span style="color: var(--shiki-color-text)"> description </span><span style="color: var(--shiki-token-keyword)">=</span><span style="color: var(--shiki-color-text)"> </span><span style="color: var(--shiki-token-string-expression)">"sample query resolver"</span></span>
<span><span style="color: var(--shiki-color-text)"> authorization </span><span style="color: var(--shiki-token-keyword)">=</span><span style="color: var(--shiki-color-text)"> {</span></span>
<span><span style="color: var(--shiki-color-text)"> insecure </span><span style="color: var(--shiki-token-keyword)">=</span><span style="color: var(--shiki-color-text)"> </span><span style="color: var(--shiki-token-constant)">true</span></span>
<span><span style="color: var(--shiki-color-text)"> }</span></span>
<span></span>
<span><span style="color: var(--shiki-color-text)"> sdl </span><span style="color: var(--shiki-token-keyword)">=</span><span style="color: var(--shiki-color-text)"> </span><span style="color: var(--shiki-token-function)">file</span><span style="color: var(--shiki-color-text)">(</span><span style="color: var(--shiki-token-string-expression)">"${path.module}/schema/get_pokemon_function.graphql"</span><span style="color: var(--shiki-color-text)">)</span></span>
<span></span>
<span><span style="color: var(--shiki-color-text)"> steps </span><span style="color: var(--shiki-token-keyword)">=</span><span style="color: var(--shiki-color-text)"> [</span></span>
<span><span style="color: var(--shiki-color-text)"> {</span></span>
<span><span style="color: var(--shiki-color-text)"> name </span><span style="color: var(--shiki-token-keyword)">=</span><span style="color: var(--shiki-color-text)"> </span><span style="color: var(--shiki-token-string-expression)">"getPokemon"</span></span>
<span><span style="color: var(--shiki-color-text)"> operation </span><span style="color: var(--shiki-token-keyword)">=</span><span style="color: var(--shiki-color-text)"> {</span></span>
<span><span style="color: var(--shiki-color-text)"> </span><span style="color: var(--shiki-token-keyword)">function</span><span style="color: var(--shiki-color-text)"> = {</span></span>
<span><span style="color: var(--shiki-color-text)"> name </span><span style="color: var(--shiki-token-keyword)">=</span><span style="color: var(--shiki-color-text)"> </span><span style="color: var(--shiki-token-string-expression)">"getPokemonFunction"</span></span>
<span><span style="color: var(--shiki-color-text)"> script </span><span style="color: var(--shiki-token-keyword)">=</span><span style="color: var(--shiki-color-text)"> </span><span style="color: var(--shiki-token-function)">file</span><span style="color: var(--shiki-color-text)">(</span><span style="color: var(--shiki-token-string-expression)">"${path.module}/scripts/dist/get_pokemon_function.js"</span><span style="color: var(--shiki-color-text)">)</span></span>
<span><span style="color: var(--shiki-color-text)"> variables </span><span style="color: var(--shiki-token-keyword)">=</span><span style="color: var(--shiki-color-text)"> </span><span style="color: var(--shiki-token-string-expression)">"({ pokemon: context.args.input.pokemon })"</span></span>
<span><span style="color: var(--shiki-color-text)"> }</span></span>
<span><span style="color: var(--shiki-color-text)"> }</span></span>
<span><span style="color: var(--shiki-color-text)"> post_script </span><span style="color: var(--shiki-token-keyword)">=</span><span style="color: var(--shiki-color-text)"> <<</span><span style="color: var(--shiki-token-function)">EOF</span></span>
<span><span style="color: var(--shiki-color-text)"> </span><span style="color: var(--shiki-token-function)">getPokemonFunction</span></span>
<span><span style="color: var(--shiki-color-text)"> </span><span style="color: var(--shiki-token-function)">EOF</span></span>
<span><span style="color: var(--shiki-color-text)"> }</span></span>
<span><span style="color: var(--shiki-color-text)"> ]</span></span>
<span><span style="color: var(--shiki-color-text)">}</span></span>
<span></span><span><span style="color: var(--shiki-token-keyword)">input</span><span style="color: var(--shiki-color-text)"> </span><span style="color: var(--shiki-token-constant)">functionGetPokemonInput</span><span style="color: var(--shiki-color-text)"> {</span></span>
<span><span style="color: var(--shiki-color-text)"> pokemon: </span><span style="color: var(--shiki-token-constant)">String</span><span style="color: var(--shiki-token-keyword)">!</span></span>
<span><span style="color: var(--shiki-color-text)">}</span></span>
<span><span style="color: var(--shiki-token-keyword)">type</span><span style="color: var(--shiki-color-text)"> </span><span style="color: var(--shiki-token-constant)">functionGetPokemonResponse</span><span style="color: var(--shiki-color-text)"> {</span></span>
<span><span style="color: var(--shiki-color-text)"> species: </span><span style="color: var(--shiki-token-constant)">String</span></span>
<span><span style="color: var(--shiki-color-text)">}</span></span>
<span></span>
<span><span style="color: var(--shiki-token-keyword)">extend</span><span style="color: var(--shiki-color-text)"> </span><span style="color: var(--shiki-token-keyword)">type</span><span style="color: var(--shiki-color-text)"> </span><span style="color: var(--shiki-token-constant)">Query</span><span style="color: var(--shiki-color-text)"> {</span></span>
<span><span style="color: var(--shiki-color-text)"> getPokemon(input: </span><span style="color: var(--shiki-token-constant)">functionGetPokemonInput</span><span style="color: var(--shiki-token-keyword)">!</span><span style="color: var(--shiki-color-text)">): </span><span style="color: var(--shiki-token-constant)">functionGetPokemonResponse</span></span>
<span><span style="color: var(--shiki-color-text)">}</span></span>
<span></span>Deployment
Let's deploy the function to Tailor Platform.
<span><span style="color: var(--shiki-token-function)">terraform</span><span style="color: var(--shiki-color-text)"> </span><span style="color: var(--shiki-token-string)">apply</span></span>
<span></span>Once the deployment is complete, you can send a request to the function. Let's open the playground and run the query.
<span><span style="color: var(--shiki-token-function)">tailorctl</span><span style="color: var(--shiki-color-text)"> </span><span style="color: var(--shiki-token-string)">workspace</span><span style="color: var(--shiki-color-text)"> </span><span style="color: var(--shiki-token-string)">app</span><span style="color: var(--shiki-color-text)"> </span><span style="color: var(--shiki-token-string)">open</span><span style="color: var(--shiki-color-text)"> </span><span style="color: var(--shiki-token-string)">-n</span><span style="color: var(--shiki-color-text)"> ${YOUR_APP_NAME}</span></span>
<span></span>Then, you can run the query in the playground
<span><span style="color: var(--shiki-token-keyword)">mutation</span><span style="color: var(--shiki-color-text)">{</span></span>
<span><span style="color: var(--shiki-color-text)"> getPokemon(input: {</span><span style="color: var(--shiki-token-string)">pokemon</span><span style="color: var(--shiki-color-text)">: </span><span style="color: var(--shiki-token-string-expression)">"ray"</span><span style="color: var(--shiki-color-text)">}) {</span></span>
<span><span style="color: var(--shiki-color-text)"> species</span></span>
<span><span style="color: var(--shiki-color-text)"> }</span></span>
<span><span style="color: var(--shiki-color-text)">}</span></span>
<span></span>you'll get the response like below:
<span><span style="color: var(--shiki-color-text)">{</span></span>
<span><span style="color: var(--shiki-color-text)"> </span><span style="color: var(--shiki-token-keyword)">"data"</span><span style="color: var(--shiki-token-punctuation)">:</span><span style="color: var(--shiki-color-text)"> {</span></span>
<span><span style="color: var(--shiki-color-text)"> </span><span style="color: var(--shiki-token-keyword)">"getPokemon"</span><span style="color: var(--shiki-token-punctuation)">:</span><span style="color: var(--shiki-color-text)"> {</span></span>
<span><span style="color: var(--shiki-color-text)"> </span><span style="color: var(--shiki-token-keyword)">"species"</span><span style="color: var(--shiki-token-punctuation)">:</span><span style="color: var(--shiki-color-text)"> </span><span style="color: var(--shiki-token-string-expression)">"rayquaza"</span></span>
<span><span style="color: var(--shiki-color-text)"> }</span></span>
<span><span style="color: var(--shiki-color-text)"> }</span></span>
<span><span style="color: var(--shiki-color-text)">}</span></span>
<span></span>