我一直在为我的CS课程开发javascript游戏。当我通过在Webstorm中运行来打开文档时，它会正确加载游戏，但是当我尝试从Finder打开html文件时，网页会打开，但我没有用于精灵加载的png文件。我在谷歌浏览器中打开了Inspect Element，并正确加载了javascript文件，但所有png文件都列为已取消。当从webstorm运行游戏时（当我从webstorm运行它时，所有图像文件正确加载），这不会发生。
当直接从html文件打开游戏时（就在遇到问题时），chrome会将html文档的路径列为webaddress，尽管从webstorm打开时，它会列出http://localhost:63342/CS%20Week%2010/CS105_Jessica.Davis_DogGame.html?_ijt=tmrr2fndgac82h07hlvt101gi4
如何解决此问题，以便在从Finder打开html文件时正确加载所有内容？所有图像文件都与html文件位于同一目录中。
答案 0 :(得分：2)
由于浏览器的安全性，从file://
什么样的网络广播可能是制作本地网络服务器，而不是说file://你可以说http://。如果任何网站能够从file://加载图像，那么您访问的任何网页都可以搜索您计算机上的任何文件并在未经您同意的情况下通过互联网发送，因此浏览器通常会启用这些设置。所以你需要一台服务器。如果您正在使用计算机，则可以创建一个本地服务器，就像webstorm一样，并在那里托管您自己的文件。或者将它托管在github pages或codepen等其他服务上。
现在，由于所有图片都在同一目录中，因此请确保每次拨打loadImage时都使用图片名称和扩展名，而不是说/User/user/whatever_other_directory_you_have_it_under/image.png。
完成后，您可以为项目创建本地Web服务器。要创建本地服务器，请打开终端（实用程序下的应用程序，您也可以突出搜索它）并键入cd，拖动项目文件夹并将其放在终端上，然后按Enter键。然后键入python -m SimpleHTTPServer并等到Serving HTTP on 0.0.0.0 port 8000 ...之类的内容。然后取你在示例中看到的0.0.0.0和8000（你的可能或可能不一样）进入你的浏览器并输入http://0.0.0.0:8000（用你得到的任何数字替换数字，而不是这个链接不是工作直到你这样做）
图像应该正常加载。如果您需要停止服务器，可以返回终端并点击control+C。
请注意，在展示p5草图时，如果您制作本地服务器，则其他任何人都无法在其计算机上看到该网站。本地服务器与运行它的设备隔离（尽管如果他们自己创建本地服务器并拥有项目文件，它应该可以正常工作）。
如果您希望托管网站以便与世界上的任何人共享链接，则可以使用codepen或github页面。如果你去codepen.io它应该是不言自明的，虽然你必须上传你的图像到某些图像托管网站，如tumblr或东西，并将这些图像的URL源添加到codepen或你可以把所有内容放入github甚至更好的结果！
要使用github页面，您需要创建一个github帐户（最好将您的用户名设置为您想要命名的页面）。创建一个名为insert_username_here.github.io的存储库。将您的文件添加到存储库（确保尝试将所有子目录和文件夹与项目文件夹中的完全相同）。一两分钟后，转到http://insert_username_here.github.io欣赏您全新的托管网页！