Is it a good practice to use PATCH instead of GET? - reactjs

I'm working on a project with .net-core backend and react/react-native for frontend/mobile. On frontend we use axios for api client. The problem we've got was with HTTP GET method. We wanted to send GET with data in body instead of URL params as it was easier to parse it in backend, but for some reason axios was having problem with dealing with it this way. Now our current solution is to use PATCH instead of GET and want to ask if it is a good/acceptable practice - and if not, what would be the best workaround for this problem?

Related

Consume POST data on react

We are calling a payment gateway api and that vendor is sending response with some POST method. Our UI is build in react which is not able to consume that data. How can I do that?
Assuming this is CCAvenue, you will need a server to take that response and redirect you back to React with the necessary details.
If I get your question right, here it's better if they send it using GET. If you want to consume the data then this is the right way.

React Query define custom behavior if Error (get new Token based on RefreshToken)

I try to understand how could i override default behavior of React Query if for example i made reguest (query or mutation ) => and it recieved 401 Unathorization. I understand that i need to send request to get new access token based on my refresh token which i already have in my localstorage.
I could trigger it every time just write logic if onError and then try request once again with new accessToken.
But my app have more than 1000+ requests that i need to add this logic. And i wonder how i can make it in one place by default. Probably in Middleware or something like this (I'm new in React). Please share any kind of suitable solution.
Thank you in advance
The recommended approach right now is to not couple this logic with react-query, but with the actual library that does the data fetching for you. If you use for example axios - it offers interceptors. There are also some good suggestions in this discussion about async retries.

best practice to pass mock data to Angular & Ionic

I am working on an Ionic phone app using AngualrJs as the framework. Now I faced an issue. I don't want my app to send an HTTP request to my backend(which use Ruby on Rails) API to do a manual test.
So I'm wondering what's the best practice to pass a mock JSON data as a response when I want to call the API.
I'm not familiar with Angular and Ionic, I can find some tutorials on both sides but I don't know what's is the best practice if use them together.
You can either store the data in localStorage after the first hit and read the data from localStorage every-time whenever you need.
https://medium.com/#petehouston/awesome-local-storage-for-ionic-with-ngstorage-c11c0284d658
Or you can use
$httpBackend
https://docs.angularjs.org/api/ngMock/service/$httpBackend
by saving json files locally and injecting them back when the application tries to hit the network . One limitation here, you cannot update the json file later after the user have installed the application.
So, localStorage is preferred if you want to cache the data you have received from network.

Get header of existing page in angularjs

Is there a way to get the header of the current page in angularjs, without having to do a separate call? I can't find this in the docs anywhere, but it seems like it should be possible.
E.g. if the file index.html contains the angular code, how do I read the header of the initial request to get index.html? I could use $http to make the call again, but that seems unnecessary.
If you are not handling the http request you won't have access to the request or the response, unless the code that it's making the request exposes that information somehow, which is not the case. So, I'm sorry but the answer is no.
However, if I may: what is exactly what you need from the response header? Because there could be other ways to obtain the information of the headers (i.e. cookies)

AngularJS getting data from backend

I would like to know what is the proper way to get data from backend when I want to use angularJs (or similar) in my web app?
The only way I see is to render html (static html with js scripts - e.g. angularjs) with no data from backend and then download data via ajax requests from my backend API. But I think this solution is not good because of many HTTP requests:
For example I have blog website, I want to show a post, comments, and the related posts on the sidebar. So probably I need to make at least 3 HTTP requests to get the data unless I will prepare API to get all I need in one request.
I can also imagine websites that could have much more HTTP requests. Is it a proper way to do this? Doesn't it overload a server? Or my way of thinking is so wrong?
It is either websockets or HTTP requests. Preparing API to get all in one request is one option. Another two options are XMLHttpRequest/iframe streaming which is a method of a technique known as Comet.
I would go with websockets since it is supposed to solve the problem that was previously solved with weird applications like iframe streaming. There are libraries that properly handles fallbacks if the browser does not support websockets:
web-socket-js ( this needs a websocket server )
Socket.IO ( this has a node.js module and also implements a kind of unnecessary protocol on top of websocket protocol )
If you choose the old methods there will be many problems waiting for you on the road like XmlHttpRequest.responseText while loading (readyState==3) in Chrome
I think you have to distinguish two cases:
You render the page for the first time.
You update parts of your page when something changes
Of course in the second case it makes sense to fetch only parts of the page via individual HTTP requests. However, in the first case you can simply serialize your complete model as one JSON object and embed it in the page like this:
<script type="text/javascript">
var myCompleteModel = { /* Here goes your model */ };
<script>
The controllers of the components on your page can then access this global variable to extract the parts being relevant for them. You can also wrap access to the initial model in a service to avoid accessing a global variable in all your controllers.

Resources