Ошибка сети при публикации запроса с помощью axios - PullRequest
Новая
       88

Ошибка сети при публикации запроса с помощью axios

1 голос
/ 10 ноября 2019

При попытке отправить http-запрос с помощью axios я получаю следующую ошибку: 

Network Error
- node_modules/axios/lib/core/createError.js:16:24 in createError
- node_modules/axios/lib/adapters/xhr.js:81:25 in handleError
- ... 9 more stack frames from framework internals

Я попытался заменить "proxy" = "http://localhost:8080" на" http://myip:8080", в пакете. JSON, но ошибка сохраняется. Я также попытался с помощью команды fetch f реагировать на родную, но она также выдает ту же ошибку

package.json: 

{
  "main": "node_modules/expo/AppEntry.js",
  "scripts": {
    "start": "expo start",
    "android": "expo start --android",
    "ios": "expo start --ios",
    "web": "expo start --web",
    "eject": "expo eject"
  },
  "dependencies": {
    "axios": "^0.19.0",
    "body-parser": "^1.19.0",
    "cors": "^2.8.5",
    "expo": "^35.0.0",
    "express": "^4.17.1",
    "mongoose": "^5.7.9",
    "morgan": "^1.9.1",
    "nodemon": "^1.19.4",
    "react": "16.8.3",
    "react-dom": "16.8.3",
    "react-native": "https://github.com/expo/react-native/archive/sdk-35.0.0.tar.gz",
    "react-native-router-flux": "^4.0.6",
    "react-native-web": "^0.11.7",
    "react-router-dom": "^5.1.2",
    "spectre.css": "^0.5.8"
  },
  "devDependencies": {
    "babel-preset-expo": "^7.1.0",
    "concurrently": "^5.0.0"
  },
  "private": true,
  "proxy": "http://localhost:8080"
}

server.js: 


const express = require('express')
const bodyParser = require('body-parser')
const morgan = require('morgan')
const app = express()
const PORT = 8080

// MIDDLEWARE
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();
});
//routing
app.post('/', (req, res, next)=> {
    console.log('server post username: ');
    console.log(req.body.username)
    res.end()
})

// Starting Server 
app.listen(PORT, () => {
    console.log(`App listening on PORT: ${PORT}`)
})

фрагмент сообщения post axios: 

axios.post('/', {
            username: this.state.username,
            password: this.state.password
        })
            .then(response => {
                console.log(response)
                if (response.data) {
                    console.log('successful signup')
                    this.setState({
                        redirectTo: '/login'
                    })
                } else {
                        console.log('Sign-up error');

                    }
            }).catch(error => {
                console.log('Sign up server error: ')
                console.log(error);
            })

Результат выполнения вышеуказанного кода: 

Sign up server error: 

Network Error
- node_modules/axios/lib/core/createError.js:16:24 in createError
- node_modules/axios/lib/adapters/xhr.js:81:25 in handleError
- ... 9 more stack frames from framework internals

Ответы [ 2 ]

0 голосов
/ 14 ноября 2019

Проблема решена, я использовал неправильный IP (172.0.0.1), заданный hostname --ip-address. Использование inet ip, заданного ip addr show works.

0 голосов
/ 10 ноября 2019

во-первых, я предлагаю вам также использовать другие пространства имен маршрутов вместо app.post('/') try app.post( / api`), во-вторых, вы не отправляете данные клиенту или какой-либо код состояния. попробуйте следующее: 

app.post('/api/post', (req, res, next)=> {
    console.log('server post username: ');
    console.log(req.body.username)
    return res.status(200).send({redirectTo: '/login'});
 })

и axios 

 axios.post('/api/post', {
     username: this.state.username,
     password: this.state.password
 })
 .then(response => {
       console.log('successful signup')
       this.setState({
            redirectTo: '/login'
       })

 }).catch(error => {
       console.log('Sign up server error: ')
       console.log(error);
 })

Также я бы предложил вам использовать библиотеку cors для перекрестных запросов. скачайте его с npm (или пряжи или еще чего-нибудь)

и вместо 

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();
});

используйте это 

const cors = require('cors');
app.use(cors())
...