我正在尝试使用使用导入映射的 Rails 7 应用程序设置 ActionCable。开发中一切正常,但在生产中我找不到我的频道 javascript:
Failed to load resource: the server responded with a status of 404 ()
对于我所有的 notifications_channel.js
和所有其他频道。
我有什么遗漏的吗?我没主意了。
我的设置如下:
ruby "3.0.0"
gem "rails", "~> 7.0.4", ">= 7.0.4.3"
javascript/application.js
console.log("application.js")
import "@hotwired/turbo-rails"
import "controllers"
import "channels"
// Start StimulusJS
import { Application } from "@hotwired/stimulus"
const application = Application.start();
javascript/channels/index.js
import "./notification_channel"
javascript/channels/notification_channel.js
consumer.subscriptions.create("NotificationChannel", {
connected() {
console.log("connected NotificationChannel")
// Called when the subscription is ready for use on the server
},
disconnected() {
console.log("disconnected NotificationChannel")
// Called when the subscription has been terminated by the server
},
received(data) {
console.log(data)
let element = document.getElementById("flashes")
element.insertAdjacentHTML('beforeend', data.html);
}
});
频道/notification_channel.rb
class NotificationChannel < ApplicationCable::Channel
def subscribed
stream_from "notification_channel"
end
def unsubscribed
# Any cleanup needed when channel is unsubscribed
end
end
生产.rb
config.action_cable.allowed_request_origins = [ "https://myapp.hatchboxapp.com", /http:\/\/localhost*/]
config.hosts << "myapp.hatchboxapp.com"
config.hosts << "localhost"
这是我的 importmap.rb
# Pin npm packages by running ./bin/importmap pin tailwindcss-stimulus-components
pin "application", preload: true
pin "@hotwired/turbo-rails", to: "turbo.min.js", preload: true
pin "@hotwired/stimulus", to: "https://ga.jspm.io/npm:@hotwired/[email protected]/dist/stimulus.js"
pin "@hotwired/stimulus-loading", to: "stimulus-loading.js", preload: true
pin_all_from "app/javascript/controllers", under: "controllers"
pin "@rails/request.js", to: "https://ga.jspm.io/npm:@rails/[email protected]/src/index.js"
pin "tailwindcss-stimulus-components", to: "https://ga.jspm.io/npm:[email protected]/dist/tailwindcss-stimulus-components.module.js"
pin "@rails/actioncable", to: "actioncable.esm.js"
pin_all_from "app/javascript/channels", under: "channels"
电缆.yml
development:
adapter: redis
url: redis://localhost:6379/1
test:
adapter: test
production:
adapter: redis
url: <%= ENV.fetch("REDIS_URL") { "redis://localhost:6379/1" } %>
channel_prefix: linus_production
并且
ENV.fetch("REDIS_URL")
返回有效的网址:
redis://default:[email protected]:6379/1
不要使用相对导入,它仅在开发中有效,因为资产请求会经过
sprockets
。
// import "./notification_channel"
import "channels/notification_channel"
请注意,您不是直接在此处导入本地文件,导入必须与导入映射中的某些内容匹配:
$ bin/importmap json
{
"imports": {
"application": "/assets/application-9ee50de6a17243a5097c1f973bcaae67bdac6cb2b67c3ad5e79c70be188dbb9c.js",
"@hotwired/turbo-rails": "/assets/turbo.min-49f8a244b039107fa6d058adce740847d31bdf3832c043b860ebcda099c0688c.js",
"@hotwired/stimulus": "/assets/stimulus-a1299f07b3a1d1083084767c6e16a178a910487c81874b80623f7f2e48f99a86.js",
"@hotwired/stimulus-loading": "/assets/stimulus-loading-6024ee603e0509bba59098881b54a52936debca30ff797835b5ec6a4ef77ba37.js",
"controllers/application": "/assets/controllers/application-44e5edd38372876617b8ba873a82d48737d4c089e5180f706bdea0bb7b6370be.js",
"controllers/hello_controller": "/assets/controllers/hello_controller-29468750494634340c5c12678fe2cdc3bee371e74ac4e9de625cdb7a89faf11b.js",
"controllers": "/assets/controllers/index-e70bed6fafbd4e4aae72f8c6fce4381d19507272ff2ff0febb3f775447accb4b.js",
"channels/notification_channel": "/assets/channels/notification_channel-510986bf3ec580274dd79451bb45720fe7d029b87052fe489db68b2a6788d294.js",
"channels/consumer": "/assets/channels/consumer-da959cc6b798c852c626e9654ac3901f7f0da2b714bf8e61689e24ed43faafad.js",
"channels": "/assets/channels/index-fd886e165dedb6cb07b976754f38ccc2620717ec75e0e84831bde391dac10e32.js"
}
}