GET http://localhost:8080/api/getArticle 504 (Gateway Timeout) 或者404错误

2 篇文章 0 订阅

vue+express+mysql搭建博客时,使用axios进行前后台数据交互时,出现GET http://localhost:8080/api/getArticle 504 (Gateway Timeout) 或者GET http://localhost:8080/api/getArticle 404 (Not Found),找了很久才解决,所以写个博客记录一下用到的方法或者相关方法
1.跨域:这个是一开始遇到的,解决有很多教程
(1)在项目中的config => index.js中的ProxyTable设置

//   config/index.js中

proxyTable: {
      '/api': {
        target: 'http://localhost:3000',   
        changeOrigin: true,  //允许跨域
        pathRewrite: {
          '^/api': ''
        }
      }
// server/index.js中

const express = require('express');
const app = express();

app.get('/api/getArticle', (req, res, next) => {
  res.json({
    data: '后台返回结果 getArticle'
  })
})

// 监听端口
app.listen(3000);    //后台运行在3000端口
console.log('success listen at port:3000......');
//  component/note.vue中

methods: {
      getArticle (){
        this.axios.get('/api/getArticle')
          .then( (res) => {
            console.log('res', res);
            this.message = res.data.data;
          })
      }
    }

按照如上设置,就可以解决跨域问题

2.如何跨域实现后,还是出现一开始的问题,那么有可能是你的后台端口没有打开,在cmd中,进入server目录,运行server/index.js文件


    cd blog  //进入项目文件
    cd server   //使用node文件
    cd index.js   //使用node搭建的服务器
    node index.js    //运行文件,打开后台端口
   
端口打开后,再重新刷新页面就可以了。
  • 2
    点赞
  • 6
    收藏
    觉得还不错? 一键收藏
  • 2
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值