{"id":20698802,"url":"https://github.com/rwson/uploader","last_synced_at":"2026-04-22T01:01:48.552Z","repository":{"id":87105673,"uuid":"66374743","full_name":"rwson/Uploader","owner":"rwson","description":"an upload plugin,support HTML5(drag\u0026drop) and iframe","archived":false,"fork":false,"pushed_at":"2017-05-04T09:19:48.000Z","size":26,"stargazers_count":3,"open_issues_count":0,"forks_count":0,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-12-25T13:02:25.709Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/rwson.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2016-08-23T14:31:32.000Z","updated_at":"2017-03-01T05:58:27.000Z","dependencies_parsed_at":"2023-07-04T22:31:44.054Z","dependency_job_id":null,"html_url":"https://github.com/rwson/Uploader","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/rwson/Uploader","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/rwson%2FUploader","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/rwson%2FUploader/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/rwson%2FUploader/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/rwson%2FUploader/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/rwson","download_url":"https://codeload.github.com/rwson/Uploader/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/rwson%2FUploader/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":32116514,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-04-22T00:31:26.853Z","status":"ssl_error","status_checked_at":"2026-04-22T00:30:22.894Z","response_time":128,"last_error":"SSL_connect returned=1 errno=0 peeraddr=140.82.121.6:443 state=error: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-11-17T00:26:59.505Z","updated_at":"2026-04-22T01:01:48.517Z","avatar_url":"https://github.com/rwson.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"### Uploader\n\nHTML5和iframe上传插件\n\n\u003cimg src=\"Upload.png\" width=\"100px\" height=\"100px\" /\u003e\n\n---\n\n- iframe(类Ajax)上传\n\n参数:\n\n| 名称        | 意义                  | 类型                   |\n| --------- | ------------------- | -------------------- |\n| type      | 上传方法                | String(固定\"iframe\")   |\n| uploadUrl | 服务器端用于处理上传请求的地址     | String               |\n| data      | 自定义数据               | Object               |\n| timeout   | 超时时间(毫秒,-1为不指定超时时间) | Number               |\n| cssClass  | 控制样式的CSS类           | Array.\u0026lt;String\u0026gt; |\n| onStart   | 开始上传回调              | Function             |\n| onSuccess | 上传成功回调              | Function             |\n| onError   | 上传失败回调              | Function             |\n| onTimeout | 上传超时回调              | Function             |\n\n注:\n\n1. data最后会被当成input\\[type=\"hidden\"\\](key对应input的name属性,value对应input的值)提交,一旦data不为一个空对象,则需要后端来接收,否则没有意义\n\n2. onTimeout和(onSuccess/onError)互斥,只能执行其中一个或两个\n\n完整的调用例子:\n\nHTML: \n​    \n```html\n\u003cdiv\u003e\n    \u003cinput type=\"file\" name=\"file\" id=\"Uploader\" /\u003e\n\u003c/div\u003e\n```\n\nJavaScript:\n\n```javascript\nUploader(\"#Uploader\", {\n\t\"uploadUrl\": \"/upload/iframe\",\n\t\"type\": \"iframe\",\n\t\"data\": {\n\t\t\"key\": \"1\",\n\t\t\"key2\": \"1\",\n\t\t\"maxSize\": 1000\n\t},\n\t\"timeout\": 3000,\n\t\"cssClass\": [\"upload-style1\", \"upload-style2\"],\n\t\"onSuccess\": function(res) {\n\t\tconsole.log(res);\n\t\tvar img = new Image();\n\t\timg.src = res.url;\n\t\timg.onload = function() {\n\t\t\tdocument.body.appendChild(img);\n\t\t};\n\t},\n\t\"onError\": function(ex) {\n\t\tconsole.log(ex);\n\t},\n\t\"onTimeout\": function(){\n\t\talert(\"超时啦!\");\n\t}\n});\n```\n\n- HTML5(通过Ajax给后端POST表单数据,可一次性拖拽上传多个文件)上传\n\n参数:\n\n| 名称         | 意义                  | 类型                   |\n| ---------- | ------------------- | -------------------- |\n| type       | 上传方法                | String(固定\"HTML5\")    |\n| uploadUrl  | 服务器端用于处理上传请求的地址     | String               |\n| data       | 自定义数据               | Object               |\n| timeout    | 超时时间(毫秒,-1为不指定超时时间) | Number               |\n| cssClass   | 控制上传框样式的CSS类        | Array.\u0026lt;String\u0026gt; |\n| tipClass   | 控制上传提示文字样式的CSS类     | Array.\u0026lt;String\u0026gt; |\n| onStart    | 开始上传回调              | Function             |\n| onProgress | 上传中回调               | Function             |\n| onSuccess  | 上传成功回调              | Function             |\n| onError    | 上传失败回调              | Function             |\n| onLoad     | 完成回调                | Function             |\n\n注:\n\n1. data最后会被当成普通表单提交(key对应input的name属性,value对应input的值)提交,一旦data不为一个空对象,则需要后端来接收,否则没有意义\n   2.相关回调执行顺序:onStart -\u003e onProgress -\u003e onSuccess/onError -\u003e onLoad\n\n完整的调用例子:\n\nHTML: \n​    \n```html\n\u003cdiv id=\"uploadHTML5\"\u003e\u003c/div\u003e\n```\n\nJavaScript:\n\n```javascript\nUploader(\"#uploadHTML5\", {\n\t\"uploadUrl\": \"/upload/html5\",\n\t\"type\": \"HTML5\",\n\t\"data\": {\n\t\t\"test\": \"1111\",\n\t\t\"maxSize\": 1000\n\t},\n\t\"styleClass\": [\"upload-html5\"],\n\t\"tipClass\": [\"upload-tip\"],\n\t\"onSuccess\": function(res) {\n\t\tres.files.forEach(function(item) {\n\t\t\tvar img = document.createElement(\"img\");\n\t\t\timg.src = item.url;\n\t\t\tdocument.body.appendChild(img);\n\t\t});\n\t},\n\t\"onError\": function(ex) {\n\t\tconsole.log(ex);\n\t},\n\t\"onProgress\": function(ev) {\n\t\tconsole.log(ev);\n\t},\n\t\"onLoad\": function(ev) {\n\t\tconsole.log(ev);\t\n\t}\n});\n```\n\n本插件几乎不带内置CSS,可以通过配置项中的styleClass和tipClass传入具体的css类名,根据UI出的设计稿自行定义样式😄\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Frwson%2Fuploader","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Frwson%2Fuploader","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Frwson%2Fuploader/lists"}