使用 PhpStorm 调试在 JavaScript 中调用的 Laravel 函数
Debugging a Laravel function called in JavaScript with PhpStorm
我需要一些指导,了解如何调试在 HTML 页面中调用的 JavaScript 函数中映射的以下 Laravel 函数。
$('#upload-avatar').fileapi({
url: '{{ route("user.avatar") }}',
accept: 'image/*',
data: { _token: "{{ csrf_token() }}" },
imageSize: { minWidth: 100, minHeight: 100 },
elements: {
active: { show: '.js-upload', hide: '.js-browse' },
preview: {
el: '.js-preview',
width: 96,
height: 96
},
progress: '.js-progress'
},
如您所见,当我尝试上传图片时,user.avatar Laravel 函数被调用,我的问题是如果我点击上传按钮PhpStorm 未激活。
我 Start listening for php debug connections
开启
是否需要一些额外的配置来调试嵌入在 html 页面中的 JavaScript 代码?
我建议您使用 Chrome,打开 Web 开发人员工具并导航到那里的“网络”选项卡
然后当您尝试上传文件时,您会在该网络选项卡中看到一个新请求
如果您在 app/config/app.php 配置文件中设置了 'debug' : true,您将看到来自 Laravel
的详细错误
举个例子:
我需要一些指导,了解如何调试在 HTML 页面中调用的 JavaScript 函数中映射的以下 Laravel 函数。
$('#upload-avatar').fileapi({
url: '{{ route("user.avatar") }}',
accept: 'image/*',
data: { _token: "{{ csrf_token() }}" },
imageSize: { minWidth: 100, minHeight: 100 },
elements: {
active: { show: '.js-upload', hide: '.js-browse' },
preview: {
el: '.js-preview',
width: 96,
height: 96
},
progress: '.js-progress'
},
如您所见,当我尝试上传图片时,user.avatar Laravel 函数被调用,我的问题是如果我点击上传按钮PhpStorm 未激活。
我 Start listening for php debug connections
开启
是否需要一些额外的配置来调试嵌入在 html 页面中的 JavaScript 代码?
我建议您使用 Chrome,打开 Web 开发人员工具并导航到那里的“网络”选项卡 然后当您尝试上传文件时,您会在该网络选项卡中看到一个新请求 如果您在 app/config/app.php 配置文件中设置了 'debug' : true,您将看到来自 Laravel
的详细错误举个例子: