Rails - 将视图的 javascript 代码移动到 javascript 文件

Question

首先让我告诉你，我已经搜索过这个但没有找到解决我问题的答案。

我的 layouts/application.html.haml 文件中有很多 Javascript：

### at the end of application.html.haml file

- if @instance_variable.condition

    :javascript
        // a lot js/jQuery code

    :javascript
        // more js code that uses #{ @instance.vars }

    - if @another_condition.using.ruby.cody

        :javascript
            // more js code that uses #{ @instance.vars }

而且我在这段代码中使用了实例变量，这意味着这个变量只会在控制器（应用程序控制器）上声明。由于这是应用程序布局，这些脚本运行在我网站的每个页面上（当然这就是我需要的）。

我想要的是将所有这些代码移动到一个 js.erb 文件（或 .haml，如果可能的话）。首先-因为在单独的文件中更容易管理此代码；其次 - 因为我不想在每个 html 文件的末尾都有 <script> // a lot of js code </script> 标签，所以我只想有一个 <script async src='link'/> 标签。

此外，我已经在文件的开头包含了 application.coffee，但我需要在 html 文件的末尾包含此脚本标记。

Answer 1

我不建议为此使用部分。因为，您的代码使用变量，这意味着它会根据您的变量而变化。如果将它们放入单独的 javascript 文件中，浏览器将不知道这些更改并使用缓存文件。一种解决方法是在文件名末尾添加一些字符串（当 var 更改时该字符串会更改），但是这样一来，您将失去将 javascript 移动到单独文件中的所有好处。

更好的方法是在 application.html.haml 中定义变量，将 javascript 代码移出到单独的文件中，然后只使用定义的变量。

application.html.haml

- if @instance_variable.condition
    %script(src="path/to/my/script.js")

    :javascript
        = var some_var = #{@instance.vars}

    %script(src="path/to/my/second_script_that_uses_var.js")

Answer 2

感谢 Uzbekjon 的回答，但经过一番研究后，我找到了一种完全符合我要求的方法:)

在我的 'layouts/application.html.haml' 文件中，我添加了一个脚本标签：

### at the end of application.html.haml file

%script{async: 'async', src: application_scripts_path}

然后我将这条路径添加到路由中：

get 'application_scripts' => 'controller#application_scripts', as: :application_scripts

然后我只需要在我的控制器上设置此操作 application_scripts 并创建一个新视图 (app/views/controller/application_scrips.js.erb):

class Controller < ActionController::Base

    # 1
    protect_from_forgery except: :application_scripts

    def application_scripts

        # 2
        if condition.that.tells.me.this.request.is.valid

            # 3
            render formats: [:js] and return

        end
        render plain: ''
    end

这些步骤当然是更难找出的：

1 - 我必须禁用此保护，否则我会收到此错误：

ActionController::InvalidCrossOriginRequest at /application_scripts

Security warning: an embedded tag on another site requested protected JavaScript. If you know what you're doing, go ahead and disable forgery protection on this action to permit cross-origin JavaScript embedding.
2 - 为确保没有其他网站可以请求此脚本文件（这对我来说不是问题，但我更喜欢这种方式）我添加了一个条件以确保请求来自我的网站。在这种情况下，我只是检查用户是否已登录。
3 - formats: [:js] 告诉 Rails 该视图不是 .html，而是一个 .js 文件 'application_scripts.js.erb'

最后，我不得不将所有代码从 application.html.haml 文件移动到视图文件 'application_scripts.js.erb'，并将 haml 代码也转换为 erb。

<% @instance_variable.condition %>

    // a lot js/jQuery code

    // more js code that uses <%= @instance.vars %>

    <% @another_condition.using.ruby.cody %>

        // more js code that uses <%= @instance.vars %>

    <% end %>
<% end %>

Rails - 将视图的 javascript 代码移动到 javascript 文件

Rails - Move view's javascript code to javascript files

javascript

jquery

ruby-on-rails

erb

asset-pipeline

application.html.haml