laravel json 响应将原始数据返回到浏览器，即使我没有转储结果答案

【问题标题】：laravel json response returns raw data to the browser even though i have not dump the resultslaravel json 响应将原始数据返回到浏览器，即使我没有转储结果
【发布时间】：2019-10-23 08:38:28
【问题描述】：

我正在尝试使用 laravel 的 JSON 响应从数据库中检索数据，但我在浏览器中显示了原始数据。

我得到的响应被转储到浏览器中，没有其他显示。我想在我的 vue 模板中使用 axios 检索数据。

数据在浏览器中转储而不是作为 HTTP 响应返回

 { "id":1,"fee":"0.00","attendance":"0.00","library":"CLEARED","created_at":"2019-10-19 19:16:08","updated_at":"2019-10-19 19:16:08"}

来自我的控制器的示例代码

 public function index()
 {
    $clearancevalidator = ClearanceValidator::all()->first();

    return response()->json($clearancevalidator);
 }

这是我的路线

 Route::group(['prefix' => 'clearancevalidators'], function(){
        Route::get('/', 'Admin\ClearanceValidatorController@index')
            ->name('admin.clearancevalidators.index');
    });

【问题讨论】：

这不是错误或错误，它应该像这样工作

标签： laravel vue.js

【解决方案1】：

如果您只想在您的 Javascript 或 Postman 中使用 Axios 访问数据而在浏览器中看不到它们，您可以这样做（不是防弹的）

public function index()
{
    if (request()->wantsJson()) {
      $clearancevalidator = ClearanceValidator::all()->first();

      return response()->json($clearancevalidator);
    }
    return 'You shall not see this in the browser';
}

在你的 Vue 组件中，使用 axios 发出一个简单的 Ajax 获取请求

export default {
    mounted() {
        axios.get("/clearancevalidators").then(response => {
            console.log(response.data);
        });
    }
};

您可以在 XHR 部分下的网络选项卡中查看数据

浏览器仍然可以只添加一个application/json 标头来获取数据

希望对你有帮助

【讨论】：

你刚才说你不想在浏览器中看到数据:') 请你动心
更新了一个示例 Vue 组件
数据未显示在网络 XHR 中，我将浏览更改为 Firefox，它显示为 JSON 或原始数据。我要发布屏幕截图吗
“你不会在浏览器中看到这个”显示正常，但是网络中没有找到 json 数据 -> XHR -> 预览你的图片中的样子
不要通过浏览器访问 URL，使用 Ajax 来做，展示你的 Vue 组件和index.blade

【解决方案2】：

这就是数据在网络 XHR 中什么都不显示的方式，我尝试了 firefox 我得到了相同的响应

【讨论】：