我有一个在 localhost:3000 运行 VueJS 的网站,它执行一些调用 this.nextImage() 的操作。
methods:
// content //
async nextImage() {
console.log("In nextImage from App.vue"); // keeping track of location
try {
const response = await axios.get('http://localhost:5050/images');
console.log(response.data);
[how to make an image?]
} catch (error) {
console.error(error);
}
}
// content //
<template>
<!-- stuff -->
<div class="picture"><img :src="[what should go here?]" :alt="imageName"></div>
<!-- more stuff -->
<template
在 localhost:5050 上是一个 Express 服务器,其中包括:
const path = require('path')
// content //
app.get('/images', (req, res) => {
console.log("Express server: /images"); // tracking location
let imageName = 'myImage'
let imagePath = path.join(__dirname, '/images/' + imageName + '.jpeg')
res.sendFile(imagePath)
})
记录response.data给出
����JFIF��� !.%+!&8&+/1555$;@;4?.4514+$+44444444444444444444444444444444444444444444444444���"����B !1AQ2aq���"BR�����b�#3CSr���D��$%4����&1Q!Aa�2q�"��?�Z�UyEZL�>��ˀ��@�'G ��YU�U�$RlX�d<ǜ (... abbreviated because I had too much code)
我需要两件非常简单的事情:
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
这是一个非常简单的修复。我实际上不需要发送文件本身,只需发送文件的链接(只需
app.send(imagePath))。当客户端对服务器进行 GET 调用时,它们会获得一个 url,该 url 可以包含在img标记中,如下所示:<img source="imagePath">。