refactor to fetch to ensure proper cookie storage
This commit is contained in:
parent
ca6773c18d
commit
ff2e1e82b2
5 changed files with 54 additions and 20 deletions
|
@ -1,17 +1,14 @@
|
||||||
import React, {useState, useEffect, useReducer} from 'react';
|
import React, {useState, useEffect, useReducer} from 'react';
|
||||||
import './App.scss';
|
|
||||||
import config from './config';
|
|
||||||
|
|
||||||
import { Switch, Route, BrowserRouter as Router } from 'react-router-dom';
|
|
||||||
|
|
||||||
import socketIOClient from 'socket.io-client';
|
import socketIOClient from 'socket.io-client';
|
||||||
|
import config from './config';
|
||||||
|
import { Switch, Route, BrowserRouter as Router } from 'react-router-dom';
|
||||||
import MainWrapper from './components/MainWrapper/MainWrapper';
|
import MainWrapper from './components/MainWrapper/MainWrapper';
|
||||||
|
|
||||||
import { stateReducer } from './reducers/stateReducer';
|
import { stateReducer } from './reducers/stateReducer';
|
||||||
import { initState } from './reducers/init/stateReducer.init';
|
import { initState } from './reducers/init/stateReducer.init';
|
||||||
|
import indexServices from './services/api/indexServices';
|
||||||
|
import './App.scss';
|
||||||
|
|
||||||
export const socket = socketIOClient(config.apiAddress);
|
export const socket = socketIOClient(config.socketAddress);
|
||||||
|
|
||||||
|
|
||||||
function App() {
|
function App() {
|
||||||
|
@ -25,18 +22,17 @@ function App() {
|
||||||
initState
|
initState
|
||||||
);
|
);
|
||||||
|
|
||||||
const fetchIndexAPI = () => {
|
const fetchIndexAPI = async () => {
|
||||||
fetch(config.apiAddress)
|
const response = await indexServices.indexService();
|
||||||
.then(res => res.text())
|
if (response.body) {
|
||||||
.catch(err => setError([...error, err]))
|
console.log(response.body)
|
||||||
.then(data => {
|
|
||||||
const action = {
|
const action = {
|
||||||
type: 'INDEX',
|
type: 'INDEX',
|
||||||
message: 'INDEX_DATA',
|
message: 'SET_USER',
|
||||||
body: data
|
body: response.body
|
||||||
}
|
}
|
||||||
dispatch(action)
|
dispatch(action)
|
||||||
})
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
const socketConnect = () => {
|
const socketConnect = () => {
|
||||||
|
|
|
@ -7,7 +7,9 @@ const production = {
|
||||||
}
|
}
|
||||||
|
|
||||||
const development = {
|
const development = {
|
||||||
apiAddress: 'http://localhost:8000',
|
authAddress: 'http://localhost:8000/auth',
|
||||||
|
apiAddress: 'http://localhost:8000/api/v1',
|
||||||
|
socketAddress: 'http://localhost:8000',
|
||||||
endpoint: 'http://localhost:3000'
|
endpoint: 'http://localhost:3000'
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -4,7 +4,7 @@ import type { state, action } from '../stateReducer';
|
||||||
export const indexReducer = (state: state, action: action):state => {
|
export const indexReducer = (state: state, action: action):state => {
|
||||||
switch(action.message) {
|
switch(action.message) {
|
||||||
|
|
||||||
case 'INDEX_DATA':
|
case 'SET_USER':
|
||||||
const parsedData = indexDataParse(action.body);
|
const parsedData = indexDataParse(action.body);
|
||||||
return state;
|
return state;
|
||||||
|
|
||||||
|
|
|
@ -0,0 +1,24 @@
|
||||||
|
import config from '../../config';
|
||||||
|
|
||||||
|
const apiAddress = config.apiAddress;
|
||||||
|
|
||||||
|
var headers = new Headers();
|
||||||
|
headers.append('Content-Type', 'application/json');
|
||||||
|
headers.append('Accept', 'application/json');
|
||||||
|
headers.append('Sec-Fetch-Site', 'cross-site')
|
||||||
|
|
||||||
|
const indexService = async () => {
|
||||||
|
const response = await fetch(apiAddress,
|
||||||
|
{method: 'GET', credentials: 'include', headers: headers}
|
||||||
|
)
|
||||||
|
.then(res => {
|
||||||
|
return res;
|
||||||
|
}).catch(err => {
|
||||||
|
return err;
|
||||||
|
});
|
||||||
|
return response;
|
||||||
|
}
|
||||||
|
|
||||||
|
export default {
|
||||||
|
indexService
|
||||||
|
}
|
|
@ -1,16 +1,28 @@
|
||||||
import config from '../config';
|
import config from '../config';
|
||||||
import Axios from 'axios';
|
import Axios from 'axios';
|
||||||
|
|
||||||
const authEndpoint = `${config.apiAddress}/auth`;
|
const authEndpoint = config.authAddress;
|
||||||
const signupEndpoint = `${authEndpoint}/signup`
|
const signupEndpoint = `${authEndpoint}/signup`
|
||||||
const loginEndpoint = `${authEndpoint}/login`
|
const loginEndpoint = `${authEndpoint}/login`
|
||||||
|
|
||||||
|
var headers = new Headers();
|
||||||
|
headers.append('Content-Type', 'application/json');
|
||||||
|
headers.append('Accept', 'application/json');
|
||||||
|
headers.append('Sec-Fetch-Site', 'cross-site')
|
||||||
|
|
||||||
const loginService = () => {
|
const loginService = () => {
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
const signupService = async (formData) => {
|
const signupService = async (formData) => {
|
||||||
const response = await Axios.post(signupEndpoint, {...formData })
|
// const response = await Axios.post(signupEndpoint, {...formData }, {credentials: 'include', headers: headers})
|
||||||
|
console.log(formData)
|
||||||
|
const response = await fetch(signupEndpoint, {
|
||||||
|
method: 'POST',
|
||||||
|
credentials: 'include',
|
||||||
|
body: JSON.stringify(formData),
|
||||||
|
headers: headers
|
||||||
|
})
|
||||||
.then(res => {
|
.then(res => {
|
||||||
return res;
|
return res;
|
||||||
}).catch(err => {
|
}).catch(err => {
|
||||||
|
|
Loading…
Reference in a new issue