小编Ted*_*Khi的帖子

Q1)在我的reactjs应用程序中,我试图从我的后端Nodejs服务器获取API.API根据请求响应图像文件.

我可以访问http://192.168.22.124:3000/source/592018124023PM-pexels-photo.jpg查看图像文件

但在我的reactjs客户端,我在控制台日志中收到此错误.

未捕获(在promise中)SyntaxError:位于0的JSON中的意外标记.

Reactjs:

let fetchURL = 'http://192.168.22.124:3000/source/';
  let image = name.map((picName) => {
    return picName
  })

  fetch(fetchURL + image)
  .then(response => response.json())
  .then(images => console.log(fetchURL + images));

的NodeJS:

app.get('/source/:fileid', (req, res) => {
const { fileid } = req.params;
res.sendFile(__dirname + /data/ + fileid); 
});

有什么比我上面做的更好的方法吗？

Q2)另外,如何为空变量赋值(它存在于fetch函数之外)
jpg = fetchURL + images; 所以我可以在某个地方访问它.

1）我正在尝试对GET请求进行解码，例如abb197313b83ad9f16a946c8be35a0f8，但出现此错误。

TypeError：第一个参数必须是字符串，Buffer，ArrayBuffer，Array或类似数组的对象。

let decoder;

    const parseMetadataString = (metadata_string) => {
    const kv_pair_list = metadata_string.split(',');

    return kv_pair_list.reduce((metadata, kv_pair) => {
        const [key, base64_value] = kv_pair.split(' ');

        metadata[key] = {
            encoded: base64_value,
            decoded: Buffer.from(base64_value, 'base64').toString('ascii'),
        };
        return decoder = metadata;
    }, {});
}

  app.get('/upload/files/:fileid', (req, res) => {
   const { fileid } = req.params;
   parseMetadataString(fileid);
   res.sendFile(__dirname + /files/ + decoder);
  });

2）如果我这样做，我会收到此错误：

TypeError：无法读取未定义的属性“名称”

但是它确实使用正确的名称res.sendFile。

let decoder;

  const parseMetadataString = (metadata_string) => {
    const kv_pair_list = metadata_string.split(',');

    return kv_pair_list.reduce((metadata, kv_pair) => …

在使用 JWT 令牌进行验证后，我正在从 nodejs API 获取图像。我在浏览器中收到 GET 200 ok 响应网络标题和图片可以在预览中看到，但我不能在我的应用程序中使用它。

我肯定做错了什么。请让我知道从 API 显示图像的正确方法。在我的后端 nodejs 上，我使用 res.sendFile 发送文件。

class Card extends Component {
 constructor({props, pic, token}) {
super(props, pic, token);
this.state = { 
  pic: pic,
};

urlFetch(data) {
 fetch(data, { 
 headers: new Headers({
 'authorization': `Bearer ${this.props.token}`, 
 'Content-Type': 'application/json'
 })
})
.then(response => {
 if (response.statusText === 'OK') {
  return data   // OR return response.url
  }
 })
}

render() {
const { pic } = this.state;

 return (
        <div>
          <img style={{width: 175, …