html文件通过script标签引入外部js文件,但没正确加载的原因

移动端H5应用,html文件通过script标签引入外部js文件,但没正确加载,在移动设备上难以排查。通过PC浏览器打开,发现js被阻止了:blocked:mixed-content
原因在于

  • “blocked:mixed - content” 是浏览器的一种安全策略导致的错误提示。它表示网页中包含了混合内容,即同时包含安全(通常是通过https协议加载)和不安全(通常是通过http协议加载)的资源。
  • 现代浏览器为了增强安全性,默认会阻止这种混合内容的加载。HTML 文件可能是通过https协议加载的,而 JavaScript 文件(http://g.alicdn.com/dingding/open-develop/1.9.0/dingtalk.js)是通过http协议加载的,这就触发了浏览器的安全机制。

解决方法

  • 升级资源链接协议:如果可能的话,将 JavaScript 文件的加载协议也升级为https。例如,如果资源有对应的https版本,可以将src属性修改为src = “https://g.alicdn.com/dingding/open-develop/1.9.0/dingtalk.js”。这样可以确保整个页面的资源加载都是安全的,符合浏览器的安全策略。
  • 调整服务器配置(较复杂):如果无法直接升级资源链接协议,在某些情况下,可以通过配置服务器来允许混合内容的加载。不过这种做法会降低网页的安全性,并且可能会给用户带来安全风险,一般不推荐。具体的服务器配置方法因服务器类型(如 Apache、Nginx 等)而异。例如,在 Nginx 服务器中,可以通过配置add_header Content - Security - Policy “upgrade - insecure - requests”;来尝试自动将http请求升级为https请求,但这也需要服务器对https有正确的支持。
  • 将js下载到项目中引入

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.rhkb.cn/news/498719.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

STM32 高级 物联网通讯之LoRa通讯

目录 LoRa通讯基础知识 常见的3种通讯协议 远距离高速率的传输协议 近距离高速率传输技术 近距离低功耗传输技术 低功耗广域网 采用授权频段技术 非授权频段 LoRa简介 LoRa的特点 远距离 低功耗 安全 标准化 地理定位 移动性 高性能 低成本 LoRa应用 LoRa组…

基于51单片机的教学用自动光学演示装置设计

视频演示效果: 基于51单片机的教学用自动光学演示装置设计 目录: 目录 视频演示效果: 目录: 前言: 一、项目介绍 1.1 项目背景 1.2 项目研究内容 二、相关光学实验理论 2.1 光的反射 2.2 光的折射 2.3 光的漫反射 三、…

YK人工智能(三)——万字长文学会torch深度学习

2.1 张量 本节主要内容: 张量的简介PyTorch如何创建张量PyTorch中张量的操作PyTorch中张量的广播机制 2.1.1 简介 几何代数中定义的张量是基于向量和矩阵的推广,比如我们可以将标量视为零阶张量,矢量可以视为一阶张量,矩阵就是…

百度热力图数据获取,原理,处理及论文应用

目录 0、示例数据1、百度热力图数据日期如何选择1.1、看日历1.2、看天气 2、百度热力图几天够研究?部分文章统计3、数据原理3.1.1 定位都包含哪些数据?3.1.2 ** 这个比较重要,后面还会再次出现。核密度的值怎么理解?**3.1.3 Csv-&…

电池放电仪在各领域的作用

电池放电仪广泛应用于各个领域。其主要功能是模拟电池在实际应用中的放电过程,通过测量电池的电压、电流、容量等参数,来评估电池的性能和寿命。以下是电池放电仪在各领域的作用: 1. 电动汽车领域:电动汽车需要大量的电池来提供动…

android studio gradle 如何解决下载依赖一直卡住的问题

解决Android studio中下载gradle慢的方法 gradle下载的配置 终极解决方案 在 Android studio 中配置http代理 2. 配置clash verge 然后重新点击构建gradle就可以了

Cesium 实战 27 - 三维视频融合(视频投影)

Cesium 实战 27 - 三维视频融合(视频投影) 核心代码完整代码在线示例在 Cesium 中有几种展示视频的方式,比如墙体使用视频材质,还有地面多边形使用视频材质,都可以实现视频功能。 但是随着摄像头和无人机的流行,需要视频和场景深度融合,简单的实现方式则不能满足需求。…

Three.js教程002:Three.js结合Vue进行开发

文章目录 Three.js结合Vue开发创建Vue项目安装依赖运行项目安装three使用three.js完整代码下载Three.js结合Vue开发 创建Vue项目 创建命令: npm init vite@latest框架这里选择【Vue】: 安装依赖 安装命令: cd 01-vueapp npm install运行项目 npm run dev

图像处理-Ch7-小波函数

个人博客!无广告观看,因为这节内容太多了,有点放不下,分了三节 文章目录 多分辨率展开(Multi-resolution Expansions)序列展开(Series Expansions)尺度函数(Scaling Function)例:哈尔尺度函数(Haar scaling func)多分…

手机h5加桌面图标

手机h5应用1&#xff0c;网址浏览器添加到桌面&#xff0c;修改图标 关键代码 <!-- 手机h5加桌面图标 --> <!-- 安卓平台 chrome --> <link relapple-touch-icon-precomposed href<% BASE_URL %>logonew.png> <meta name"mobile-web-app-capab…

【数据可视化-10】国防科技大学录取分数线可视化分析

&#x1f9d1; 博主简介&#xff1a;曾任某智慧城市类企业算法总监&#xff0c;目前在美国市场的物流公司从事高级算法工程师一职&#xff0c;深耕人工智能领域&#xff0c;精通python数据挖掘、可视化、机器学习等&#xff0c;发表过AI相关的专利并多次在AI类比赛中获奖。CSDN…

【数据库初阶】MySQL数据类型

&#x1f389;博主首页&#xff1a; 有趣的中国人 &#x1f389;专栏首页&#xff1a; 数据库初阶 &#x1f389;其它专栏&#xff1a; C初阶 | C进阶 | 初阶数据结构 亲爱的小伙伴们&#xff0c;大家好&#xff01;在这篇文章中&#xff0c;我们将深入浅出地为大家讲解 MySQL…

【UVM】搭建一个验证平台

UVM环境组件 组件功能 sequence_item&#xff1a;包装数据 UVM中&#xff0c;所有的transaction都要从uvm_sequence_item派生sequence item是每一次driver与DUT互动的最小粒度内容sequence&#xff1a;产生数据 uvm_sequence是一个参数化的类&#xff0c;其参数是transactio…

小程序租赁系统开发的优势与应用探索

内容概要 在如今这个数码科技飞速发展的时代&#xff0c;小程序租赁系统开发仿佛是一张神奇的魔法卡&#xff0c;能让租赁体验变得顺畅如丝。想象一下&#xff0c;无论你需要租用什么&#xff0c;从单车到房屋&#xff0c;甚至是派对用品&#xff0c;只需动动手指&#xff0c;…

活动预告 | Microsoft Azure 在线技术公开课:使用 Azure OpenAI 服务构建生成式应用

课程介绍 通过 Microsoft Learn 免费参加 Microsoft Azure 在线技术公开课&#xff0c;掌握创造新机遇所需的技能&#xff0c;加快对 Microsoft Cloud 技术的了解。参加我们举办的“使用 Azure OpenAI 服务构建生成式应用”活动&#xff0c;了解如何使用包括 GPT 在内的强大的…

小程序信息收集(小迪网络安全笔记~

免责声明&#xff1a;本文章仅用于交流学习&#xff0c;因文章内容而产生的任何违法&未授权行为&#xff0c;与文章作者无关&#xff01;&#xff01;&#xff01; 附&#xff1a;完整笔记目录~ ps&#xff1a;本人小白&#xff0c;笔记均在个人理解基础上整理&#xff0c;…

Jenkins管理多版本python环境

场景&#xff1a;项目有用到python3.8和3.9&#xff0c;python环境直接安装在jenkins容器内。 1、进入jenkins容器 docker exec -it jenkins /bin/bash 2、安装前置编译环境 # 提前安装&#xff0c;以便接下来的配置操作 apt-get -y install gcc automake autoconf libtool ma…

【PCIe 总线及设备入门学习专栏 4.2 -- PCI 总线的三种传输模式 】

文章目录 OverviewProgrammed I/O&#xff08;PIO&#xff09;Direct Memory Access (DMA)Peer-to-Peer 本文转自&#xff1a;https://blog.chinaaet.com/justlxy/p/5100053095 Overview 本文来简单地介绍一下PCI Spec规定的三种数据传输模型&#xff1a;Programmed I/O&…

抖音电商全年销售154亿单产业带商品,830个产业带销售额过亿

发布 | 大力财经 12月31日&#xff0c;抖音电商发布《直播间里的中国制造——2024抖音电商产业带发展报告》&#xff0c;全面盘点2024年全国产业带地区实体经济和中小商家在该平台的发展情况。 报告披露&#xff0c;过去一年&#xff0c;来自全国产业带地区的1.7亿款商品&…

前端页面展示本电脑的摄像头,并使用js获取摄像头列表

可以通过 JavaScript 使用 navigator.mediaDevices.enumerateDevices() 获取电脑上的摄像头列表。以下是一个示例代码&#xff0c;可以展示摄像头列表并选择进行预览。 HTML JavaScript 实现摄像头列表展示和预览 <!DOCTYPE html> <html lang"zh-CN">…