为啥 datatables.net 在我的 Rails 开发环境中可以工作，但在部署到 Heroku 时却不行？

Posted 2023-05-07

【中文标题】为啥 datatables.net 在我的 Rails 开发环境中可以工作，但在部署到 Heroku 时却不行？

【英文标题】：Why does datatables.net work in my rails development env but not when deployed to heroku?为什么 datatables.net 在我的 Rails 开发环境中可以工作，但在部署到 Heroku 时却不行？

【发布时间】：2021-02-07 21:07:35

【问题描述】：

对于我的第一个 Rails 6 项目，我尝试将 datatables（jQuery 插件）与 bootstrap 5 结合使用，以便对每个 html 表格进行精美的表格排序。

在我的 Rails 开发环境中，它在本地运行良好，但在我将其推送到 Heroku 应用程序后，数据表组件似乎无法正常工作：我看到数据库中的所有行，但列标题不可单击以进行排序和搜索栏不见了。由于某种原因，它没有正确加载/激活数据表组件。

我已经搜索了 SO 和 Internet 以寻找线索，但我似乎无法找到解决方案。

我尝试过的事情没有结果：

切换production.rb 中的config.assets.compile 选项以强制Heroku 预编译资产 重新排列了application.js 中的需求列表 使用 application.js 类似 SO 问题/答案的内容 在开发者控制台 (F12) 输出中寻找线索（我看到 Uncaught TypeError 错误，但它们似乎无关，因为我也在开发中得到这些，并且数据表可以正常工作...）

我错过了什么？

【问题讨论】：

你能在本地运行rake assets:precompile 看看会发生什么吗？

@3DPrintScanner => 预编译输出添加到帖子中。

您是否将console.log(xx) 弹出到您的cars.js 文件中以检查它是否正在加载？您是否尝试过开发者控制台中的相同代码？

好主意。这样做了，它发现了一大堆关于 jQuery 的错误。我想我正在混合 jQuery 和数据表的不同安装。我将从头开始，然后逐步升级到 datatables.net。

【参考方案1】：

我最终通过回溯我的步骤解决了它；从头开始生成一个新的 rails 6 应用程序，并在本地和 Heroku 中仔细测试 bootstrap 和 Datatables.net 的每一步。

如果有人有类似的问题，这就是我所做的：

按照 Chris Oliver 关于如何在 Rails 和 Webpacker 上安装引导程序的出色 Go Rails tutorial 生成一个新的 rails 6 应用程序

然后运行yarn add datatables.net-bs4安装datatables.net

将require("datatables.net-bs4") 行添加到app/javascript/packs/application.js，它看起来像这样：

require("@rails/ujs").start()require("turbolinks").start()require("@rails/activestorage").start()require("channels")require("datatables.net-bs4")

并在文件末尾添加此（示例）代码以初始化表 ID 上的数据表（在我的情况下为 #mytable）：

$(document).ready( function () 
  $('#mytable').DataTable(
    "lengthMenu": [ [-1, 10, 50, 100], ["All", 10, 50, 100] ]
);

);

在您的视图文件（例如index.html.erb）中，为您的表添加一个 ID 属性（有关详细信息，请参阅 Datatables.net manual）：

table class="table" id="mytable"

现在该表在 Heroku 中正常工作。也不再有关于 jQuery 的控制台错误。

【参考方案2】：

Heroku 在 Postgresql 数据库上运行。它不能与其他数据库一起正常工作。您能否将您的数据库更改为 postgresql 并尝试再次抛出 heroku？

【讨论】：

我的本地环境和 Heroku 环境都在 Postgresql 数据库上运行，所以我认为这不会导致 Datatables.net 出现故障。我在表格中看到了数据，但（数据）表格功能不起作用。