かもメモ

自分の落ちた落とし穴に何度も落ちる人のメモ帳

Ajax

JavaScript Fetch でステータスコードを使ってエラーハンドリングしたい

Next.js の api を使って非同期処理のモックを作っていて Fetch API だとステータスコードが 200 系以外でもエラーが発生しないみたいだったのでステータスコードでエラーハンドリングできるようにしたメモ 環境 node.js v18.14.0 Next.js 13.2.4 React 18.2…

JavaScript async / await で並行処理

前回のあらすじ 直列処理 async / await 、非同期処理を順番に実行(直列処理)を簡単に書くことができます。 async function sleepSquareFunc(x) { return new Promise((resolve, reject) => { setTimeout(() => { resolve( x * x ); }, 1000); }); } async f…

JavaScript 今更の async / await

async function は Promose を返す returnすると返される値がPromise.resolveされる throwすると値や例外がPromise.rejectされる 何も返さないと関数終了時にundefinedがreturn(resolove)される // return = Promise.resolve() async function resolveFunc()…

Node.jsでFetchAPIを使いたい

node v11.4.0 fetchを使ったJavaScriptファイルをnodeの実行しようとしたらfetchなんて無いよってエラーになりました。 node.jsには現状デフォルトでFetchAPIが入っていないようです。 node-fetch を使う $ yarn add node-fetch JavaScriptファイルでnode-fe…

Ajax (XHR) まわりいろいろ試してみた。

jQueryの$.ajax, XMLHttpRequest, FetchAPI, axios, superagentを簡単に試してみた

Fetch API 試してみた。

恥ずかしながらFetchAPIたるものがあるのを知らなかったので、ざっくり試してみた。 Fetch API Service Workersでも使えて、プレーンなJavaScriptのXMLHttpRequestより強力で柔軟な操作ができるそうです。 GET fetch(api_url, {method: 'GET'}) .then((res) …

PHP / JavaScript ファイル生成してDLさせたいけどmax_input_varsにかかってしまう問題にパワープレイで立ち向かった話

PHP製の管理ツールで、CSVを生成してDLするシステムを作っていました。 データ量が多いとエラーになるということで調べたら、PHPのmax_input_varsにかかって居るのが原因でした。 そして、使っているサーバーがhetemlでmax_input_varsの上限を変えることが出…

Ajaxを使ってWordPressからコンテンツを取得したい。

WordPress製のサイトに独自のコンテンツなどを取得できるAjaxを作成する方法のメモ 1. 呼び出すアクション名を決める 2. Ajaxの送信先をjsから使えるように出力する 3. Ajaxで呼び出される関数を作成する (PHP) 4. フロントからAjaxでの呼出しを作成する (ja…

PHP Slim 2.x Ajaxでputで送った値を取得したい。

"Slim is a PHP micro-framework" Rubyのテンプレートエンジンじゃない娘のお話です。 3系が既に出ているのですが、先方のサーバーのPHPのバージョンの関係で2系で開発をしています。今回 Ajaxのputメソッドでデータを送ったのですが、Slim側で値をとるのに…

jQuery.whenのdone()にAjaxで取得したデータを加工して渡したい

$.when()で複数の非同期処理を行って、.done()で結果を受け取ってその後の処理をするのですが、特に非同期処理がAjaxの時、$.when()の.done()でAjaxで取得できた値を受け取って加工するのではなく、Ajax側で取得したデータを加工して$.when()のdone()に渡し…

jQuery Ajaxでファイルを送りたい!

input[type="file"]をAjaxで送信したい時 普通にAjaxを使って送ると、ファイルが文字列になってしまい form.submit()した時と違うのでハマったのでメモ。どうやら FormData を使い Ajaxが自動的に送信データを整形する機能をOFFにすれば form.submit()と同じ…