ghost
commented
3 years ago Week 2 Step 8 ⬤⬤⬤⬤⬤⬤⬤⬤ | 🕐 Estimated completion: 5-10 minutes
Ok, Boomer :neutral_face:
✅ Task:
Modify your Azure Function so that it texts the user back with a song.
- [ ] Retrieve song url from a JSON object
- [ ] Use
${}to quickly insert strings - [ ] Return the url with a personalized message in the body of the request
- [ ] Make sure you're in the
song4ubranch - [ ] Commit your updated function code to
song4u/index.js
🚧 Test Your Work
To test your work, try texting a jpg image to your Twilio number (with a face!). You should receive a text back that contains the required message format.
Example:
Sent from your Twilio trial account - We guessed you're part of this generation: GenZ! Happy listening! https://open.spotify.com/track/0SIAFU49FFHwR3QnT5Jx0k?si=1c12067c9f2b4fbf:exclamation: Requirements
We'd like you to return a personalized message formatted like this:
We guessed you're part of this generation: [insert generation]! Happy listening! [song link]`We also made a JSON object for you. (You're welcome)
const songs = {"GenZ":"https://open.spotify.com/track/0SIAFU49FFHwR3QnT5Jx0k?si=1c12067c9f2b4fbf",
"GenY":"https://open.spotify.com/track/1Je1IMUlBXcx1Fz0WE7oPT?si=a04bbdf6ec4948b9",
"GenX":"https://open.spotify.com/track/4Zau4QvgyxWiWQ5KQrwL43?si=790d9e3ef2ed408d",
"BabyBoomers":"https://open.spotify.com/track/4gphxUgq0JSFv2BCLhNDiE?si=1abb329f2dc24f50",
"Unknown":"https://open.spotify.com/track/5ygDXis42ncn6kYG14lEVG?si=84b49b41d09d4d11"}Working with JSON
JSON has keys and values. In our case, the generation is the key, and the url is the value.
See if you can determine the url with this syntax:
let value = json_object[key]Shortcuts with Strings
You might be used to concatenating strings and variables like this:
let string = "Hello " + nameThat can get tiring, though. Try this syntax:
let string = `Hello ${name}`
emsesc
Week 2 Step 7 ⬤⬤⬤⬤⬤⬤⬤◯ | 🕐 Estimated completion: 15-25 minutes
How old are you??
✅ Task:
Modify your Azure Function so that it determines the user's generation.
song4ubranchsong4u/index.js🚧 Test Your Work
To test your work, try texting a jpg image to your Twilio number (with a face!). You should receive a text back that only contains the generation.
Example:
:exclamation: Requirements
Downloading image data
Based on the previous step, you should now be able to access your image url. We were able to access it with
queryObject.MediaUrl0.:question: How do I download the image?
Perform a quick GET request with fetch. > :bulb: Remember that you need to initialize variables for your packages! ```js let resp = await fetch(YOUR_URL,{ /*The await expression causes async function execution to pause until a Promise is settled (that is, fulfilled or rejected), and to resume execution of the async function after fulfillment. When resumed, the value of the await expression is that of the fulfilled Promise*/ method: 'GET', }) // receive the response let data = await resp.arrayBuffer() // we are receiving it as a Buffer since this is binary data ```
Analyzing the image
Recall the
analyzeImage()function we wrote in the previous project. This time, you will be calling for age data instead of emotion data.:bulb: Don't forget to read the documentation!
❓ What's the syntax again?
:goal: Retrieve age data from the Face API. ```js async function analyzeImage(img){ const subscriptionKey = process.env['subscriptionkey']; const uriBase = // WHAT'S YOUR ENDPOINT?; // env variables (similar to .gitignore/.env file) to not expose personal info let params = new URLSearchParams({ 'returnFaceId': 'true', 'returnFaceAttributes': //WHAT GOES HERE? }) // making the post request let resp = await fetch(uriBase + '?' + params.toString(),{ method: 'POST', body: img, // img is the parameter inputted headers: { 'Content-Type' : 'application/octet-stream', // HOW DO YOU AUTHENTICATE? } }) // receive the response let data = await resp.json(); return data; } ``` However, this code won't work. Fill in the code where needed **using your previous project and the documentation**.❓ How do I get an age from my analysis function?
Like you've done before, **call the `analyzeImage()` function with your image you downloaded.** > :bulb: Tip: Always `context.log()` your output so it's easier to determine how to access object attributes. The function returns face data formatted in JSON. We can determine the age like so: ```js let age = result[0].faceAttributes.age ``` This retrieves the **first face**, the `faceAttributes` attribute, and the `age` attribute from the previous object.Determining and returning Generation
Using the provided names and age ranges, you can use if else logic in Javascript to determine the generation.
:exclamation: Example please!
```js if (age > 5 && age < 25) { id = "GenZ" } ``` `id` is the variable we will return as the final generation.Texting the user back might seem complicated, but all you have to do is return the generation in the body!