reactjs - 在私有服务器上从公共网站加载动态图像

Question

我正在尝试从我有权访问的私人服务器加载图像。从私人服务器加载时，它会引发错误，尽管当我尝试使用本地文件夹时它工作正常。

我的代码片段如下：

import React, { Component } from 'react';

export default class DefaultImages extends Component {

 render(){ 
     return(<div className="row">
              <div > <h2>Car Gallery</h2></div>
                  <div  className="slide fdi-Carousel">
                    <div className="onebyone-carosel">
                     {this.list(this.props.ImagesDataJson)}
                   </div>
                      </div>                  
 </div>

);}

list(data) {
 return data.map((data, index) => {

     return ( <div className="item active">
   <div className="col-md-6">
   {data.photo_url.map(function(data, index){ 
         return <img key={index} src={require("http://abc1234566667777777.com/2001/51648/1/10/Thumbnails/339673.Jpeg")}
 className="img-responsive center-block"/>  } )}
      </div>
      </div>
      )
  }) } }

Answer 1

要加载图像，您只需指定 URL，如下所示

<img key={index} src={"http://example.com/2001/51648/1/10/Thumbnails/339673.Jpeg"} className="img-responsive center-block"/>

这是一个工作示例 https://codesandbox.io/s/8831xy600j