ラベル Ajax の投稿を表示しています。 すべての投稿を表示
ラベル Ajax の投稿を表示しています。 すべての投稿を表示

2021年3月3日水曜日

fetch() Ajax

// XMLHttpRequest()
function F_httprequest() {
    let req = new XMLHttpRequest();
    let url = '/' + CSVFile + '?key=' + Math.floor(Math.random() * (1 - 100) + 100);
    req.onreadystatechange = function () {
        if (req.readyState == 4 && req.status == 200) {
            let ajaxText = req.responseText;
            F_create_master(ajaxText);
            F_read_ajax(ajaxText);
        }
    }
    req.open("GET", url, true);
    req.send(null);
}

// fetch()
async function testFetch() {
    let pim = fetch('/' + CSVFile + '?key=' + Math.floor(Math.random() * (1 - 100) + 100));
    pim.then(function (msg) {
        msg.text().then(function (ajaxText) {
            console.log(TAGLine, 'step1');
            F_create_master(ajaxText);
            F_read_ajax(ajaxText);
        }).then(function () {
            console.log(TAGLine, 'step2');
        }).catch(function () {
            console.log(TAGLine, 'catch');
        })
    }).catch(function (e) {
        console.log(TAGLine, 'URLerror');
        console.log(e);
    })
}

// fetch() async await
async function testFetch() {
    let url = '/' + CSVFile + '?key=' + Math.floor(Math.random() * (1 - 100) + 100);
    let opt = {
        method: 'GET',
        headers: {
            // "Content-type": "application/x-www-form-urlencoded; charset=UTF-8",
        },
        // body: 'key=8080',
    };
    try {
        let pri = await fetch(url, opt);
        pri.headers.forEach(function (value, key) {
            console.log(key, value);
            // content - length 20949
            // content-type text/csv
            // date Fri, 05 Mar 2021 17:36:09 GMT
            // last-modified Fri, 05 Mar 2021 16:02:52 GMT
            // server SimpleHTTP/0.6 Python/3.9.0
        })
        let csvt = await pri.text();
        F_create_master(csvt);
        F_read_ajax(csvt);
    } catch (error) {
        console.log('error');
    }
}

2016年3月20日日曜日

javascript API Url 作成

javascript API Url 作成

呼び出し

lulu2.call(new link('text'));

function link(text){
    this.api_url = 'https://api.flickr.com/services/rest/?';
    this.opt = {method:'flickr.photos.search',
                api_key:'e90c9fcfd150e3811a0523e73beb86df',
                text: encodeURIComponent(text),
                sort:'relevance',     // sort:'interestingness-desc',
                privacy_filter:'public+photos',
                content_type:'photos+only',
                per_page:'30',
                format:'json',
                nojsoncallback:'1',}
  }

function lulu2(){
        var url = '';
          for(var i in this.opt){
                url = url + i + '=' + this.opt[i] +'&';
          }
        return this.api_url+url;
  }






2016年3月5日土曜日

Javascript で JSON を送信(Ajax)とPHPサーバの受信のエンコード順番

Javascript で JSON を送信(Ajax)とPHPサーバの受信のエンコード順番

Javascript 側

