Fetch with Custom Headers inside React Server Component - reactjs

Is it possible to make a fetch request with custom headers inside a React server component? I'm trying access a video stream url with custom headers.
This is the API I'm trying to stream the video from:
{
"status_code": 200,
"message": "Episode found",
"data": {
"anime_id": 5,
"number": 100,
"title": "Episodio 100: La catena invisibile",
"video": "https://cdn2.dreamsub.me/fl/eyeshield-21/100/SUB_ITA/480p?token=73UQpt6f00zRQWyDUeGbefNcrpi8qYA3Pk310BoXZi4I3MQzUSkia026Kf9rxnYV",
"video_headers": {
"host": "cdn.dreamsub.cc",
"referer": "https://cdn2.dreamsub.me/fl/eyeshield-21/100/SUB_ITA/480p?token=73UQpt6f00zRQWyDUeGbefNcrpi8qYA3Pk310BoXZi4I3MQzUSkia026Kf9rxnYV"
},
"quality": "480",
"format": "mp4",
"locale": "it",
"is_dub": false,
"id": 485
},
"version": "1"
}

Related

Teams adaptive card wait for respons in Logic App

I'm trying out adaptive cards in an attempt to integrate warnings through logic apps with teams. the question i'm about to ask is related to having the connector in Logic app wait for an response from the adaptive card in Teams after being sent from the Logic app.
I've managed to create my adaptive card and in that card i have the necessary information and two actions at the bottom that i want my logic app to react on so to speak.
My Adaptive card looks something like this:
{
"type": "AdaptiveCard",
"version": "1.0",
"$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
"body": [
{
"type": "TextBlock",
"text": "Alert - Employee email differences found:",
"weight": "Bolder",
"size": "Medium",
"horizontalAlignment": "Left",
"spacing": "Medium",
"maxLines": 0
},
{
"type": "ColumnSet",
"columns": [
{
"type": "Column",
"width": "stretch",
"items": [
{
"type": "TextBlock",
"text": "New Email",
"weight": "Bolder"
},
{
"type": "TextBlock",
"text": "Test.Person21#mail.com"
},
{
"type": "TextBlock",
"text": "Test.Person22#mail.com"
}
]
},
{
"type": "Column",
"width": "stretch",
"items": [
{
"type": "TextBlock",
"text": "Old Email",
"weight": "Bolder"
},
{
"type": "TextBlock",
"text": "Test.Person11#mail.com"
},
{
"type": "TextBlock",
"text": "Test.Person12#mail.com"
}
]
}
],
"separator": true
}
],
"actions": [
{
"type": "Action.Submit",
"title": "Update Now",
"style": "positive",
"data": true
},
{
"type": "Action.Submit",
"title": "Dismiss",
"style": "destructive",
"data": false
}
]
}
As you can se when i push on "update now" i get the error message saying "there is no backend/app to connect to" (in swedish - "Can't reach application, try again") basically.
So again what i'm trying to do is for the Logic app to wait for the respons.
After the logic app has sen the message it "completes".
So is this possible? If so, how do i get this to work?
while logic apps can send cards to MS Teams they can not listen on actions performed on those cards.
To be able to use card actions you need to have a custom service made that listens and acts on those activities.

How to display get data from object uri json file in react js

