为 Sinatra 提供静态文件

我有一个页面网站只使用 HTML，CSS 和 JavaScript。我想把这个应用程序部署到 Heroku，但我找不到办法。我现在正在尝试让这个应用程序与辛纳屈一起工作。

.
|-- application.css
|-- application.js
|-- index.html
|-- jquery.js
`-- myapp.rb

以下是 myapp.rb的内容。

require 'rubygems'
require 'sinatra'


get "/" do
# What should I write here to point to the `index.html`
end
89480 次浏览
小开
最佳答案

不需要任何其他配置，Sinatra 将为 public中的资产提供服务。对于空路由，需要呈现索引文档。

require 'rubygems'
require 'sinatra'


get '/' do
File.read(File.join('public', 'index.html'))
end

路由应该返回一个 String，它将成为 HTTP 响应主体。File.read打开一个文件，读取该文件，关闭该文件并返回一个 String。

小开

这个解决方案怎么样:

get "/subdirectory/:file" do
file = params[:file] + "index.html"
if File.exists?(params[:file])
return File.open("subdirectory/" + file)
else
return "error"
end
end

因此，如果您现在导航到(例如)/subdirectory/test/，它将加载子目录/test/index.html

小开

Sinatra 应该允许您从公共目录 就像文件里解释的那样提供静态文件:

静态档案

静态文件来自./public 目录。您可以通过设置: public 选项来指定不同的位置:

请注意，公共目录名没有包含在 URL 中。 ./public/css/style.css 文件作为 example.com/css/style.css 提供。

小开

请记住，在生产中，您可以让您的 Web 服务器自动发送 index.html，以便请求永远不会到达 Sinatra。这对性能更好，因为你不需要通过 Sinatra/Rack 栈来提供静态文本，而这正是 Apache/Nginx 所擅长的。

小开

您可以使用 send_file助手来提供文件。

require 'sinatra'


get '/' do
send_file File.join(settings.public_folder, 'index.html')
end

这将为 index.html提供服务，无论 index.html在哪个目录中被配置为拥有应用程序的静态文件。

小开

您可以从公用文件夹托管它们，它们不需要路由。

.
-- myapp.rb
`-- public
|-- application.css
|-- application.js
|-- index.html
`-- jquery.js

在 myapp.rb 里

set :public_folder, 'public'


get "/" do
redirect '/index.html'
end

链接到某个公共子文件夹

set :public_folder, 'public'
get "/" do
redirect '/subfolder/index.html'
end

./public 中的所有内容都可以从“/whatever/bla.html”访问

例如:
./public/样式表/screen. css
将可以通过’/stylesheets/screen. css’访问，不需要路由

小开

Sinatra 的资产包 gem 提供了一系列的特性。语法很棒:

serve '/js', from: '/app/javascripts'

虽然我仍然有与轨道资产管道的问题，我觉得我有更多的控制使用 Sinatra 的资产包-但大多数时候，它只与几行代码工作。

小开

您可以考虑将 index.html文件移动到 views/index.erb，并定义一个端点，比如:

get '/' do
erb :index
end
小开

将文件放入 public文件夹有一个限制。实际上，当您在根目录中时，'/'路径正常工作，因为浏览器将设置您的 css 文件的相对路径，例如 /css/style.css，而 sinatra 将在 public目录中查找该文件。但是，如果你的位置是例如 /user/create，然后网络浏览器将寻找你的 css 文件在 /user/create/css/style.css和将失败。

作为解决方案，我添加了以下重定向来正确加载 css 文件:

get %r{.*/css/style.css} do
redirect('css/style.css')
end
小开

更新答案 : 我绑定了以上所有内容，但是没有能够加载 css、 js... . etc 内容，只加载了 index.html... 其余的都是 = > > 404 error

我的解决方案: 应用程序文件夹如下所示。

辛纳屈代码。

require 'rubygems'
require 'sinatra'


get '/' do
html :index
end


def html(view)
File.read(File.join('public', "#{view.to_s}.html"))
end

public folder = = > 包含所有其他东西... css，js，等等。

user@user-SVE1411EGXB:~/sintra1$ ls
index.rb  public
user@user-SVE1411EGXB:~/sintra1$ find public/
public/
public/index.html
public/about_us.html
public/contact.html
public/fonts
public/fonts/fontawesome-webfont.svg
public/fonts/fontawesome-webfont.ttf
public/img
public/img/drink_ZIDO.jpg
public/js
public/js/bootstrap.min.js
public/js/jquery.min.js
public/js/bootstrap.js
public/carsoul2.html
public/css
public/css/font-awesome-ie7.css
public/css/bootstrap.min.css
public/css/font-awesome.min.css
public/css/bootstrap.css
public/css/font-awesome.css
public/css/style.css
user@user-SVE1411EGXB:~/sintra1$

现在启动服务器，您将能够毫无问题地浏览静态页面。

user@user-SVE1411EGXB:~/sintra1$ ruby index.rb
== Sinatra/1.4.5 has taken the stage on 4567 for development with backup from Thin
>> Thin web server (v1.5.1 codename Straight Razor)
>> Maximum connections set to 1024
>> Listening on localhost:4567, CTRL+C to stop
小开

在主 rb 文件中添加以下行

set :public_folder, 'public'

档号: http://sinatrarb.com/configuration.html#static---enabledisable-static-file-routes

小开 
require 'rubygems'
require 'sinatra'


set :public_folder, File.dirname(__FILE__) + '/../client'
#client - it's folder with all your file, including myapp.rb


get "/" do
File.read('index.html')
end
小开

Http://sinatrarb.com/configuration.html#static——-enabledisable-static-file-routes

这才是正确的做法。

set :public_folder, 'public'

我使用静态设置是因为它的设置会影响 public _ file 的使用。

小开

您总是可以使用 Rack: : Static

Https://www.rubydoc.info/gems/rack/rack/static

只需在‘ run’命令之前添加这一行到‘ config.ru’中即可

use Rack::Static, :urls => [""], :root => 'public', :index => 'index.html'

提交答案