javascript - Meteor js，React 自定义图像重定向/meteor WebApp

Question

大家好，

我尝试在流星中对图像进行自定义重定向，这样我就可以使用较短的自定义链接将我重定向到在亚马逊上传的图像：

WebApp.connectHandlers.use(function(request, response, next) {
      if (~request._parsedUrl.path.indexOf('/image') > -1) {
        response.writeHead(301, {
          Location:
            'https://s3.eu-central-1.amazonaws.com/my-prepo/folder/imageName123456.jpg',
        });
        response.end();
      }
      next();
    });

就在我写的时候，我可以在像 jsfiddle 这样的外部页面中很好地使用它：

<img src="http://localhost:4003/image" />

但是当我在我的反应前端中使用它时<img src="/image" />，图像没有出现，并且服务器中出现错误：

E20180825-11:59:12.452(3) (webapp_server.js:799) Error running template: Error: Can't set headers after they are sent.
at validateHeader (_http_outgoing.js:491:11)
at ServerResponse.setHeader (_http_outgoing.js:498:3)
at ServerResponse.setWriteHeadHeaders (/home/bux/.meteor/packages/webapp/.1.5.0.1phld1g.dmro++os+web.browser+web.cordova/npm/node_modules/on-headers/index.js:82:19)
at ServerResponse.writeHead (/home/bux/.meteor/packages/webapp/.1.5.0.1phld1g.dmro++os+web.browser+web.cordova/npm/node_modules/on-headers/index.js:41:36)
at getBoilerplateAsync.then (packages/webapp/webapp_server.js:791:13)
at /home/bux/.meteor/packages/promise/.0.10.2.12fknlz.thdv++os+web.browser+web.cordova/npm/node_modules/meteor-promise/fiber_pool.js:43:40

我该怎么做才能使用我自己的链接来显示图像<img src="/image"？

非常感谢您的建议 最好的问候 Bukso

标签： javascriptreactjsmeteorweb-applications

Answer 1

首先，我看到您从 S3 获取图像，而您可能应该通过 Cloudfront 获取它们。主要区别在于缓存。此外，当您将图像保存到 S3 时，请确保设置了“过期”和“缓存控制”，以便您的用户将图像缓存在本地设备上（如果需要）。使用 Cloudfront，您可以拥有类似 assets.yourdomain.com/....您的资产的链接。

简单而安全的做法是声明一个全局变量，例如

var IMAGE = 'https//........your cloudfront root '

在代码中你最终会得到类似的东西：

<img src={`${IMAGE}/${imagename}.jpg`}

如果您需要完全的安全性并完全“混淆”图像链接/来源，您可以使用非常受支持的 Ostrio Files Meteor 包。

磷