2017-08-14 65 views
0

所以我有一个网页API设置为生成一个令牌为您返回时发送一个用户名和密码是相同的,这是通过邮递员如果你的作品给身体像这样React Js Axios发布请求不从网页api返回机构

enter image description here

这个作品它给你一个令牌和正确的信息,但是当我从浏览器,Firefox做,或即它给了我一个错误我的代码是这样的,

var d = { 
     username: Uname, 
     surname: Pword, 
     grant_type: "password", 
     client_id: "099153c2625149bc8ecb3e85e03f0022", 
    }; 
    console.log(d); 

    var self = this; 
    return (
     axios.post('http://localhost/hydraauth/oauth/token', { 
      headers: { 
       'Content-Type': 'application/json', 
      }, 
      data: d 
     }).then(function (response) { 
      console.log(response.data) 
      self.setState({ 
       isLoggedIn: true, 
       Uname: Uname, 
      }, function() { 
       sessionStorage.setItem("Login", true); 
       sessionStorage.setItem("Uname", Uname) 
       window.location.href = "/"; 
      }); 
     }).catch(function (error) { 
      if (error.response){ 
      console.log(error.response) 
      console.log(error.response.data); 
      console.log(error.response.status); 
      console.log(error.response.headers); 
      } else { 
      window.alert("Incorrect Username Or Password Or Unauthorized To Access This.") 
      } 
     }) 
    ); 

它给了我这个错误在chro我

enter image description here

这里是错误扩大了网络选项卡的

enter image description here

图像中铬的响应选项卡为空

enter image description here

+1

我想问题是由于[CORS](https://developer.mozilla.org/en-US/docs/Web/HTTP/Access_control_CORS) –

+0

@BardiaRastin它怎么可能是Cors当它从邮递员 –

+0

工作,因为CORS只存在于浏览器... –

回答

1

爱可信与问题通过主体发送数据,因此您需要使用npm plugin query string

,并用它像这样

axios.post("http://localhost/hydraauth/oauth/token", querystring.stringify({ "username": Uname, "password": Pword, "grant_type": "password", "client_id": "eyJjbGllbnRfaWQiOiJTYXZ2eS1Dcm0tUmVhY3QtSnMtU3lzdGVtIn0" }))