解决IE浏览器不识别location.origin 的问题

最新推荐文章于 2024-06-05 15:13:16 发布
原创 最新推荐文章于 2024-06-05 15:13:16 发布 · 5.2k 阅读 · 0 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#浏览器 #ie

IE 不能识别location.origin的问题。。。

if (window["context"] == undefined) {
        if (!window.location.origin) {
            window.location.origin = window.location.protocol + "//" + window.location.hostname + (window.location.port ? ':' + window.location.port : '');
        }
        window["context"] = location.origin + "/V6.0";
    }
Nginx架构及配置详解
企业实战系列集 ●●● https://ximenjianxue.blog.youkuaiyun.com
09-10 6471
概述 Nginx采用C进行编写，是俄罗斯程序员开发的一款轻量级的可构建Web 服务器/反向代理服务器及电子邮件（IMAP/POP3）代理服务器的软件， Nginx服务器是一个高性能的HTTP和反向代理web服务器，同时也可提供了IMAP/POP3/SMTP服务。nginx常用作跑静态和做负载反向代理，动态php交给apache处理，因后者比较稳定，jsp交给tomcat、resin或jboss。n......
浏览器中location详解
qq_42880714的博客
08-04 2528
浏览器中location详解
JavaScript中location对象使用【详解】
sjs52406的博客
01-04 2622
本篇文章主要在于，了解并会使用JavaScript中location对象
解决：360浏览器window.location.origin显示undefined
Miss_Y0的博客
09-26 560
【代码】解决：360浏览器window.location.origin显示undefined。
location.origin兼容IE
qq_36320160的博客
10-02 513
if (window["context"] == undefined) { if (!window.location.origin) { window.location.origin = window...
解决IE低版本浏览器不支持location对象的origin属性
xm2by的博客
02-16 2646
解决IE低版本浏览器不支持location对象的origin属性 低版本的IE浏览器是不支持window.location.origin，但是支持window.location，因此可以通过window.location对象进行拼凑实现对window.location.origin的兼容，具体如下： ... if (!window.location.origin) { window.loc...
JS点击一次性下载多个文档时，360浏览器没问题，谷歌浏览器只能下载一个的解决方式
10-16
因此，我们主要还是要基于之前的知识和浏览器行为差异来解决问题。 解决方案核心：将多个下载请求序列化（即一个一个下载），并在每个下载之间加入适当的延迟，以确保浏览器有足够的时间处理每个请求。 具体...
这个是解压后的 <!DOCTYPE html> <html lang="en-US" dir="ltr"> <head> <meta charset="UTF-8" /> <meta name="version" content="BE220v1_1.11.0_2025-07-18T01:47:43.834Z" /> <meta name="ui-type" content="svr" /> <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=2,user-scalable=0" /> <meta name="apple-touch-fullscreen" content="yes" /> <meta name="apple-mobile-web-app-capable" content="yes" /> <meta name="apple-mobile-web-app-status-bar-style" content="black" /> <meta name="format-detection" content="telephone=no" /> <title>Opening...</title> <script type="module" crossorigin src="./js/index-CyuZZWKv.js"></script> <link rel="stylesheet" crossorigin href="./assets/css/style-B-M140S5.css"> </head> <body> <div id="app"></div> <script type="text/javascript"> (function handleUnsupportedBrowser() { try { // https://cn.vuejs.org/about/faq.html#what-browsers-does-vue-support const isIE = window.ActiveXObject || 'ActiveXObject' in window || /MSIE|Trident/.test(window.navigator.userAgent) const isUnsupportedBrowser = !localStorage || !localStorage.setItem || isIE if (isUnsupportedBrowser) { throw new Error('unsupported browser') } } catch (error) { location.href = './error.html' } })() </script> </body>
10-22
// 检测IE浏览器及LocalStorage支持 if (isUnsupportedBrowser) { location.href = './error.html' // 自动跳转错误页 } })() ``` #### 路由器环境优化建议 1. **资源路径修正** ```bash sed -i 's/\.\/js...
AMS跨域问题解决方案：一键实现不同域之间的内容无障碍共享
[AMS跨域问题解决方案：一键实现不同域之间的内容无障碍共享](https://www.profisea.com/wp-content/uploads/2020/05/cross-origin-resource-sharing.jpg) # 摘要 跨域问题是网络应用开发中常见的难题，对用户体验...
【CORS揭秘】：彻底解决前后端分离的跨域头疼问题
!... # 摘要 跨源资源共享（CORS）是一种重要的网络协议，它允许...在实践应用章节，本文详细描述了如何在不同前端框架和后端服务器中配置CORS，以及如何通过代理服务器解决CORS问题。最后，文章探讨了CORS进阶应用，包括
动态获取地址，window.location.origin获取不到
wwf1225的博客
06-05 3382
是一个只读属性，它返回页面的原始URL（即协议、主机和端口）。（现代浏览器如Chrome、Firefox、Safari和Edge都支持）。是一个较新的属性，可能在较旧的浏览器中不被支持。确保你的代码在页面完全加载后执行。被浏览器的安全策略或内容安全策略（CSP）阻止。对象完全加载之前执行，可能会导致无法获取到。检查是否有相关的安全策略阻止了访问。代码执行时机问题：如果你的代码在。确保使用的浏览器支持。
location.origin
Yetian_2000的博客
11-03 2948
window.location.origin这个获取url中包含了端口（域名或ip+端口），不需要再另外添加端口window.location.port
location.origin 兼容性处理
卡卡西：一个擅长拷贝的前端程序员
01-26 1605
location.origin 可以获取 当前协议 + 域名，但是低版本IE是不支持这个属性的，需要做一下兼容： let origin = window.location.origin; // protocol 当前 URL 的协议 // hostname 当前 URL 的主机名 // port 当前 URL 的端口号 if (!origin) { origin = window.location.protocol + '//' + window.location.hostname + (w.
IE8加载后台数据失败（location.origin兼容问题）
wanglufei_1992的博客
10-20 5170
在本地起了个 sever,用于ajax跟后台交互。写完页面之后，在谷歌，火狐，360相继测试一切正常。但是要求最低兼容IE8，最后就在IE8下进行测试，发现：页面根本没有加载任何后台数据。于是乎，费尽力气在IE下调试JS。奈何，JS真难调。此时，对ＩＥ８的愤怒已经到了极点。但是还得找问题。最后发现是因为，正在我JS代码中有这么一段：var basePath=""; if (window.locati
window.location.origin兼容问题
Jana Jing的分享
12-07 7074
if (!window.location.origin) { window.location.origin = window.location.protocol + "//" + window.location.hostname + (window.location.port ? ':' + window.location.port: ''); }
vue ${window.location.origin}
最新发布
11-01
在 Vue 中，`${window.location.origin}` 是 JavaScript 模板字符串的语法，结合 `window.location.origin` 属性来获取当前页面的基础 URL。`window.location.origin` 返回当前页面的协议、主机名和端口号组成的完整基础 URL（若端口是默认的 80 或 443 则省略）[^1]。 ### 使用方法 #### 在模板中使用 在 Vue 组件的模板部分，可以使用计算属性或者直接在插值表达式中引用 `window.location.origin`。 ```vue <template> <div> <!-- 直接使用 --> <p>当前页面的基础 URL 是：{{ window.location.origin }}</p> <!-- 使用计算属性 --> <p>当前页面的基础 URL（通过计算属性）是：{{ baseUrl }}</p> </div> </template> <script> export default { computed: { baseUrl() { return window.location.origin; } } }; </script> ``` #### 在方法中使用 在 Vue 组件的方法中也可以使用 `window.location.origin` 来构建 URL。 ```vue <template> <div> <button @click="goToApi">访问 API</button> </div> </template> <script> export default { methods: { goToApi() { const apiUrl = `${window.location.origin}/api/data`; // 这里可以发起 API 请求，例如使用 axios console.log('即将访问的 API URL 是：', apiUrl); } } }; </script> ``` ### 使用场景 #### 构建绝对路径 在构建指向同一域名下其他资源的绝对路径时，可以使用 `window.location.origin`。比如在开发一个多页面应用时，要从一个页面跳转到另一个页面，可以使用如下方式： ```vue <template> <div> <a :href="`${window.location.origin}/another-page`">跳转到另一个页面</a> </div> </template> ``` #### 发起 API 请求 在前后端分离的项目中，前端需要向后端 API 发送请求。使用 `window.location.origin` 可以方便地构建 API 请求的基础 URL，确保请求发送到正确的服务器。 ```vue <script> import axios from 'axios'; export default { methods: { fetchData() { const apiUrl = `${window.location.origin}/api/data`; axios.get(apiUrl) .then(response => { console.log('获取到的数据：', response.data); }) .catch(error => { console.error('请求出错：', error); }); } } }; </script> ``` #### 跨域资源加载 当需要加载同一域名下的其他资源（如图片、脚本等）时，使用 `window.location.origin` 可以确保资源加载的正确性。 ```vue <template> <div> <img :src="`${window.location.origin}/images/logo.png`" alt="Logo"> </div> </template> ```
评论 1
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
表情包 代码片
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值