66227


独学でGASをいじっている者です。  
Webページ（会社の勤務スケジュール）のソースをGASに渡してGoogle Calendarにイベントを作成するスクリプトを使っています。  
GASへの受け渡し方法としてiOSのショートカットアプリを使用しています。内容は画像の通りです。  
[![画像の説明をここに入力](https://i.stack.imgur.com/mcEX9.jpg)](https://i.stack.imgur.com/mcEX9.jpg)  
同じ作業をブックマークレットで実現しようと下記を参考に試してみました。  
<https://q.hatena.ne.jp/1213176191>

[code]

    javascript:(
    function() {
    var code = document.body.innerHTML;
    var act = document.createElement('form');
    act.action = 'https://script.google.com/macros/s/******/exec';
    act.method = 'post';
    act.name = 'myform';
    act.id = 'myform';
    var hid = document.createElement('input');
    hid.type = 'hidden';
    hid.name = 'body';
    hid.value = code;
    act.appendChild(hid);
    document.body.appendChild(act);
    document.getElementById('myform').submit();
    }
    )();
    
[/code]

実際に使ってみた結果、POSTはできるのですが文字化けしてしまいます。  
doPostで受け取ったデータを以下のように処理したもの(html)も示します（長いので冒頭のみ。一部編集しています）。

[code]

    function doPost(e) {
      html = e.postData.getDataAsString(); // POSTされたデータを取得
    
[/code]

まずiOSショートカットによるPOST

[code]

    <html lang="ja"><head> <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <link rel="stylesheet" href="https://********" type="text/css"> <title>******</title>  </head>
    
    <body bgcolor="silver" onload="funcFirst()"> <form method="POST" action="JavaScript:btnInquire(document.forms[0])"> <center><table>
    <tbody><tr><td> <center> <tt>
    
[/code]

次にブックマークレットによるPOST。文字化けしていますが上記の<body>以降のように思われます。

[code]

    body=%0D%0A%3Cform+method%3D%22POST%22+action%3D%22JavaScript%3AbtnInquire%28document.forms%5B0%5D%29%22%
    
[/code]

iOSショートカットで"ファイル"としているため、POSTの方法に何か指定する必要があると思うのですが、具体的にどのような通信が行われているか分からないため悩んでいます。accept-
charsetやenctypeを付け加えたりもしましたが、ブックマークレット自体が作動しなかったりうまくいきませんでした。  
具体的な改善方法や、ヒントとなるキーワードでもよいのでご教示いただければと思います。  
よろしくお願いいたします。

[2020.5.21追記]  
一応の解決を見たので報告します。  
まず、上記の通りURLエンコードなしでShift-
JISで送信できていることから、文字コードの変換を目指すことにしました。GAS側をいじりたくなかったので、Bookmarklet側で文字コードを変換する方法を模索しましたが、POST送信の時にoptionをつけるとCORSに引っかかるのと、Bookmarkletに変換用のライブラリを読み込んでも良いものか判断ができなかったところ、下記の方法を発見したため試してみました。  
[JavaScript だけで Shift_JIS/EUC-JP のページから UTF-8 に変換して POST
する方法](http://otchy.net/20090416/post-utf8-charset-by-only-javascript)  
これは

> iframe を新規で作成すると、その文字コードがデフォルトで UTF-8 として処理される事を利用しています。

とのことで、そのとおりUTF-8での送信に成功し、目的は達せられました。  
ところが、同じBookmarkletをiOSのChromeで使用するとShift-JISで送信されてしまいます。

次に、GAS側で  
getDataAsString('Shift_JIS')  
が使えるとの記事を見つけたため、書き換えたところ、無事動きました。以下が最終形になります。htmlの内容は必要なタグを入れるため少し変えました。

[code]

    javascript:(
    function() {
    var code = document.documentElement.outerHTML;
    var act = document.createElement('form');
    act.action = 'https://script.google.com/macros/s/****/exec';
    act.method = 'post';
    act.name = 'myform';
    act.id = 'myform';
    act.enctype='text/plain';
    var hid = document.createElement('input');
    hid.type = 'hidden';
    hid.name = 'body';
    hid.value = code;
    act.appendChild(hid);
    document.body.appendChild(act);
    document.getElementById('myform').submit();
    }
    )();
    
[/code]


CC BY-SA 4.0
2020-04-20T04:12:21.063
65776
2020-05-21T09:22:21.767
2020-05-21T09:22:21.767
39716
39716
question
javascript google-apps-script http 文字化け
BookmarletでGASにWebページのHTMLソースをPOSTしたい


> 文字化けしていますが上記の以降のように思われます。

こちら、確認したところ文字化けではなくURLエンコーディングされているようです。  
[ツールでデコード](https://www.tagindex.com/tool/url.html)してみたところ、`<`や`>`などがエンコーディングされていることがわかります。

[code]

    body=
    <form method="POST" action="JavaScript:btnInquire(document.forms[0])"%
    
[/code]

これの原因自体は

[code]

    var code = document.body.innerHTML;
    
[/code]

の部分で取得している値が原因だと思われますので、送信する値を見直してみましょう。

また、これは助言ですが、ブックマークレット中でPOSTなどを行いたい場合、[fetch
api](https://developer.mozilla.org/ja/docs/Web/API/Fetch_API/Using_Fetch)を利用してみるのはいかがでしょうか？コード中でHTMLを生成せずに直接APIを叩く事が可能です。これは該当のブラウザでも対応しているAPIです（[Can
i use](https://caniuse.com/#search=fetch)）


CC BY-SA 4.0
2020-05-03T02:07:35.697
66227
2020-05-03T02:07:35.697
7997
65776
answer