无法通过ReactJS访问CakePHP API端点。仅通过浏览器

时间:2019-03-24 04:53:19

标签: reactjs api cakephp axios cakephp-routing

我正在尝试通过CakePHP为我的服务器构建REST API。我以为可以正常工作,因为我可以通过Web浏览器接收JSON响应,但是当尝试通过ReactJS访问相同的路由时,Controllers Action实际上并未触发。

阅读CakePHP文档,我真的只需要实现以下代码行即可使API正常工作(根据文档),我做到了:

/config/routes.php

Router::scope('/', function($routes) { $routes->setExtensions(['json']); $routes->resources('Users'); });

这是我要访问的API端点:

`public function signUp() {
     $file = fopen("error_log.txt", "w");
     $txt = "firing endpoint";
     $fwrite($file, $txt);
     $fclose($file);
     $response = $this->response;
     $responseText = [
         "status" => "200",
         "message" => "User added successfully"
     ];
     $response = $response->withType("application/json")
         ->withStringBody(json_encode($responseText));
     return $response;
}`

在这里,我已通过浏览器成功命中该端点。我的日志消息也出现在error_log.txt文件中

enter image description here

这是我通过ReactJS发出请求的地方:

handleRequest = () => { console.log('making request'); axios({ method: 'get', url: 'https://157.230.176.243/users/register.json', data: { email: this.state.email, password: this.state.password } })
.then(function(response) { console.log('got response'); console.log(response); })
.catch(function(error) { console.log('got error'); console.log(error); })
.then(function(data) { console.log('always executed'); console.log(data); }); }

当我通过ReactJS发出此请求时,我得到一个XHR failed loading: OPTIONS "https://157.230.176.243/users/register.json"

此外,通过ReactJS发出此请求时,我的日志消息未写入error_log.txt

1 个答案:

答案 0 :(得分:1)

好吧,我终于弄清楚出了什么问题。我的React Development服务器在

上运行

157.230.176.243:3001

和我的CakePHP API都在同一台服务器上

157.230.176.243

React不喜欢我将API的完整URL传递给fetch()

打电话。我将我的React代码切换为

url: "/users/register.json" 而且效果很好。