{"action":"created","issue":{"url":"https://api.github.com/repos/gildata/RAIO/issues/45","repository_url":"https://api.github.com/repos/gildata/RAIO","labels_url":"https://api.github.com/repos/gildata/RAIO/issues/45/labels{/name}","comments_url":"https://api.github.com/repos/gildata/RAIO/issues/45/comments","events_url":"https://api.github.com/repos/gildata/RAIO/issues/45/events","html_url":"https://github.com/gildata/RAIO/issues/45","id":247635843,"number":45,"title":"Fetch & POST & CORS","user":{"login":"xgqfrms-GitHub","id":18028768,"avatar_url":"https://avatars3.githubusercontent.com/u/18028768?v=4","gravatar_id":"","url":"https://api.github.com/users/xgqfrms-GitHub","html_url":"https://github.com/xgqfrms-GitHub","followers_url":"https://api.github.com/users/xgqfrms-GitHub/followers","following_url":"https://api.github.com/users/xgqfrms-GitHub/following{/other_user}","gists_url":"https://api.github.com/users/xgqfrms-GitHub/gists{/gist_id}","starred_url":"https://api.github.com/users/xgqfrms-GitHub/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/xgqfrms-GitHub/subscriptions","organizations_url":"https://api.github.com/users/xgqfrms-GitHub/orgs","repos_url":"https://api.github.com/users/xgqfrms-GitHub/repos","events_url":"https://api.github.com/users/xgqfrms-GitHub/events{/privacy}","received_events_url":"https://api.github.com/users/xgqfrms-GitHub/received_events","type":"User","site_admin":false},"labels":[{"id":846840112,"url":"https://api.github.com/repos/gildata/RAIO/labels/Fetch%20&%20POST%20&%20CORS","name":"Fetch & POST & CORS","color":"70ffb5","default":false},{"id":635124911,"url":"https://api.github.com/repos/gildata/RAIO/labels/enhancement","name":"enhancement","color":"0052cc","default":true},{"id":856010050,"url":"https://api.github.com/repos/gildata/RAIO/labels/no-cors","name":"no-cors","color":"dd2182","default":false},{"id":856009457,"url":"https://api.github.com/repos/gildata/RAIO/labels/xgqfrms%20&%20CORS","name":"xgqfrms & CORS","color":"1d76db","default":false}],"state":"open","locked":true,"assignee":null,"assignees":[],"milestone":null,"comments":18,"created_at":"2017-08-03T08:53:30Z","updated_at":"2018-03-30T00:55:25Z","closed_at":null,"author_association":"COLLABORATOR","body":"# Fetch & POST & CORS\r\n\r\nhttps://github.com/gildata/RAIO/issues/49\r\n\r\n# 服务端如何开启 cors\r\n\r\nhttps://eclipse.org/jetty/\r\n\r\nhttps://enable-cors.org/server.html\r\n\r\nhttps://enable-cors.org/server_tomcat.html\r\n\r\nhttps://enable-cors.org/server_apache.html\r\n\r\nhttps://enable-cors.org/server_expressjs.html\r\n\r\n\r\n# demo\r\n\r\n```html\r\n\r\n\r\n<!DOCTYPE html>\r\n<html lang=\"en\">\r\n\r\n<head>\r\n    <meta charset=\"UTF-8\">\r\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\r\n    <meta http-equiv=\"X-UA-Compatible\" content=\"ie=edge\">\r\n    <title>POST</title>\r\n    <style>\r\n        .textarea {\r\n            min-width: 300px;\r\n            min-height: 200px;\r\n        }\r\n    </style>\r\n</head>\r\n\r\n<body>\r\n    <div>\r\n        <h1>test</h1>\r\n        <hr/>\r\n        <button id=\"click_post\">\r\n            click post\r\n        </button>\r\n        <div>\r\n            <h2>post result</h2>\r\n            <pre id=\"pre_post\">\r\n                <!-- post -->\r\n            </pre>\r\n            <textarea id=\"textarea_post\" class=\"textarea\">\r\n                <!-- post -->\r\n            </textarea>\r\n        </div>\r\n        <button id=\"click_put\">\r\n            click put\r\n        </button>\r\n        <div>\r\n            <h2>put result</h2>\r\n            <textarea id=\"textarea_put\" class=\"textarea\">\r\n                <!-- put -->\r\n            </textarea>\r\n        </div>\r\n    </div>\r\n    <script>\r\n        const url = `http://localhost:7777/datas`;\r\n        const color = `\r\n            color: green;\r\n            background: rgba(125, 125, 125, 0.7);\r\n            font-size: 23px;\r\n        `;\r\n        const err_color = `\r\n            color: red;\r\n            background: rgba(125, 125, 125, 0.7);\r\n            font-size: 23px;\r\n        `;\r\n        // Uncaught ReferenceError: postdata is not defined\r\n        // const function, not auto hoisting\r\n        const postdata = () => {\r\n            fetch(url, {\r\n                method: 'POST',\r\n                headers: {\r\n                    'Content-Type': 'application/json'\r\n                },\r\n                body: JSON.stringify({\r\n                    name: \"new-name\",\r\n                    password: \"xyz&123\"\r\n                })\r\n            });\r\n            console.log(`%c fetch post data!`, color);\r\n        };\r\n        const putdata = (id = 1) => {\r\n            fetch(`${url}/${id}`, {\r\n                method: 'PUT',\r\n                headers: {\r\n                    'Content-Type': 'application/json'\r\n                },\r\n                body: JSON.stringify({\r\n                    // id: id,\r\n                    name: \"put-new-name\",\r\n                    password: \"xyz&123\"\r\n                })\r\n            });\r\n            console.log(`%c fetch put data!`, color);\r\n        };\r\n        const getdata = (id) => {\r\n            fetch(url, {\r\n                method: 'GET'\r\n            }).then(\r\n                (response) => response.json()\r\n            ).then(\r\n                (json) => {\r\n                    console.log(`%c fetch json \\n`, color, json);\r\n                    let data = JSON.stringify(json);\r\n                    let format_data = json.map(\r\n                        (data) => {\r\n                            return (\r\n                                data + \"<br/>\"\r\n                            );\r\n                        }\r\n                    );\r\n                    // regex format\r\n                    // CodeMirror js lib\r\n                    document.querySelector(id).innerText = `loading...`;\r\n                    // mock async\r\n                    setTimeout(() => {\r\n                        document.querySelector(id).innerText = format_data;\r\n                        console.log(`% fetch format_data \\n`, color, format_data);\r\n                        document.querySelector(id).innerText = data;\r\n                        console.log(`%c fetch stringify data \\n`, color, data);\r\n                    }, 1000);\r\n                    return data;\r\n                }\r\n            ).catch(\r\n                (err) => {\r\n                    console.log(`%c Whoops, An Error occurred!`, err_color, err);\r\n                    throw new Error(\"Whoops, An Error occurred!\");\r\n                }\r\n            );\r\n        };\r\n        const btn_post = document.querySelector(\"#click_post\");\r\n        btn_post.addEventListener(\"click\", () => {\r\n            postdata();\r\n            getdata(\"#textarea_post\");\r\n            console.log(`finish post!`);\r\n        });\r\n        const btn_put = document.querySelector(\"#click_put\");\r\n        btn_put.addEventListener(\"click\", () => {\r\n            putdata(2);\r\n            getdata(\"#textarea_put\");\r\n            console.log(`finish put!`);\r\n        });\r\n    </script>\r\n</body>\r\n\r\n</html>\r\n\r\n```"},"comment":{"url":"https://api.github.com/repos/gildata/RAIO/issues/comments/377415275","html_url":"https://github.com/gildata/RAIO/issues/45#issuecomment-377415275","issue_url":"https://api.github.com/repos/gildata/RAIO/issues/45","id":377415275,"user":{"login":"xgqfrms-gildata","id":29531779,"avatar_url":"https://avatars2.githubusercontent.com/u/29531779?v=4","gravatar_id":"","url":"https://api.github.com/users/xgqfrms-gildata","html_url":"https://github.com/xgqfrms-gildata","followers_url":"https://api.github.com/users/xgqfrms-gildata/followers","following_url":"https://api.github.com/users/xgqfrms-gildata/following{/other_user}","gists_url":"https://api.github.com/users/xgqfrms-gildata/gists{/gist_id}","starred_url":"https://api.github.com/users/xgqfrms-gildata/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/xgqfrms-gildata/subscriptions","organizations_url":"https://api.github.com/users/xgqfrms-gildata/orgs","repos_url":"https://api.github.com/users/xgqfrms-gildata/repos","events_url":"https://api.github.com/users/xgqfrms-gildata/events{/privacy}","received_events_url":"https://api.github.com/users/xgqfrms-gildata/received_events","type":"User","site_admin":false},"created_at":"2018-03-30T00:55:25Z","updated_at":"2018-03-30T00:55:25Z","author_association":"COLLABORATOR","body":"# fetch & post\r\n\r\n\r\nhttps://gist.github.com/xgqfrms-gildata/3b01b5d4e9e5698058f3def689126bc2#gistcomment-2384727"}}
{"actor":{"display_login":"xgqfrms-gildata"}}