Javascript 在 Heroku 上的全新 Rails 5.2.1 应用程序无法正常运行

Question

我认为在 Heroku 的生产环境中 Rails 5 个应用程序中的 JavaScript 个文件存在很大问题。虽然它在本地工作

我的配置：

Windows:   10 Education
Rails:     5.2.1
Ruby:      2.4.4p296
Heroku:    heroku/7.7.7 win32-x64 node-v10.7.0
postgres:  postgres (PostgreSQL) 10.3

现在我将向您展示我为确认它不起作用而执行的步骤，您可以自己尝试。最后，您将有一个 link 到 bitbucket 存储库和 Heroku 上的应用程序。

第一步：新建Rails5 App并切换到根文件夹

> rails new my_app --database=postgresql
> cd my_app

第 2 步：生成控制器

> rails generate controller static_pages

第 3 步：编辑 /app/controllers/static_pages_controller 文件

class StaticPagesController < ApplicationController
  def show
  end

  def destroy
  end
end

第 4 步：创建要与操作一起显示的视图

/app/views/static_pages/show.html.erb :

this is the show view

here is a link to the delete action:

<%= link_to t('logout'), logout_path, method: :delete %>

/app/views/static_pages/destroy.html.erb :

this is the destroy view which is called with a link_to method: :delete

第 5 步：编辑 /config/routes.rb 文件

Rails.application.routes.draw do
  root 'static_pages#show'
  get 'static_pages/show'
  delete '/logout', to: 'static_pages#destroy'
end

第 6 步：检查路由

> rails routes
                   Prefix Verb   URI Pattern                                                                              Controller#Action
                     root GET    /                                                                                        staticpages#show
         staticpages_show GET    /staticpages/show(.:format)                                                              staticpages#show
                   logout DELETE /logout(.:format)                                                                        staticpages#destroy
       rails_service_blob GET    /rails/active_storage/blobs/:signed_id/*filename(.:format)                               active_storage/blobs#show
rails_blob_representation GET    /rails/active_storage/representations/:signed_blob_id/:variation_key/*filename(.:format) active_storage/representations#show
       rails_disk_service GET    /rails/active_storage/disk/:encoded_key/*filename(.:format)                              active_storage/disk#show
update_rails_disk_service PUT    /rails/active_storage/disk/:encoded_token(.:format)                                      active_storage/disk#update
     rails_direct_uploads POST   /rails/active_storage/direct_uploads(.:format)                                           active_storage/direct_uploads#create

第 7 步：创建数据库并迁移

> rails db:create
Created database 'my_app_development'
Created database 'my_app_test'

> rails db:migrate

第八步：启动服务器

> rails server

第9步：前往localhost:3000/并点击出现的link。 link 工作并向服务器发送删除操作

Started GET "/" for 127.0.0.1 at 2018-09-03 18:43:52 +0200
Processing by StaticPagesController#show as HTML
  Rendering static_pages/show.html.erb within layouts/application
  Rendered static_pages/show.html.erb within layouts/application (12.2ms)
Completed 200 OK in 504ms (Views: 486.7ms | ActiveRecord: 0.0ms)


Started DELETE "/logout" for 127.0.0.1 at 2018-09-03 18:43:57 +0200
Processing by StaticPagesController#destroy as HTML
  Parameters: {"authenticity_token"=>"10NHmV8N4tF3O0r/YYtKtKmHm3xthGjPAE51osb7L9skCM5ZoM2RoiCtZD4Crh9d69ndTOeNRMmIW28ipI/z9A=="}
  Rendering static_pages/destroy.html.erb within layouts/application
  Rendered static_pages/destroy.html.erb within layouts/application (0.0ms)
Completed 200 OK in 90ms (Views: 73.0ms | ActiveRecord: 0.0ms)

第 10 步：创建一个 heroku 应用程序（您必须在您的系统上登录到 heroku）

> heroku create

第 11 步：将您的工作推送到 Heroku

> git add -A
> git commit -m "init"
> git push --set-upstream heroku master

第 12 步：打开您的 Heroku 应用程序并按照第 9 步中的操作操作但失败，因为 JavaScript 似乎无法正常工作

(...) Started GET "/" for 84.147.254.28 at 2018-09-03 16:47:44 +0000
(...) Processing by StaticPagesController#show as HTML
(...)   Rendering static_pages/show.html.erb within layouts/application
(...)   Rendered static_pages/show.html.erb within layouts/application (9.2ms)
(...) Completed 200 OK in 27ms (Views: 13.7ms)
.
.
. 
(...) Started GET "/logout" for 84.147.254.28 at 2018-09-03 16:48:05 +0000
(...) ActionController::RoutingError (No route matches [GET] "/logout"):

这是 Rails 或 Heroku 方面的一个明显错误，如您所见，我所做的只是创建一个新的 rails 应用程序并更改路由，生成一个控制器并制作 2控制器操作的视图。

如果您想查看应用程序的所有来源以及部署到 heroku 的应用程序，请在此处 links。

你可以在这里查看源代码：BitBucket Repo

这里的应用程序：Heroku app

有没有其他人在使用 Rails 和 Heroku 时遇到这种困难，或者我可以做些什么来让它工作？

编辑：通过删除不必要的日志信息和时间戳使第 12 步的输出更清晰

Answer 1

问题是 duktape gem。这是一个 Javascript 引擎，在 Rails 世界中没有广泛使用，但默认情况下包含在新的 Windows rails 安装中，因为它是唯一的引擎之一实际上在 Windows 工作。（如果你现在还没有弄清楚，那么 Rails windows 开发人员并不多 :)）。

我不认为 Heroku 对它有很好的支持，所以当它选择那个引擎时，JS 默默地编译失败。如果您在生产环境中查看 application.js 文件，您会看到一堆 NaN: "select[data-remote], input[data-remote], textarea[data-remote]", at the top, when you should see things like inputChangeSelector: "select[data-remote], input[data-remote], textarea[data-remote]"`.

如果你想让它正常工作，将 Duktape gem 从它的当前位置移到你的 Gemfile 的 development 部分，捆绑并重新部署（你可以避免现在主 Gemfile 中的 JS 编译器。

我也会用 Heroku 开票。通常，他们会警告您此类常见配置问题，但当我尝试部署您的应用程序时，我没有收到此类警告。我想很多用户都没有想到。

Answer 2

我解决了我的问题：导致问题的是 uglifier gem，因为它无法正常工作。我只是一个初学者，回想起来这个 gem 应该是我需要检查的第一件事，因为它会进行 JS 压缩。

现在 JS 运行良好。这是我在 GemFile 中为使其工作所做的更改：

来自

gem 'uglifier', '>= 1.3.0'

到

gem 'uglifier', '~> 3.0.4'

uglifier gem 版本 4.1.18 在生产环境中导致此 JS 错误。

希望这可以帮助其他人确定他们在 Heroku 上的 JS 错误

Javascript 在 Heroku 上的全新 Rails 5.2.1 应用程序无法正常运行

Javascript in a fresh Rails 5.2.1 app on Heroku doesn't work properly

ruby

ruby-on-rails

heroku

ruby-on-rails-5.2