1.  特殊文字をエンコード
     ["] >>%22  , [&] >> %26にエンコード

2.  encodeURIComponent で 1をエンコードする。
    ["] >> %2522 ,  [&] >> %2526

3.  JSON.stringifyで送信


PHP サーバ側

1.  json_decode

2.  urldecode



確認するためのJavascript
<script type="text/javascript">
        function x(x){

        var e={};
                //データそのまま
                //NG PHP サーバー側 $_REQUEST データの所得失敗、&リンクが切れます。
                //console.info('データそのまま');
                //e.input1 = document.getElementById('input1').value;
                //e.input2 = document.getElementById('input2').value;

                //データをURLエンコード
                //NG PHP サーバー側 json_decode 失敗, " の原因でした。
                //console.info('データをencodeURIComponent');
                //e.input1 = encodeURIComponent(document.getElementById('input1').value);
                //e.input2 = encodeURIComponent(document.getElementById('input2').value);

                //データの特殊文字を%22%26にエンコード
                //NG PHP サーバー側 json_decode 失敗, " の原因でした。
                //console.info('データの特殊文字を%22%26にエンコード');
                //e.input1 = fn_replace(document.getElementById('input1').value);
                //e.input2 = fn_replace(document.getElementById('input2').value);

                //データをURLエンコード、特殊文字を%22%26にエンコード
                console.info('データをURLエンコード、特殊文字を%22%26にエンコード');
                e.input1 = encodeURIComponent(fn_replace(document.getElementById('input1').value));
                e.input2 = encodeURIComponent(fn_replace(document.getElementById('input2').value));


        console.info('#111 origi',e);
        var j = new XMLHttpRequest();
        var url ='/youtube_db/test3.php?';
        j.onreadystatechange = function(){
                if(j.readyState == 4 && j.status == 200){
                        console.info('#222 response', j.responseText);
                }
       }

        j.open('POST',url,true);
        j.setRequestHeader("Content-Type","application/x-www-form-urlencoded");

        //データをJSON.stringifyで送信
        console.info('データをJSON.stringifyで送信');
        console.info('#123 JSON.stringify',JSON.stringify(e));
        j.send('p=' + JSON.stringify(e));

        //データをそのままで送信
        //console.info('データをそのままで送信');
        //console.log('#123 json en',JSON.stringify(e))
        //j.send('p=' + e);

        function fn_replace(q){
                var x = {'&':'%26', '"':'%22'};
                for(var i in x){
                        q= q.replace(RegExp(i,'g'),x[i]);
                }
                        return q;
         }
}



//データそのまま
//NG PHP サーバー側 $_REQUEST データの所得失敗、&リンクが切れます。


//データをURLエンコード
//NG PHP サーバー側 json_decode 失敗, " の原因でした。


//データの特殊文字を%22%26にエンコード
//NG PHP サーバー側 json_decode 失敗, " の原因でした。



//データをURLエンコード、特殊文字を%22%26にエンコード



Javascript 


PHP Server

<?php
//
$x = $_REQUEST;
echo "php server\n";
echo "var_dump()\n";
var_dump($x['p']);
echo "\n";
echo "var_dump(json_decode)\n";
var_dump(json_decode($x['p']));
$temp = json_decode($x['p']);
echo "\n";
echo 'urldecode($temp->input1)'.urldecode($temp->input1);
echo "\n";
echo 'urldecode($temp->input2)'.urldecode($temp->input2);
echo "\n";
echo "\n";



echo "次は\n";
echo "URLencodeしてからjson_decode.";
echo "「\"」先にデコードされる、するとjson_decodeは NULL になります。";
echo "\n";
$y = $_REQUEST;
echo "php server\n";
echo "urldecode\n";
$temp = urldecode($y['p']);
var_dump($temp);
var_dump(json_decode($temp));


?>


'\n' >> '%0d%0a'



      function fn_replace(q){
               var x = {'&':'%26',
                           '"':'%22',
                           '\n':'%0d%0a'
                          };
                      for(var i in x){
                           q= q.replace(RegExp(i,'g'),x[i]);
                        }
                     return q;
               }















2016年2月29日月曜日

PHPサーバーに、javascript ajax でJSON を送信する際に、 「&」「"」のエンコードのメモ

PHPサーバーに、javascript ajax でJSON を送信する際に、
 「&」「"」のエンコードのメモ

他の方法があれば、教えてください。


Javascript 側送信
1.   事前に文字列を置き換

     文字列を書き換えしない場合、送信することが
     できますが PHPサーバー側「&」 リンクが切、「"」は
     文字列エラーになります。
   
     var c = '樂凡&祁隆 - 愛"你一"生';
     JSON.stringify({send:c});     << NG
     c.replace(/&/g,"%26");
     c.replace(/"/g,"%22");

2   encodeURI() でエンコードします。
     c=encodeURI(c);

2.  JSON.stringify で送信します。
   
     JSON.stringify({send:c});





PHPサーバー側受け取る

1.  json_decode で
    JSON エンコードされた文字列を受け取り、
    それを PHP の変数に変換します。

2.  urldecode で
    URL エンコードされた文字列をデコードする。

    $temp = json_decode($p);
    $a = urldecode($temp->send);