I attach a one json data in this json data there is an object called uri this uri contains a json file so, I am able to show all data from original json file but I could not fetch data from uri , How to do this
[
{
"id": 59413,
"thumbnail": {
"id": "60255",
"title": "dornoch-castle-whisky-bar",
"alt": "dornoch-castle-whisky-bar",
"url": "https://media-magazine.trivago.com/wp-content/uploads/2019/01/23144800/dornoch-castle-whisky-bar.jpg",
"courtesy": "",
"position": "center"
},
"thumbnail_url": "https://media-magazine.trivago.com/wp-content/uploads/2019/01/23144800/dornoch-castle-whisky-bar.jpg",
"slug": "dornoch-castle-scotland-whisky",
"uri": "http://trivago-magazine-work-sample-server.s3-website.eu-central-1.amazonaws.com/dornoch-castle-scotland-whisky.json",
"title": "Dornoch Castle: A Whisky Tasting at One of the World's Most Popular Hotel Bars",
"card_title": "Whisky Tasting at Dornoch Castle in the Scottish Highlands",
"show_publish_date": false,
"date": "January 29th, 2019",
"newsletter_popup": false,
"newsletter_popup_header_image": false,
"taxonomies": {
"destinations": [
{
"name": "Europe",
"uri": "/destination/international/europe",
"slug": "europe",
"term_id": 1384
}
],
"themes": [],
"types": [
{
"name": "Nature",
"uri": "/type/nature",
"slug": "nature",
"term_id": 1380
}
]
},
"excerpt": "Dornoch Castle has amassed a whisky collection unlike most any other in the world. trivago Magazine Editor, Joe Baur, signs up for their whisky tasting. Video below."
},
{

Microsoft Flow Custom Connector webhook trigger definition and implementation : 404 not found after flow creation

I'm trying to create a custom connector for my API in Microsoft Flow so users can trigger flows based on a webhook implementation.
The authentication part seems to be working properly (I'm able to create connections). After creating a flow using my custom trigger, it never gets triggered. When checking the data on my end it seems that Flow was never able to register the subscription properly.
If I navigate to the management page for the flow, I get the following error message.
When I click on fix the trigger I get the following details where the Id parameter matches the id of the resource we're trying to subscribe to.
Here is the trigger definition:
{
"/AlertRules/{id}/webhooks": {
"x-ms-notification-content": {
"schema": {
"type": "object",
"properties": {
"Title": {
"type": "string",
"description": "Title"
},
"Text": {
"type": "string",
"description": "Text"
},
"Data": {
"type": "array",
"items": {
"$ref": "#/definitions/DataApi.Models.AlertEvent"
},
"description": "Data"
}
}
},
"description": ""
},
"post": {
"responses": {
"201": {
"description": "Created",
"schema": {
"type": "string"
}
}
},
"x-ms-trigger": "single",
"operationId": "NewAlertEvent",
"summary": "When a new Alert Event is created or updated",
"parameters": [
{
"name": "id",
"in": "path",
"required": true,
"type": "string",
"x-ms-visibility": "important",
"x-ms-dynamic-values": {
"operationId": "AlertRules.AlertRule.ListAlertRule",
"value-path": "Id",
"value-collection": "value",
"value-title": "Description"
}
},
{
"name": "body",
"in": "body",
"required": false,
"schema": {
"type": "string",
"x-ms-visibility": "internal",
"title": "",
"x-ms-notification-url": true
},
"x-ms-visibility": "internal"
}
]
}
}
The description of my delete operation
{
"/AlertRuleSubscriptions({Id})": {
"delete": {
"tags": [
"AlertRuleSubscriptions.AlertRuleSubscription"
],
"summary": "Delete entity from AlertRuleSubscriptions",
"operationId": "AlertRuleSubscriptions.AlertRuleSubscription.DeleteAlertRuleSubscription",
"parameters": [
{
"in": "path",
"name": "Id",
"description": "key: Id",
"required": true,
"type": "string",
"format": "uuid",
"pattern": "^[0-9a-fA-F]{8}-[0-9a-fA-F]{4}-[0-9a-fA-F]{4}-[0-9a-fA-F]{4}-[0-9a-fA-F]{12}$",
"x-ms-docs-key-type": "AlertRuleSubscription"
},
{
"in": "header",
"name": "If-Match",
"description": "ETag",
"type": "string"
}
],
"responses": {
"204": {
"description": "Success"
},
"default": {
"$ref": "#/responses/error"
}
},
"x-ms-docs-operation-type": "operation"
}
}
}
And my post operation does reply with a Location header which matches the format of the delete operation described above.
My questions are:
What is missing in my trigger declaration?
How can I get more details on the subscription creation and the error Microsoft Flow is generating?
After some internal discussions with Microsoft we found two main issues.
First I updated the body parameter of the POST request to create the subscription to this.
{
"name": "body",
"in": "body",
"required": false,
"schema": {
"type": "object",
"properties": {
"callbackUrl": {
"type": "string",
"required": true,
"description": "callbackUrl",
"x-ms-notification-url": true,
"x-ms-visibility": "internal"
}
}
}
}
That is because the connector definitions don't support sending the callback URL in the body without using JSON formatting and because Flow was implemented using the Open API callback specification.
Second I updated my API to support the specification mentioned above.

Wagtail-API: html_url does not include port

I am passing the html_url through href. However, since it does not include the port 8000, the request is rejected (err: "localhost refused to connect.").
get-request: json
"items": [
{ "id": 3,
"meta": { "type": "home.HomePage",
"detail_url": "http://localhost/api/v2/pages/3/",
"html_url": "http://localhost/",
"slug": "home",
"first_published_at": "2018-02-11T03:08:18.344199Z"
},
"title": "Home"
}]
Is there a way to include my port?

How to save png image in mongodb with angularjs and deployd

I am working on an app where I need to retrieve images from URLS (for example http://foo.com/bar.png) and save them in mongodb. The app is built using angularjs and uses deployd for the API stuff. Here is the config.js file for the image collection:
{
"type": "Collection",
"properties": {
"image": {
"name": "image",
"type": "image/png",
"typeLabel": "image/png",
"required": true,
"id": "image",
"order": 0
}
}
}
I have tried searching but I was unable to find anything for images and deployd. I just need a simple way to retrieve images from URLs, save them in mongodb and then render them later on.
There's no column type image/png AFAIK. We can use string instead of it. Why not inserting the image as data uri?
{
"type": "Collection",
"properties": {
"image": {
"name": "image",
"type": "string",
"typeLabel": "string",
"required": true,
"id": "image",
"order": 0
}
}
}

Resources