I have an API Gateway resource which calls a Dynamodb post request to query a table. I'm trying to call the API within my React app using Axios. The API is working, returning the data as expected (console log) but I'm getting errors if I try to use #aws-sdk/util-dynamodb (unmarshall) to convert the api data.items response into JSON and use within React.
./node_modules/#aws-sdk/util-dynamodb/dist-es/convertToNative.js 45:14 Module parse failed: Unexpected token (45:14)
Is there a way to use 'unmarshall' within React? Something like this:
useEffect(() => {
const getGoal = async () => {
try {
const response = await api.get(apiUrl)
setGoal(unmarshall(response.data.Items))
This works if I use a Lambda service, but I'm try to see if I can reduce my code.
While I'm not sure on the issue you are getting with unmarshall function, I would suggest using the DynamoDB Document Client which will return your data already unmarshalled.
The DynamoDB Document client simplifies working with items by abstracting the notion of attribute values. This abstraction annotates native JavaScript types supplied as input parameters, and converts annotated response data to native JavaScript types.
Related
I have web application based on next js and react js. In this app i fetching data from api using getStaticProps and i return the array with data. But when i try get a single object by id using getServerSideProps i get a whole array of data instede of object that i want tu get.
This is code that i try to get a single object, and in this case i get a whole data:
const response = await fetch(https://api.json-generator.com/templates/someNumder/data?access_token=someToken${context.params.id})
If i place the id variable before access token, then i get 'not found', and in this case i expect to achieve a single object:
const response = await fetch(https://api.json-generator.com/templates/someNumder/data/${context.params.id}?access_token=someToken)
As stated above in the title I am currently facing issues fetching graph places with PnPJs, using the #pnp/graph graphfi factory interface in SPFx.
I am currently able to fetch data from my events via graphfi as can be seen below:
React.useEffect(() => {
graph = graphfi().using(SPFx(props.context));
getSpecificCalendar();
}, []);
const getSpecificCalendar = async () => {
await graph.me.events().then((e) => setCalendarEvent(e));
}
I have tried to get the places property from the graph object but to no avail. The only properties present are me and users but no option for places.
Esentially what I want to do is to graph.places. The conclusion I have come to is that #pnp/graph does not have any methods to get room data. Any ideas other than what I have tried above would be extremely helpful.
It looks like pnpjs does not have the /places endpoint implemented (yet). You could try using the built-in SPFx graph client for now. Something like:
const client = await props.context.msGraphClientFactory.getClient('3')
const response = await client.api('/places/......').get();
Alternatively, you could implement the /places endpoint yourself and submit a pull request for pnpjs :)
I have a Print service which requires parameters.
After posting parameters to the service URL, it renders a page.
I m trying to build something like the code below. I want to post json data to an external URL and I want to see the content. How can I do it?
import { jsonDataModel } from "../Models/jsonDataModel";
const PrintPage = (jsonData:jsonDataModel ) => {
window.location.replace('https://localhost:7205/api/print', jsonData);
return (
<div>PrintPage</div>
)
}
export default PrintPage
i would send data as parameters like
window.location.replace('https://localhost:7205/api/print?parameter1=name');
but i'm curious, whether i can send data from body.
Sending data as object to an external link can only via query string (as parameters) so you can do like :
'https://localhost:7205/api/print?parameter1=name1¶meter2=name2¶meter3=name3 ...etc'
but sending data object throw external link doesn't work , you have no access to this data outside your project like when you send it as state of Link component from react-router-dom
I am trying to use the searchKitManager inside react-admin I provided the parameters etc according to the docs but when I run the code it throws errors. Here is how the code works
React Admin is running on http://localhost:3000
Golang backend is running on http://localhost:3006
ElasticSearch is running on http://localhost:9200
When data is inserted in mysql database using golang code it is also inserted in elasticsearch later on in one of my display component I call the above searchkitManager as follows
let apiUrl= 'http://localhost:9200/donate' // what link should I pass, url to elasticsearch or url to my backend
const searchkit = new SearchkitManager('/', {
searchUrlPath: `${apiUrl}/_search`,
});
This code will throw 404 Not Found or 400 Bad Request error but the API works in postman
if I change the above link to
let apiUrl= 'http://localhost:9200/donate' // what link should I pass, url to elasticsearch or url to my backend
const searchkit = new SearchkitManager('/', {
searchUrlPath: `${apiUrl}/_doc/`,
});
I am not getting anything at all sometimes it no error in console and sometimes 400 Bad Request or 405 Post Not Allowed
One last thing the link I am providing as for searchUrlPath should be like that or not? or should I pass the apiUrl in place of /? I tried that as well but just to make sure.
Any kind of help will be really appreciated.
Try doing this:
const elasticSearchUrl = 'http://localhost:9200/<your_index>';
const searchkit = new SearchkitManager(elasticSearchUrl );
I'm new to GraphQL and was curious if I could use it to query an external, third-part API for data. I have an express backend and a react frontend and I'm sending a GET request to a third party API for the price of precious metals.
The API responds with one big object that is filled with things I don't need but I still get via HTTP. For example, API is returning this:
{
"gold_bid_usd_toz": "1303.58",
"gold_ask_usd_toz": "1304.58",
"gold_change_dollar_usd_toz": "1.23",
"gold_change_percent_usd_toz": "0.09%",
"gold_high_usd_toz": "1306.51",
"gold_low_usd_toz": "1299.85",
"gold_londonfix_am": "1320.7",
"gold_londonfix_pm": "1319.92",
"silver_bid_usd_toz": "16.5",
"silver_ask_usd_toz": "16.6",
"silver_change_dollar_usd_toz": "-0.02",
"silver_change_percent_usd_toz": "-0.13%",
"silver_high_usd_toz": "16.6",
"silver_low_usd_toz": "16.46",
"silver_londonfix": "16.6",
...LOTS MORE...
}
If I'm only interested in two of the properties, can I do something like this:
query {
gold_bid_usd_toz
silver_bid_usd_toz
}
Just not sure if I have to control backend data in order to use GraphQL. Thanks.
You can return your request response directly from a resolver as it is.
Then in a frontend query matching this resolver, get only what you asked for.
Backend:
rootQuery {
resolverName: () => getThirdParty
}
Frontend:
query {
resolverName {
whatYouWant1
whatYouWant2
}
}
Both your query and resolver should match your graphql schema but not the third party response.