お世話になっております。
表題についてですが、
以下の環境下でhtmlフォームからPOSTで飛ばしたJSONPをGAS側で受け取りたいのですが、
うまくいきません。どなたがご教授いただけると幸いです。
GAS 側結果
ソースコード
html
1<div id="app" v-cloak> 2 3 <form @submit.prevent="submit"> 4 5 <input type="text" name="name" v-model="name"> 6 <button type="submit">送信</button> 7 8 </form> 9 10</div> 11 12<script src="https://cdn.jsdelivr.net/npm/vue@2.5.16/dist/vue.js"></script> 13<script src="https://cdnjs.cloudflare.com/ajax/libs/url-search-params/1.1.0/url-search-params.js" integrity="sha512-XITCo00srdVr9XH7ep5JEijPPpLA60TqvvoqLCyQlIdctLUjEsIRCtlgSaoj+RbsF+e/YnkaRTV/7Ei5GvVylg==" crossorigin="anonymous"></script> 14<script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script> 15<script src="https://cdn.jsdelivr.net/npm/axios-jsonp/dist/index.min.js"></script>
javascript
1<script> 2 3new Vue({ 4 5 data : { 6 name : "" 7 }, 8 9 methods : { 10 11 submit(){ 12 13 const url = "〇〇"; 14 15 let params = new URLSearchParams() 16 params.append('name', this.name) 17 18 const config = { 19 adapter : axiosJsonpAdapter, 20 callbackParamName : "cb", 21 headers : { 22 'Content-Type' : 'application/x-www-form-urlencoded' 23 } 24 } 25 26 axios 27 .post(url, params, config) 28 .then((response) => { 29 console.log(response); 30 }) 31 .catch((err) => console.log(err)) 32 33 } 34 35 } 36 37}).$mount("#app"); 38 39</script>
GAS
1 2function doGet(e){ 3 4 for( let key in e.parameter ){ 5 6 console.log(key); 7 8 } 9 10 returnJson(e); 11} 12 13/* ---- JSONPを返す処理 ---- */ 14function returnJson(e){ 15 let return_json = JSON.stringify( 16 { 17 'header' : { 18 "Access-Control-Allow-Origin" : "*", 19 "Content-type" : "application/json; charset=UTF-8" 20 }, 21 'work' : 'success' 22 } 23 ) 24 return ContentService.createTextOutput(e.parameter.callback + '(' + return_json + ')') 25 .setMimeType(ContentService.MimeType.JAVASCRIPT) 26}
あなたの回答
tips
プレビュー