Angular Chrome不允许加载本地资源
Angular是一种流行的前端开发框架，而Chrome是一款常用的网络浏览器。在Angular开发中，Chrome浏览器有一个安全策略，不允许直接加载本地资源。这是为了防止恶意网站通过加载本地资源来获取用户的敏感信息或进行其他不当操作。
当我们在Angular应用中尝试加载本地资源时，比如使用相对路径引用本地图片、CSS文件或其他资源文件，Chrome浏览器会阻止这些请求，并显示一个错误信息。
为了解决这个问题，我们可以通过以下几种方式来加载本地资源：
- 使用绝对路径：可以将本地资源上传到云存储服务中，然后使用云存储服务提供的绝对路径来引用资源。例如，可以使用腾讯云对象存储（COS）来存储资源，并使用其提供的URL来加载资源。
- 使用Base64编码：将本地资源转换为Base64编码的字符串，并将其嵌入到HTML或CSS文件中。这样可以避免直接加载本地资源的问题，但会增加文件大小。
- 使用服务器代理：在服务器端设置代理，将本地资源请求转发到服务器上，然后再由服务器返回资源内容。这样可以绕过Chrome的安全策略，但需要额外的服务器配置和开发工作。
总结起来，为了解决Chrome不允许加载本地资源的问题，我们可以使用绝对路径、Base64编码或服务器代理等方法来加载资源。具体选择哪种方法取决于实际需求和项目情况。
腾讯云相关产品推荐：
- 对象存储（COS）：提供可扩展的云存储服务，适用于存储和访问各种类型的文件。详情请参考：腾讯云对象存储（COS）
- 云服务器（CVM）：提供弹性、安全、稳定的云服务器实例，适用于各种应用场景。详情请参考：腾讯云云服务器（CVM）
- 云函数（SCF）：无服务器计算服务，支持按需运行代码，无需管理服务器。详情请参考：腾讯云云函数（SCF）
相关·内容
在部署我的Angular应用程序后，当我打开我的网页时，我得到了以下错误。我已经加载到网站上的图像都像<img src="assets/img/image1.我已经使用了c:\Program Files (x86)\google\chrome\Application\chrome.exe --allow-file-access-from-files，Ch
浏览 13提问于2020-11-13得票数 0
点击按钮后，我正在尝试加载一个位于共享网络路径中的文档文件，这在InterExplorer中运行良好，但在Chrome中我得到一个错误‘不允许加载本地资源’ windows.open('file://userguide/oracle/training.docx',"_blank") 读到Chrome将不允许加载本地资源，
浏览 81提问于2020-07-08得票数 0
回答已采纳
我正在创建一个小的angular应用程序，其中我显示了本地文件夹中的图像。但是在加载页面时，我得到了下面的错误 <sanitizeImageUrl()" alt="Card image cap">
在compo
浏览 9提问于2020-06-06得票数 1
我试图通过将window.location.href设置为file://folder/来打开本地文件夹，我可以在IE中这样做，在Chrome中不能这样做。我的目标是在浏览器阻止本地文件访问时使用catch，这样我就可以调用其他代码。Chrome的控制台显示“不允许加载本地资源：.”但是我无法用try/catch块捕获它。企图： try {
浏览 18提问于2016-01-28得票数 5
回答已采纳
2回答
我想让它读我的本地视频，但我有一个信息：“对不起，没有找到兼容的来源和回放技术为这个视频。”我下载了一些样本来试用。
浏览 33提问于2013-09-09得票数 4
回答已采纳
当我制作一个普通的html页面并加载src标签中的视频时，html视频标签工作正常。当涉及到jsp并从localhost中的video标签访问视频时，它抛出错误:-不允许加载本地资源：
解决这个问题的办法是什么？
浏览 31提问于2017-01-22得票数 1
回答已采纳
我有一个可以读取书签并允许打开它们的扩展，但它不能打开像'chrome://extensions‘或'chrome://settings’这样的书签。本地文件也不做任何事情。window.location = 'chrome://settings'
给出一个错误：“不允许加载本地资源: chrome://settin
浏览 0提问于2021-01-17得票数 0
3回答
是否可以从打包的应用程序中播放本地视频文件？我已经编写了选择文件(chrome.fileSystem.chooseEntry)和标识路径(chrome.fileSystem.getDisplayPath)的代码，但将其设置为视频标记的源将返回：不允许加载本地资源: file:///
提前谢谢。
浏览 0提问于2013-05-12得票数 2
回答已采纳
1回答
我试图为chrome://app添加一个链接，但它不允许重定向。我检查了控制台，得到了以下错误:不允许加载本地资源:chrome://app/<a href="chrome://apps"><img class="apps" src="images/chrome-ap
浏览 1提问于2015-01-14得票数 1
回答已采纳
怎样才能访问本地的chrome-urls来接收内容呢？例如，对chrome://version使用iframe，或者使用AJAX直接访问内容。{ "app": { "chrome://*",
"chrome:/&#
浏览 3提问于2015-01-02得票数 0
我正在尝试使用chromes favicon url加载url的收藏夹图标：但是我得到了一个错误：在货单上我有：
"permissions"
浏览 0提问于2013-02-11得票数 4
回答已采纳
1回答
我正在创建一个铬的扩展来修改一个网站，而且我在加载网页字体时遇到了麻烦。@font-face { src: url(chrome://extensions#iefix&v=4.6.3) format('embedded-opentype'), url(chrome://exte
浏览 1提问于2016-10-13得票数 3
回答已采纳
我正在使用下面的代码在本地机器上播放视频存储，但我在chrome中遇到错误，比如不允许加载本地资源: file:///，而在Firefox web浏览器中，我得到的视频格式或MIME类型不受支持。.error(function(error){ });使用$sce进行过滤以避免阻止从不安全的URL加载资源videoPath)
浏览 3提问于2017-09-22得票数 0
我试图在angular.js中制作一个应用程序，它将允许根据提供的单词在mediawiki中执行搜索。我曾经用约曼来欺骗我的应用程序，我用“咕噜服务”在本地服务器上运行它。但是，无论我尝试了什么，我都会收到关于跨源请求的错误，例如：
XMLHttpRequest无法加载。请求的资源上没有“访问-控制-允许-原产地”标题。因此，'http://localhost:9000'源是不允许访问的。我试图将请求的“原产地”头设置为本地主机入口，但在fire
浏览 4提问于2014-12-18得票数 1
我正在试用AngularJS，并且一直在看Dan Wahlin在youtube上的视频，但在Chrome或IE中无法获得路由。在FireFox中一切正常，但仅此而已。它只会给出一个空白页。DOCTYPE html><head> <script src="angular.min.jsPlaceholder for views-->
&
浏览 0提问于2013-07-18得票数 2
回答已采纳
在这种情况下，我想要创建一个链接到chrome://extensions菜单。就像这是不允许的:不允许加载本地资源: chrome://extensions/
浏览 4提问于2015-10-02得票数 4
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
实时音视频
对象存储
即时通信 IM活动推荐
腾讯云开发者
