Question

当尝试使用axios发布http请求时，出现以下错误：

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

我尝试在package.json中将“ proxy” =“ http：// localhost：8080”替换为“ http://myip:8080”，但错误仍然存在。我也尝试使用fetch命令执行本机反应，但是它也给出了相同的错误

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}`)
})

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

Answer 1

首先，我建议您也使用其他路由名称空间，而不要使用app.post('/')试试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（或yarn或其他任何东西）下载它

，而不是

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

Answer 2

问题已解决，我使用的是hostname --ip-address给出的IP（172.0.0.1）错误。使用ip addr show给出的inet ip即可。

Answer 3

这对我有用：

sudo ufw allow *your server api port here*

使用axios发布请求时出现网络错误

3 个答案: