Meteor js, React custom image redirect / meteor WebApp
Здравствуйте, ребята,
Я пытаюсь сделать настраиваемое перенаправление изображений в Meteor, чтобы я мог просто использовать более короткие настраиваемые ссылки, которые перенаправляют меня на изображения, загруженные в Amazon:
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"?
Большое спасибо за совет С уважением Буксо
Изображения расположены в Amazon S3, это один из примеров: languagepocket-repo.s3-eu-central-1.amazonaws.com/chatrooms/…
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 2
Во-первых, я вижу, что вы получаете свои изображения из S3, тогда как вам, вероятно, следует получать их через Cloudfront. Основное отличие - это кеширование. Кроме того, когда вы сохраняете изображения в S3, убедитесь, что у вас установлены параметры «expire» и «cache-control», чтобы ваши пользователи кэшировали изображения на локальных устройствах (если вы этого хотите). В Cloudfront у вас может быть ссылка, например assets.yourdomain.com/....your asset.
Простым и безопасным способом было бы объявить глобальную переменную, например
var IMAGE = 'https//........your cloudfront root '
и в коде вы получите что-то вроде:
<img src = {`${IMAGE}/${imagename}.jpg`}
Если вам нужна полная безопасность и полностью "отключить" ссылки / источники изображений, вы можете использовать очень хорошо поддерживаемый пакет Ostrio Files Meteor.
п
Я исправил проблему вот так:
WebApp.connectHandlers.use(function(req, res, next) {
const reqUrlParts = req.url.split('/');
let urlToRedirect = 0;
if (reqUrlParts[1] && reqUrlParts[1] === 'files') {
urlToRedirect = fileHandler.handleUrl(req);
}
if (urlToRedirect) {
res.writeHead(301, {
Location: urlToRedirect,
});
res.end();
} else {
next();
}
});
спасибо за советы. Что касается ссылки с истечением срока действия - я обрабатываю ее своей системой, поэтому я автоматически обновляю ее, если срок ее действия истек, и перенаправляю на новую.
Где расположены эти изображения? В каком файле вы вызываете тег img и где он находится? покажите нам структуру папок проекта