使用 Rails 生成 Javascript 代码
Generating Javascript Code with Rails
我目前正在开发一个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.js
与API
一起可供任何人访问。因此,建议将两者放入子域中。如果需要,我可以为您提供更多信息。
是否有任何宝石可以帮助完成此任务
不是我知道的。
这是某种高级功能。您必须知道 HTTP Web 服务的底层身份验证模式,并将其与用于第三方的 JS 实现相匹配。
在最简单的形式中,您正在制作一个提取API数据的小应用程序("小部件"(。您只需要知道允许访问应用程序的哪些部分,即可使功能正常工作。
为了生成JS文件并存储在S3中,您应该执行以下操作:
- 在 TMP 文件夹中创建文件
- 上传到 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上传文件。
- 云代码(javascript)失败,原因是:{代码:1,消息:内部错误
- 简化此If语句,使其不会't重复代码-Javascript
- 十进制到二进制代码Javascript
- 第二次单击时执行不同的代码(JavaScript)
- 在不使用jquery($symbol)knockout.js的情况下分离代码javascript
- 缩短几个元素的onclick代码 - JavaScript
- 英国银行排序代码 JavaScript 正则表达式
- 我无法在谷歌图表的代码 javascript 中获取 json 数据(项目 Python Hello Dashboard
- 和代码 JavaScript 没有被 &.
- 我怎样才能减少这段代码 javascript 代码,这样它就不会那么重复了
- 我想单击一个按钮,一次只执行已经制作的程序中的一行代码.(JavaScript)
- 滑动 DIV 代码 Javascript 的小问题
- 尝试重写代码 JavaScript
- 是否可以检测到在不使用键代码 javascript 的情况下按下了输入键
- 输入网址代码 JavaScript 播放器
- 管理通用客户端代码(javascript/css)
- 理解代码javascript
- 加载json-url参数代码(javascript修改)
- 变量检查错误的代码(javascript)
- css属性仅由代码javascript应用