zoukankan      html  css  js  c++  java
  • 阿里云上传图片


     小程序上传可以看这个https://www.jianshu.com/writer#/notebooks/45366587/notes/68450036

    最近需要用到上传本地图片到阿里云,自己做了个demo

    <script src="http://gosspublic.alicdn.com/aliyun-oss-sdk-4.4.4.min.js"></script> //引入阿里云sdk文件
    <input type="file" id="file" /> <script type="text/javascript"> var stokeUrl = "*********"; //阿里云地址 var accessKeyId = '', accessKeySecret = '', stsToken = ''; ajax("GET", stokeUrl, function(res) { var str = JSON.parse(res); accessKeyId = str.data.accessKeyId, accessKeySecret = str.data.accessKeySecret, stsToken = str.data.securityToken; //获得权限 var client = new OSS.Wrapper({ region: 'oss-cn-hangzhou',//你自己的地址 accessKeyId: accessKeyId, accessKeySecret: accessKeySecret, stsToken: stsToken, bucket: '*****'//文件名称 }); document.getElementById('file').addEventListener('change', function(e) { var file = e.target.files[0]; console.log(e); var storeAs = 'upload-file'; //图片名 storeAs = 'test/'+file.name //所要上传的文件名拼接 (test/) console.log(storeAs); client.multipartUpload(storeAs, file).then(function(result) { console.log("上传成功"); console.log(result); //获得图片地址 var src = 'https://www.treeholeapp.com/' + result.name; $("#img").attr('src', src);//赋值给img元素 }).catch(function(err) { console.log("上传失败"); console.log(err); }); }); }) function ajax(type, url, fnSucc, fnFaild) { //1.创建Ajax对象 var oAjax = null; if(window.XMLHttpRequest) { oAjax = new XMLHttpRequest(); } else { oAjax = new ActiveXObject("Microsoft.XMLHTTP"); } //2.连接服务器 oAjax.open(type, url, true); //3.发送请求 oAjax.send(); //4.接收服务器的返回 oAjax.onreadystatechange = function() { if(oAjax.readyState == 4) //完成 { if(oAjax.status == 200) //成功 { fnSucc(oAjax.responseText); } else { if(fnFaild) fnFaild(oAjax.status); } } }; } </script>

      阿里云上传到服务器主要步骤就是请求权限 ajax请求上传

    其实到这里基本结束了,但是你会发现,提交的时候会产生:  No 'Access-Control-Allow-Origin' header is present on the requested resource. 跨域请求,这时需要检查你的阿里云服务器设置请求头,具体参考阿里云OSS跨域,会有设置的API

  • 相关阅读:
    Hibernate: Encountered a duplicated sql alias [] during auto-discovery of a native-sq
    “Uncaught TypeError: string is not a function”
    Jquery Ajax 返回数据类型变成document
    浏览器URL编码
    SQL Server 多条查询结果组合
    (转)No row with the given identifier exists问题的解决
    观nginx与lvs负载均衡的较量
    Nginx启动、关闭、重新加载脚本
    数据挖掘-分词入门
    HBase 专题技术收录
  • 原文地址:https://www.cnblogs.com/simba-lkj/p/6594691.html
Copyright © 2011-2022 走看看