使用 Rails 生成 Javascript 代码

Generating Javascript Code with Rails

本文关键字:代码 Javascript 生成 Rails 使用      更新时间:2023-09-26

我目前正在开发一个Web应用程序,它可以生成可以附加到另一个页面的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文件来从您的应用程序中"提取"数据并在其他人的网站上显示适当的HTML。

此文件将包含在其他人的网站上;它将使用来自您服务器的数据(通过API(填充网站上的 HTML 元素。它可能使用iframe,但通常只会用你自己服务器中的资产来装饰HTML元素。

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

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

--

.JS

将 JS 文件设为公开的唯一方法是将其放在public文件夹中,或者至少放在应用(子域(中可公开访问的部分。

不能为其使用资产管道。

当然,您可以使用版本控制机制等,但事实是您需要一个公共"链接"其他站点可以包括:

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

--

.HTML

为了在您的网站上填充小部件,您可以查看存在的各种JS改编。我没有这方面的经验;bootstrap的JS实现将是一个很好的起点,而Google的分析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

裁判

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

它将允许您发送...

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

科尔斯

最后,最后一个考虑因素是CORS - Cross Origin Resource Sharing

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

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

您需要做的是让您的public.jsAPI一起可供任何人访问。因此,建议将两者放入子域中。如果需要,我可以为您提供更多信息。

<小时 />

是否有任何宝石可以帮助完成此任务

不是我知道的。

这是某种高级功能。您必须知道 HTTP Web 服务的底层身份验证模式,并将其与用于第三方的 JS 实现相匹配。

在最简单的形式中,您正在制作一个提取API数据的小应用程序("小部件"(。您只需要知道允许访问应用程序的哪些部分,即可使功能正常工作。

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

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

创建文件:

最佳做法是创建服务,例如:

# 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上传文件。