React - Nodejs / 使用 axios 快速获取请求 - 无法从客户端访问我的后端路由 - 错误是什么?



我正在尝试从我的后端路由发出 api 请求(使用 nodes/express)。从客户端站点,我正在发出一个 axios 请求并使用 react。我测试了我的快速后端路由,它工作正常,所以问题必须出在我的客户端代码上。我已经看了一段时间了,不知道我做错了什么 - 任何帮助都会很棒!谢谢!

我的后端节点快速路由:

 router.get('/testing', function(req,res){
        sampleAPI.get('example/?origin=' + req.query.city + '&name=' + req.query.name + '&xxx=yes&yyy=no&xyx=maybe', function(err, data){
                  if (err){
                     res.status(200).send(err);
                  }
                  else{
                     res.status(200).send(data);
                  }
         })
 })

接口请求:

     export function search (city, name) {
            return axios.get('api/testing', {
                params: {
                    city: city,
                    name:name
                }
     })

反应组件:

        import React from 'react';
        import {search} from '../api.js';
        class Searching extends React.Component {
            constructor(props){
                super(props);
                this.state={
                    city:'',
                    name:''
                }
                this.handleInput=this.handleInput.bind(this);
                this.testing=this.testing.bind(this);
            }
            testing(e){
                this.setState({
                    [e.target.name]:e.target.value
                })
            }
            handleInput(e){
                e.preventDefault();
                search(this.state.city, this.state.name)
            }
            render () {
                return (
                    <div>
                      <form onSubmit={this.handleInput}>
                         <input type="text" name="city"  value={this.state.city} onChange={this.testing} />
                         <input type="text"  name="name" value={this.state.name} onChange={this.testing}/>
                         <input type="submit" value="Submit" />
                       </form>
                    </div>
                 )
            }
        }
        export default Searching;

在您的 axios 请求中,您的目标是 'api/testing' 的端点。 您面向的快速路由器路由是 '/testing' ,因此在该路由器文件中的某个位置,您将该'/testing'端点嵌套在"/api"路由中,例如 router.use('/api', require('./api'));

这个公理请求是否有效:

export function search (city, name) {
   return axios.get(`/api/testing/${city}/${name}`);
}

使用此端点:

router.get('/testing/:city/:name', function(req,res){
    sampleAPI.get('example/?origin=' + req.params.city + '&name=' + req.params.name + '&xxx=yes&yyy=no&xyx=maybe', function(err, data){
        if (err){
           res.status(200).send(err);
        }
        else {
           res.status(200).send(data);
        }
     })
}

最新更新