ditkrg/AuthorizationServerDemos
4
0
Fork 0
mirror of https://github.com/ditkrg/AuthorizationServerDemos.git synced 2026-01-25 11:36:42 +00:00
Code Issues Packages Projects Releases Wiki Activity

the react client now automatically fetches data

Browse Source
This commit is contained in:
Muhammad Azeez 2021-01-10 14:29:31 +03:00
parent 7fd435a217
commit 354c8260a1
2 changed files with 8 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
React/src/pages/home.js
View File

@ -3,6 +3,7 @@ import { signoutRedirect } from '../services/userService'
import { useSelector } from 'react-redux' import { useSelector } from 'react-redux'
import * as apiService from '../services/apiService' import * as apiService from '../services/apiService'
import { prettifyJson } from '../utils/jsonUtils' import { prettifyJson } from '../utils/jsonUtils'
import { useEffect } from 'react'
function Home() { function Home() {
const user = useSelector(state => state.auth.user) const user = useSelector(state => state.auth.user)
@ -11,6 +12,10 @@ function Home() {
const [color, setColor] = useState('White') const [color, setColor] = useState('White')
const [type, setType] = useState(1) const [type, setType] = useState(1)
useEffect(() => {
getVehicles();
}, []);
const [vehicleData, setVehicleData] = useState(null) const [vehicleData, setVehicleData] = useState(null)
function signOut() { function signOut() {
signoutRedirect() signoutRedirect()
@ -78,7 +83,7 @@ function Home() {
{ {
vehicleData ? vehicleData ?
<ul> <ul>
{ vehicleData.map(v => (<li>{v.color} {v.model} ({v.licensePlate}) - {getType(v.type)}</li>)) } { vehicleData.map(v => (<li key={v.id}>{v.color} {v.model} ({v.licensePlate}) - {getType(v.type)}</li>)) }
</ul> </ul>
: :
<p>No vehicles yet :(</p> <p>No vehicles yet :(</p>

4
React/src/services/apiService.js
View File

@ -1,13 +1,13 @@
import axios from 'axios' import axios from 'axios'
async function getVehiclesFromApi(access_token) { async function getVehiclesFromApi(access_token) {
const response = await axios.get(`https://localhost:5001/api/Vehicles`, { headers: { 'Authorization': `Bearer ${access_token}` } }); const response = await axios.get(`https://localhost:6001/api/Vehicles`, { headers: { 'Authorization': `Bearer ${access_token}` } });
return response.data; return response.data;
} }
async function registerVehicle(vehicle, access_token) { async function registerVehicle(vehicle, access_token) {
console.log(vehicle); console.log(vehicle);
const response = await axios.post(`https://localhost:5001/api/Vehicles`, vehicle, { headers: { 'Authorization': `Bearer ${access_token}` } }); const response = await axios.post(`https://localhost:6001/api/Vehicles`, vehicle, { headers: { 'Authorization': `Bearer ${access_token}` } });
return response.data; return response.data;
} }