在哪里为MERN app

时间:2018-05-29 17:32:43

标签: image reactjs

我正在构建一个体育网络应用程序,对于应用程序,我需要每个NBA篮球运动员的缩略图。我编写了一个抓取图像路径的脚本(像这样的链接 - http://a.espncdn.com/combiner/i?img=/i/headshots/nba/players/full/3414.png&w=350&h=254),所以我可以访问所有图像,但我不确定React最佳实践是关于在哪里保存这些类型的图像。我认为我的选择是:

  1. 将每个播放器的图像文件保存在应用程序目录中(保存其他图像的位置,我认为我的应用程序的assets文件夹),然后将它们导入应用程序。
  2. 不要保存图像文件,而是在我的数据库中使用播放器ID和图像路径创建一个表,并让我的应用程序使用这些路径来抓取已托管的图像。
  3. A和B两者。首先保存图像文件,然后自己重​​新托管图像文件,并链接到这些新托管的图像。
  4. 这三种选择有意义吗?我觉得(3)是最好的选择,但也需要最多的工作。 (2)看起来最简单但最不可靠,因为我无法相信已经托管的图像网址将始终有效,并且(1)只是看起来不是最好的方法,因为它需要我的数百个导入语句应用程序来获取所有图像。

    不是编码问题,但我认为这具有广泛的适用性,我希望这篇文章可以保持不变。任何帮助或想法都受到赞赏!

    编辑:作为参考,这里有一些与我的表格相似的内容:

    > player.image.df
          [,1]                [,2]                                                                                       
     [1,] "alex-abrines"      "http://a.espncdn.com/combiner/i?img=/i/headshots/nba/players/full/2995702.png&w=350&h=254"
     [2,] "quincy-acy"        "http://a.espncdn.com/combiner/i?img=/i/headshots/nba/players/full/6576.png&w=350&h=254"   
     [3,] "steven-adams"      "http://a.espncdn.com/combiner/i?img=/i/headshots/nba/players/full/2991235.png&w=350&h=254"
     [4,] "bam-adebayo"       "http://a.espncdn.com/combiner/i?img=/i/headshots/nba/players/full/4066261.png&w=350&h=254"
     [5,] "arron-afflalo"     "http://a.espncdn.com/combiner/i?img=/i/headshots/nba/players/full/3187.png&w=350&h=254"   
     [6,] "alexis-ajinca"     "http://a.espncdn.com/combiner/i?img=/i/headshots/nba/players/full/3410.png&w=350&h=254"   
     [7,] "cole-aldrich"      "http://a.espncdn.com/combiner/i?img=/i/headshots/nba/players/full/4267.png&w=350&h=254"   
     [8,] "lamarcus-aldridge" "http://a.espncdn.com/combiner/i?img=/i/headshots/nba/players/full/2983.png&w=350&h=254"   
     [9,] "jarrett-allen"     "http://a.espncdn.com/combiner/i?img=/i/headshots/nba/players/full/4066328.png&w=350&h=254"
    [10,] "kadeem-allen"      "http://a.espncdn.com/combiner/i?img=/i/headshots/nba/players/full/3134880.png&w=350&h=254"
    

    这些不是我的链接,我无法知道ESPN是否会改变这些链接,这就是为什么我认为(3)是最好的方法。但我不确定如何快速轻松地托管我自己的图像。

1 个答案:

答案 0 :(得分:1)

我会推荐第三个选项,它绝对是确保这些图像可用并且可以根据需要使用它的最可靠方法。

您不必为每个图像进行导入,一旦在数据库中拥有所有图像路径,就可以使用require()函数动态加载它。

您只需创建一个脚本即可下载CDN上的所有图像并将其新路径保存到数据库中。

- 编辑 -

我认为你的服务器和你的bandwitdh足够强大,可以管理自托管图像产生的额外工作。