Hi 你好,欢迎访问!登录
当前位置:首页 - 服务器问题 - 正文 SEO教程学习网

Nginx实现静态资源的反向代理实例

2018-11-26服务器问题seo学习网1601°c
A+ A-
这篇文章主要介绍了Nginx实现静态资源的反向代理实例,本文通过分析github发现这个应用,可以避免在https的网站中出现http链接,需要的朋友可以参考下

github 中很多项目都有一个 readme 文件,很多人喜欢在文件中添加自己的创作或封面图片,比如 substack 为他的每个项目绘制了一个 logo。这些图片在 github 中能直接在页面中显示出来,不过 url 被替换成了 github 自己的。比如在 browserify 项目中,logo 的链接变成了
复制代码 代码如下:
https://camo.githubusercontent.com/e19e230a9371a44a2eeb484b83ff4fcf8c824cf7/687474703a2f2f737562737461636b2e6e65742f696d616765732f62726f777365726966795f6c6f676f2e706e67

而我们通过查看 raw 能发现原 url 是
复制代码 代码如下:
/2018img/2018/09/24160126.png

这样做的一个好处是防止因为在 https 网站中出现 http 链接,否则在客户端会得到一个风险警告。github 在细节上真是考虑的十分周到。
既然有需求,我们就来实现它。通常的做法是写一个应用去抓取远程的静态资源,然后反馈给前端,这就是一个简单地反向代理了。但是这样做比较繁琐,效率也未见得高,其实我们可以直接通过 nginx 来代理这些静态文件。
nginx 的 proxy_pass 支持填写任意地址,并且支持 dns 解析。所以我的思路是,将原 url 加密转成网站自身的 url。比如上面的
复制代码 代码如下:
/2018img/2018/09/24160126.png

可以加密成
复制代码 代码如下:
764feebffb1d3f877e9e0d0fadcf29b85e8fe84ae4ce52f7dc4ca4b3e05bf1718177870a996fe5804a232fcae5b893ea (加密和序列化算法网上有很多,在此就不赘述了)

然后放在我们自己的域名下:
复制代码 代码如下:
https://ssl.youdomain.com/camo/764feebffb1d3f877e9e0d0fadcf29b85e8fe84ae4ce52f7dc4ca4b3e05bf1718177870a996fe5804a232fcae5b893ea

解密的步骤用 nginx 会比较难实现,所以当用户通过上述链接请求时,先讲请求传递给解密程序,这里有一个 coffeescript 版本的例子:
复制代码 代码如下:
express = require 'express'
app = express()
app.get '/camo/:eurl', (req, res) ->
  {eurl} = req.params
  {camoSecret} = config  # 这里使用自己的密钥
  rawUrl = util.decrypt eurl, camoSecret
  return res.status(403).end('INVALID URL') unless rawUrl
  res.set 'X-Origin-Url', rawUrl
  res.set 'X-Accel-Redirect', '/remote'
  res.end()
app.listen 3000

然后写入 X-Accel-Redirect 响应头做内部跳转,下面的步骤就由 nginx 完成了。
下面是一个完整的 nginx 配置文件例子:
复制代码 代码如下:
server {
    listen 80;
    server_name ssl.youdomain.com;
    location /camo/ {
        proxy_pass http://localhost:3000;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header Host $http_host;

  选择分享方式
未定义标签

发表评论

选填

必填

必填

选填

请拖动滑块解锁
>>


  用户登录