OSS阿里云上传文件 前端js下载url跨域问题
场景:
1.后端上传文件至阿里云OSS,返回得到一个URL。
2.前端用这个URL下载文件,ajax请求异常:No 'Access-Control-Allow-Origin' header is present on the requested resource.
3.使用html <a> 标签直接可以下载
分析原因:
1.js和ajax什么的是看不见的易出错的,需要安全保护,用<a>标签是申请主动请求另外一个域名,浏览器就没有那个策略。
2.另外其实阿里云OSS也是可以配置的,有个管理页面专门可以配置跨域规则。
解决方案:
1.前端直接使用<a>标签,简单有效
2.去阿里云OSS后台管理界面设置跨域规则。(估计最终就是OSS后端接口会加上response.setHeader("Access-Control-Allow-Origin", "配置的域名");
)
3.当然还一些比较丑陋的方案:JSONP之类的等等,上网一搜一大堆。
OSS阿里云上传文件 前端js下载url跨域问题的更多相关文章
- django上课笔记7-jQuery Ajax 和 原生Ajax-伪造的Ajax-三种Ajax上传文件方法-JSONP和CORS跨域资源共享
一.jQuery Ajax 和 原生Ajax from django.conf.urls import url from django.contrib import admin from app01 ...
- vue 阿里云上传组件
vue 阿里云上传组件 Vue.js上传图片到阿里云OSS存储 测试项目git地址 本测试项目启动方法 示例链接 组件配置项 实践解释 本文主要介绍如何 在vue项目中使用web 直传方式上传阿里云o ...
- vue 百度云上传文件PostObject
百度云上传文件 API(PostObject) PostObject接口 : 接口描述 此接口使用HTML表单上传文件到指定bucket,用于实现通过浏览器上传文件到bucket.在PutObjec ...
- ajaxFileUpload上传文件后提示下载的问题
在某些版本浏览器下ajaxFileUpload上传文件会提示下载, 1:为什么? 可以观察到,即便返回 JsonResult 在返回的头中也没有任何消息体,直接理解为文本了. 2:解决方案 前端: f ...
- java后台简单从阿里云上传下载文件并通知前端以附件的形式保存
一. 首先开通阿里的OSS 服务 创建一个存储空间在新建一个Bucket 在你新建的bucket有所需的id和key 获取外网访问地址或者是内网 看个人需求 我使用的是外网(内网没用过 估计是部署到阿 ...
- Delphi阿里云对象存储OSS【支持上传文件、下载文件、删除文件、创建目录、删除目录、Bucket操作等】
作者QQ:(648437169) 点击下载➨Delphi阿里云对象存储OSS 阿里云api文档 [Delphi阿里云对象存储OSS]支持 获取Bucket列表.设置Bucket ...
- webuploader 上传文件 生成链接下载文件
最近 在asp.net MVC 项目 需要实现一个Excel和 图片上传功能.之前有使用过SWFUpload 做过上传图片功能,在本次实现过程中,有人推荐WebUploader 上传组件,因此采用we ...
- IE下AjaxForm上传文件直接提示下载的兼容性Bug
使用AjaxForm上传文件时候,在IE下直接提示下载保存: 我的示例代码: return this.Json( new { prop1 = 5, prop2 = 10 }); 这种问题只出现在IE下 ...
- IE中使用ajaxSubmit上传文件弹出下载提示框
使用jQuery的ajaxSubmit 上传文件时,在IE中会弹出下载提示框: 解决方法:让action返回String类型,而不是ActionView,
随机推荐
- VUE本身是不支持IE的,可用babel-polyfill解决
一般来说VUE本身是不支持IE的,但是可以用特殊的方法来解决,亲测可用第一步:下载插件 cnpm install --save babel-polyfill第二步:入口文件main.js引入( imp ...
- js 简版双色球 取号
<style type="text/css"> span{ display: block; float: left; width: 50px; height: 50px ...
- 解决跨域No 'Access-Control-Allow-Origin' header is present on the requested resource.
用angular发起http.get(),访问后端web API要数据,结果chrome报错:跨域了 Access to XMLHttpRequest at 'http://127.0.0.1:300 ...
- 把腾讯视频嵌入到html中
---------------------------------------------------------------------------------------------------- ...
- [Windows端口占用] 找到占用端口的进程并杀死
命令行: netstat -aon|findstr "80" 会得到类似下列的数据 TCP 0.0.0.0:80 0.0.0.0:0 LISTENING 2736 2736代表占用 ...
- mongodb ----> 从入门到。。。
环境: centos6.8,jdk1.8.0_u172,mongodb-4.0.0,spring boot-1.5.15 1.环境搭建 tar -zxvf mongodb-linux-x86_64-r ...
- C# Log4Net 日志
C#使用Log4Net记录日志 第一步:下载Log4Net 下载地址:http://logging.apache.org/log4net/download_log4net.cgi ...
- BFS 路径记录
有一迷宫 N*M,要求输出可通行的最短路径. 可以先倒着 BFS 一遍迷宫,这样 dis[] 数组储存的就是各点到迷宫终点的最短距离. 然后再从起点开始 BFS 一遍 dis[] ,只要满足 dis[ ...
- MVC实战之排球计分(六)—— 使用EF框架,创建Controller,生成数据库。
在上篇博客我们写到,此软件的数据库连接我们使用的是EF框架,code first模式下, 通过模型类,在创建controller的时候直接生成数据库,完成数据库的连接,与操作. 在使用EF框架之前,我 ...
- ios10兼容问题
var lastTouchEnd = 0; document.addEventListener('touchend', function(event) { var now = (new Date()) ...