Реагировать // Axios // Экспресс-контроль доступа-Разрешить-Происхождение

#reactjs #api #express #ssl #axios

#reactjs #API #экспресс #ssl #axios

Вопрос:

Я пытаюсь выполнить вызовы api для серверной части, но сталкиваюсь с большими трудностями.

Я проводил исследование и заметил тенденцию использования cors в серверной части express для установки заголовка и избежания этой проблемы, однако я не вижу результатов ни в одном из документов, которые я просмотрел. У меня есть файл axios для создания экземпляра ниже:

 export const axios = Axios.create({baseURL: "http://localhost:5000",
headers: {'Access-Control-Allow-Origin': true },
timeout: 3000
}); 
  

(Я пробовал использовать * вместо true, и это тоже не сработало)
Мой server.js в файле есть приложение, использующее cors() перед всеми маршрутами.

Я тестировал с cors и без него, как с экземпляром, так и с вводом заголовка непосредственно в POST-запрос, но по-прежнему безуспешно.

Отправить запрос:

 const user = {
            email: this.state.email,
            password: this.state.password
        }

        //First is url
       axios.post('/input', {user})
        .then(res => {
            console.log(res)
            console.log(res.data)
        }).catch(res => {
            console.log(res);
        })
  

Я в недоумении. Любая помощь была бы очень признательна.
Будет ли моим следующим шагом настройка промежуточного программного обеспечения?

Спасибо.

Файл сервера:

 const express = require('express');
const db = require('./conf.d/database');
const cors = require('cors')
const bodyParser = require('body-parser')

//Test DB
db.authenticate()
  .then(() => console.log('Database Working'))
  .catch(err => console.log('Error: '   err))

const app = express();

//Cors allows helps with the blocking of SSL by browsers
// app.use(function(req, res, next) {
//   res.header("Access-Control-Allow-Origin", "*");
//   res.setHeader('Access-Control-Allow-Methods', 'GET, POST, OPTIONS, PUT, PATCH, DELETE');
//   res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
//   next();
// });
app.use(cors());

//Body parser
//app.use(bodyParser.urlencoded({extended: false}));

//Account routes
app.use('/user', require('./routes/users_route' ));
//app.use('/api', require('./routes/api_routes'));


const api_port = process.env.PORT || 5000;

app.listen(api_port, console.log(`Server started on port ${api_port}`));
  

Пользовательские маршруты:

 const express = require('express');
const router = express.Router();
const db = require('../conf.d/database');
const User = require('../models/user');

router.get('/', (req, res) => 

    User.findAll()
    .then(user => {
        console.log(user);
        res.sendStatus(200);
    })
    .catch(err => console.log(err))
    );

router.get('/add', (req,res)=> {

    console.log(req.body);

    var Search_History = {"one" : [15, 4.5],
    "two" : [34, 3.3],
    "three" : [67, 5.0],
    "four" : [32, 4.1]};
    
    User.create({
        Search_History 
    })
    .then(user => res.redirect('/user'))
    .catch(err => console.log(err))
})
module.exports = router;
  

ОБНОВЛЕНИЕ: я получаю ошибку 404 при выполнении post-вызова

Комментарии:

1. также поделитесь своим кодом сервера. используете ли вы app.use(cors()) вот так

2. @sharunkk я только что загрузил свой сервер и файл маршрутов

3. у вас есть код для uri ‘input’? . я не вижу никакого кода, связанного с этим. попробуйте связаться с ПОЧТАЛЬОНОМ, и вы получите от него четкий ответ.