【问题标题】：Generating Javascript Code with Rails使用 Rails 生成 Javascript 代码
【发布时间】：2016-02-02 10:12:14
【问题描述】：

我目前正在开发一个网络应用程序，它可以生成可以附加到另一个页面的 JS 代码。就像从下面的表单生成器生成的电子邮件订阅表单：

<script type="text/javascript" src="https://app.getresponse.com/view_webform_v2.js?u=BB1K&webforms_id=1523701"></script>

我希望 JS 代码呈现图像或文本，而不是生成订阅表单，并且我想将输入到文件存储（例如 AWS）中的图像或文本放在我的应用程序中。

我在 Rails 4.2.5 上运行。

上面的JS代码正在生成一个表单，表单必须保存在文件存储（CMIIW）的某个地方。我想做一个可以生成这种JS代码的应用。

附：我是 Rails 的新手，任何人都可以解释这个过程，或者是否有任何宝石可以帮助完成这项任务。谢谢。

【问题讨论】：

“我希望 JS 代码渲染图像或文本并保存到 AWS”是什么意思？
我更新了问题，抱歉我的英语不好。如果您仍然感到困惑，请告诉我。
你知道“gon” gem 吗？ github.com/gazay/gon。它可能会帮助你。通过使用它，我们可以像文本视图一样显示生成的 js 代码。你需要这样的东西吗？我说的对吗
兰齐特，这无济于事
那么我认为您想要一个 JS 脚本来帮助某人创建“表单”并保存表单以供以后使用是否正确？就像如果用户想要一个“红色”表单，他们可以把脚本和它显示在他们的网站上？

标签： javascript ruby-on-rails ruby

【解决方案1】：

所以你想要的是widget。

公开

这样做的基础是您需要一个公共 JS 文件来从您的应用中“提取”数据并在其他人的网站上显示相应的 HTML。

此文件将包含在其他人的网站上；它将使用来自您服务器的数据（通过API）填充站点上的 HTML 元素。它可能会使用iframe，但通常只会使用来自您自己服务器的资源来装饰 HTML 元素。

您可以在您的网站上放置的所有小部件/徽章/按钮都只是来自其他人的嵌入 JS。这些 JS 文件需要处理您应用中的 public 数据（IE，您不能使用任何服务器端技术）...

# public/your_widget.js
// put new element on page
// populate with form data

唯一您可以将 JS 文件公开的方法是将其放在您的 public 文件夹中，或者至少是您的应用程序（子域）的可公开访问的部分。

您不能为此使用asset pipeline。

当然，您可以使用版本控制机制等，但事实是您需要一个公共“链接”，其他网站可以包括：

<script src="http://api.yoursite.com/public.js"></script>

HTML

为了在您的网站上填充小部件，您可以查看现有的各种 JS 适配。我没有这方面的丰富经验； bootstrap's JS implementation 是一个很好的起点，Google's analytics JS。

简而言之，您的 JS 需要生成 HTML 并在您的网站上输出。

为此的标准模式是在您的网站上包含脚本，在您的页面上放置一个 HTML“元素”（带有适当的id），JS 将使用 HTML 填充到该“元素”（预先使用来自您的数据服务器）：

// site
<script "http://api.yoursite.com/public.js"></script>
<body>
   <div id="your_widget" data-name="tester" data-attribute="value"></div>
</body>

// JS

数据

要在您的网站上填充数据，您需要使用 API - 可公开访问：

#config/routes.rb
scope constraints: { subdomain: "api" } do
   resources :images, module: :api #-> api.url.com/images/x
end

这必须使用类似于您的应用的身份验证进行备份（我的 API 身份验证集成有点模糊）：

#app/models/user.rb
class User < ActiveRecord::Base
   has_secure_token #-> native to Rails 5; gem for Rails 4
end

#app/controllers/api/images_controller.rb
class Api::ImagesController
   before_filter :authenticate

   def show
       user  = User.find_by token: request.headers["Auth_Key"]
       image = user.images.find params[:id]
       render json: image.to_json if image
   end

   private

   def authenticate
      if request.headers.include? "Auth_Key"
         render :unprocessable_entity unless User.exists? token: request.headers["Auth_Key"]
      end
   end
end

Ref

上面的代码只是一个一般的例子。

它将允许您send...

var image_url = $.ajax({
   url:     "http://api.url.com/images/x",
   headers: "Auth-Key": "x"
});

CORS

最后，最后考虑的是CORS - Cross Origin Resource Sharing：

跨域资源共享 (CORS) 是一种机制，允许从资源来源域之外的另一个域请求网页上的受限资源（例如字体& javascript）

换句话说，你不能让任何人从你的服务器上拉取你的 JS 文件。除非您使用正确的 CORS 策略授予他们权限，否则 HTTP 不会允许它。

您需要做的是让任何人都可以访问您的public.js，以及您的API。因此，可能会建议将两者都放入子域中。如果需要，我可以为您提供更多信息。

有什么宝石可以帮助完成这项任务

我不知道。

这是一些高级功能。您必须了解 HTTP Web 服务的底层身份验证模式，并将其与 JS 实现相匹配以供第三方使用。

在最简单的形式中，您正在制作一个提取 API 数据的小型应用程序（“小部件”）。您只需要知道允许访问应用程序的哪些部分，就可以使功能正常工作。

【讨论】：

这很棒。我会试一试。非常感谢，Rich！

【解决方案2】：

为了生成 JS 文件并存储在 S3 中，您应该执行以下操作：

在 TMP 文件夹中创建文件
上传到 S3

创建文件：

最好的做法是创建一个Service，例如：

# app/services/js_generator.rb
class JsGenerator
  def initialize(some, params, here)
   @params = params
   # ...
  end

  def generate_code
    js = <<-END.squish
      var yourJavaScriptCode = "here";
      var embededExample = #{params};
      # ... etc
    END
  end

  def generate_and_save(tmp_file_name)
    code = generate_code
    tmp_file = "#{Rails.root}/tmp/#{tmp_file_name}.js"
    File.open(tmp_file, 'w') do |f|
      f.write code
    end
    tmp_file
  end
end

上传文件到 S3：

你有很多选择。我建议使用Fog 上传文件。

【讨论】：