並び順

ブックマーク数

期間指定

  • から
  • まで

1 - 40 件 / 45件

新着順 人気順

axiosの検索結果1 - 40 件 / 45件

axiosに関するエントリは45件あります。 javascriptJavaScriptapi などが関連タグです。 人気エントリには 『【Vue.js】Web API通信のデザインパターン (個人的ベストプラクティス) - Qiita』などがあります。
  • 【Vue.js】Web API通信のデザインパターン (個人的ベストプラクティス) - Qiita

    はじめに Vue.jsを使用したアプリケーションでのWeb API呼び出しのデザインパターンについて調べてみました。 しかし検索して出てくるチュートリアルやサンプルは、コンポーネント内でaxiosをインスタンス化していたり、Vuexの中でaxiosを使用するというサンプルがほとんどでした。 しかし実際のプロダクトでこれをしてしまうと コンポーネント内でAPIアクセスの直書きによって単体テストが困難に Vuex(actions)の肥大化(使い回さない処理はStoreに記述しないほうがいいとする文献もある) API通信部分をPureJSでモジュール化しても依存度がイマイチ下がらない(コンポーネントでモジュールをインポートするため)。 などなど問題になることが多そうでした。 ある日、Jorge氏が投稿した「Vue API calls in a smart way」という記事にたどり着きました。

      【Vue.js】Web API通信のデザインパターン (個人的ベストプラクティス) - Qiita
    • すぐにAPIを体験!public-apis 100以上のJavaScript axiosサンプル集

      はじめに このページは、プロトアウトスタジオのAPIにつなげる授業に関連して、よりAPIの多様さ、広がりを深掘りします。 まだ、JavaScriptに慣れていなくても「なるべくシンプルにAPIを体験する」ことを目指して、 public-apis というフリーで使えるAPIを集めてリストにしているサイトから、手順が少なくAPIにつなげられるシンプルに取得できるものを中心に、直接取得できるURL・Node.js axios await/async ソースコードを一つ一つトライしています。 慣れてきたら、自分で public-apis のサイトを直接読んでみて、巡ってみましょう! APIピックアップ数 最終更新日 2020/6/8 104 個のAPIをピックアップ中! 参考資料 public-apis の豊富なAPIリストをベースにAPIつなげていきます。 ピックアップルール 手順が少なくAPI

        すぐにAPIを体験!public-apis 100以上のJavaScript axiosサンプル集
      • まだAPIが出来ていない?私は一向にかまわんッッ

        初記事です。 あるフロントエンドの悩み プロジェクトの納期は決まっていて、すぐに着手しないといけない。 だけど、API はまだできていない... 早く着手したい...、ふぬぬ...。 今回はそんなフロントエンドがバックエンドのタスクの待ちにならないように、並行してアジャイルに開発していけるツールとしてmswをご紹介します。 mswとは? mswとはmock service workerの略で、簡単にモックのAPIを立てることができるライブラリです。 同様のことができるライブラリとしてJSON Serverもありますが、mswには以下の利点があります。 単純にJSONを返すのではなく、ロジックも書くことができる Expressのようにスッキリ書くことができる RESTだけでなく、GraphQLにも対応している 以下のようなケースに向いていると思います。 早く着手しないといけないけど、API

          まだAPIが出来ていない?私は一向にかまわんッッ
        • Axios 使うのやめたらビルドサイズが 10 KB 減って、なんか知らんがパフォーマンスも良くなった話

          この記事について Zenn では長らく通信処理に Axios を使っていました。 しかし、Fetch API が多くのモダンブラウザなどで普通に使えるようになった今、使う必要性があまり無くなったため、Axios を使っている処理を全て Fetch API に置き換えることになりました。 この記事では、その置き換え作業をどう進めていったのか、その結果どう良くなったのかを解説していこうと思います 🗽 解説より置き換えた結果を知りたいのよ私は!!! って方が居るかと思いますので、最初に置き換えたことで良くなった部分を紹介しようと思います。 まず一番良くなったところといえば、ずばりサイト全体のビルドサイズが 10 KB も減りました。( ちなみに、10 KB は圧縮時のサイズで、圧縮しない場合 100 KB になります 😇 ワーオ ) グローバルのビルドサイズが 103.35KB gzip 時

            Axios 使うのやめたらビルドサイズが 10 KB 減って、なんか知らんがパフォーマンスも良くなった話
          • APIのコードを自動生成させたいだけならgRPCでなくてもよくない? - エムスリーテックブログ

            こんにちは、エンジニアリンググループの福林 (@fukubaya) です。 先月から、今年の秋くらいにリリース予定の新サービスの設計、開発を始めました。 せっかく新しく始めるサービスなので、まだ経験したことがない言語やフレームワーク、技術を使わないと楽しくありません。 そこで、バックエンドにGoにして、フロントのAPIまで含めてgRPCの .proto ファイルで定義を一元化し、APIコードは protoc で生成させる計画を立てていたのですが、 フロントでgRPCとなると、 gRPC-web か grpc-gateway になるが、リリースまでに使える期間では認証も含めると検証が間に合わなさそう Goだけでなく、terraform(インフラ設計もやります) も Vue.jsも今回が初めて、というメンバーもおり、さらにRESTではなくgRPCも、となると未経験技術が多すぎてキャッチアップが

              APIのコードを自動生成させたいだけならgRPCでなくてもよくない? - エムスリーテックブログ
            • Safe Data Fetching in Modern JavaScript

              How to Build: Visually Building with AI webinar today @ 10 am PST. Register Now

                Safe Data Fetching in Modern JavaScript
              • Project dead? · Issue #3930 · axios/axios

                You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session. Dismiss alert

                  Project dead? · Issue #3930 · axios/axios
                • OpenAPI Generator + TypeScript で始める自動生成の型に守られた豊かなクライアント生活 | GiFT(ギフト)株式会社

                  OpenAPI Generator + TypeScript で始める自動生成の型に守られた豊かなクライアント生活2020.02.28 OpenAPIをドキュメントだけでなく、Schema firstな開発に利用しようということで、TypeScript + OpenAPI Generatorでフロントエンドの開発をしました。 Vue, Nuxtで使う際の例と共にその内容を紹介します。 目次OpenAPIでドキュメントを書くメリットなどOpenAPI GeneratorでClient情報を吐き出すVue, Nuxtで利用するAPIの変更に追従しやすく、型もあるし幸せOpenAPIでドキュメントを書くメリットなど弊社では以下のブログでも書いているように、API仕様のドキュメント化にOpenAPIを活用しています。 committee×OpenAPI×RailsでスキーマファーストなAPI開発O

                    OpenAPI Generator + TypeScript で始める自動生成の型に守られた豊かなクライアント生活 | GiFT(ギフト)株式会社
                  • 【OpenAPI】APIスキーマから勝手に型がつくaxiosを作って幸せになる【openapi-typescript】

                    はじめに axiosの型付けはどうやらそれなりに頭を悩ませる課題のようです。 実際にuhyo氏のTwitterでのTypeScriptコミュニティにて以下のような質問がありました。 私もaxiosの型付けに悩まされた一人です。 最近それなりに幸せに型付けできる方法が整理できたので、自身の備忘録も兼ねてまとめます。 前提として、openapiファイルが用意されていることとします。 コード例は下記レポジトリに配置しております。 幸せになるとは何か 結論から言うと次のような型の補完が効き、かつ型安全なaxiosのrequest APIのカスタムAPIを作る事です。 URLパスの補完が効いていて、 実装されているHTTPメソッドの補完も効いており、 パラメータの型も補完され、 レスポンスの型も手に入るrequest APIです。 見た目上は、request APIですので、axiosのドキュメント

                      【OpenAPI】APIスキーマから勝手に型がつくaxiosを作って幸せになる【openapi-typescript】
                    • GitHub - developit/redaxios: The Axios API, as an 800 byte Fetch wrapper.

                      A tag already exists with the provided branch name. Many Git commands accept both tag and branch names, so creating this branch may cause unexpected behavior. Are you sure you want to create this branch?

                        GitHub - developit/redaxios: The Axios API, as an 800 byte Fetch wrapper.
                      • Jestでテストを書こう!

                        はじめに はじめまして。 エンジニアのtaptappunです。 我々は普段からビットコインという「お金」を扱ったサービスを開発しています。 そのため、日々バグをなくす努力をしており、その一つとして自動テスト(CI)を導入しています。 ビットバンクでは普段、Node.js(TypeScript)を用いて開発しています。 今回はNode.jsのテストフレームワークであるJestを利用したテストの導入方法と実践的なテストの書き方について紹介していきます。 Jestについて Jestは、Facebookが開発を進めている、オープンソースのJavaScriptのテストフレームワークです。 Jest(Github) TypeScriptで記述したものでも利用できます。 テストフレームワークであるため、テストを書くために必要な一通りの機能が提供されています。 弊社ではTypeScriptで記述したテスト

                          Jestでテストを書こう!
                        • Release v1.0.0 · axios/axios

                          Added Added stack trace to AxiosError #4624 Add AxiosError to AxiosStatic #4654 Replaced Rollup as our build runner #4596 Added generic TS types for the exposed toFormData helper #4668 Added listen callback function #4096 Added instructions for installing using PNPM #4207 Added generic AxiosAbortSignal TS interface to avoid importing AbortController polyfill #4229 Added axios-url-template in ECOSY

                            Release v1.0.0 · axios/axios
                          • React Hooksでデータを取得する方法 - Qiita

                            Robin Wieruch氏によるHow to fetch data with React Hooks?を著者の許可を得て意訳しました。 誤りやより良い表現などがあればご指摘頂けると助かります。 原文: https://www.robinwieruch.de/react-hooks-fetch-data/ このチュートリアルでは、ステートフックと副作用フックでデータを取得する方法を解説します。テック系の人気記事を取得するためによく使われるHacker News APIを利用します。また、アプリケーション内の任意の場所で再利用したり、スタンドアロンのnodeパッケージとしてnpmに公開したりできるデータ取得用のカスタムフックも実装します。 React のこの新機能が初見であれば、まずReact Hooks入門に目を通してください。完成したプロジェクトでReact Hoos でのデータ取得事例

                              React Hooksでデータを取得する方法 - Qiita
                            • すぐにAPIを体験!public-apis 100以上のJavaScript axiosサンプル集

                              はじめに このページは、プロトアウトスタジオのAPIにつなげる授業に関連して、よりAPIの多様さ、広がりを深掘りします。 まだ、JavaScriptに慣れていなくても「なるべくシンプルにAPIを体験する」ことを目指して、 public-apis というフリーで使えるAPIを集めてリストにしているサイトから、手順が少なくAPIにつなげられるシンプルに取得できるものを中心に、直接取得できるURL・Node.js axios await/async ソースコードを一つ一つトライしています。 慣れてきたら、自分で public-apis のサイトを直接読んでみて、巡ってみましょう! APIピックアップ数 最終更新日 2020/6/8 104 個のAPIをピックアップ中! 参考資料 public-apis の豊富なAPIリストをベースにAPIつなげていきます。 ピックアップルール 手順が少なくAPI

                                すぐにAPIを体験!public-apis 100以上のJavaScript axiosサンプル集
                              • React メジャーなパッケージを使った開発とテストのチュートリアル

                                有名どころのReact Query、React Hook Form、Redux Toolkitを使ってシンプルなアプリを作る。 APIへのリクエストに関する状態管理をReact Queryで、フォームの入力状態の管理をReact Hook Formで、アプリの状態管理(ユーザーのログイン状態など)をRedux Toolkitで行う。APIクライアントにはaxiosを使用する。また、テストではReact Testing LibraryとMSW(Mock Service Worker)を使用する。 react18.2、react-query3.39、react-redux8.0で検証 ログイン画面とユーザーの一覧を表示する画面の2つをもつアプリを作る。また、ユーザー一覧はログインしていること、ログイン画面はログインしていないことという条件の表示制御をもうける。 プロジェクトの作成 create

                                  React メジャーなパッケージを使った開発とテストのチュートリアル
                                • CORS: OPTIONSリクエスト(preflight request)を避ける - Qiita

                                  ajaxなど、ブラウザ経由でGET, POST, DELETEリクエストを投げると、実際のリクエストが走る前にOPTIONSリクエストが送信されることがあります。 一度しかリクエストを送信していなくても、実際はOPTIONSとGETなど、2回リクエストが走っています。 APIによっては、OPTIONSリクエストを受け付けないため、Response to preflight request doesn't pass access control checkのようなエラーが返ってくる場合があります。このOPTIONSリクエストはCORSプリフライト(preflight requests)と呼ばれていて、これが通らないと、実際のGET, POST, DELETEなどのリクエストは送信されません。 このプリフライト・リクエストとは何なのか、OPTIONSリクエストを回避する方法はあるのか調べてみま

                                    CORS: OPTIONSリクエスト(preflight request)を避ける - Qiita
                                  • RESTfulな「axios-mock-server」の使い方 - Qiita

                                    axios-mock-serverとは フロントエンドの開発体験を向上させ、生産性を格段に高めるために作られたTypeScript製のモックサーバーです。 axios専用ではあるものの、JSON Serverよりも遥かに手軽にRESTfulなモック環境を構築出来ます。 GET/POST/PUT/DELETEのAPIエンドポイントを数行で作成できる サーバーを立てないので静的なJSファイルに出力してブラウザ単体でも動かせる TypeScript対応 Node環境のaxiosでも動く Nuxt.js同様のオートルーティング機能でパス記述が不要 IE11対応(>= v0.13.1) axios-mock-server - GitHub この記事はやたら長いので以下の入門記事から読むのをおススメします。 秒でaxiosをモックするnpmモジュールの入門サンプル Nuxt.jsのaxiosを秒でモッ

                                      RESTfulな「axios-mock-server」の使い方 - Qiita
                                    • 【Ajax】axiosを使って簡単にHTTP通信 | Will Style Inc.|神戸にあるウェブ制作会社

                                      こんにちは、CTOの奥田です。 新年あけましておめでとうございます。 昨年もたくさんの方にブログをご覧いただき、ありがとうございました。 本年も気を引き締めてより一層良い制作ができるよう努めてまいります。 2020年もどうぞよろしくお願いいたします。 さて2020年1発目のブログはaxiosについてです。 昨今のWebサイトは非同期でアレコレするのが当たり前になっています。 axiosを使えば簡単に非同期処理を実装することができます。 今回はそんなaxiosについてご説明したいと思います。 Table of contentsaxiosとはインストールGET通信POST通信エラーハンドリングaxios APIを使用するさいごにaxiosとはaxiosとはブラウザやnode.js上で動くPromiseベースのHTTPクライアントです。 jQueryで言うところのjQuery.ajaxであり、非

                                        【Ajax】axiosを使って簡単にHTTP通信 | Will Style Inc.|神戸にあるウェブ制作会社
                                      • vue.jsを使ってaxiosを学ぶ | アールエフェクト

                                        CDNを利用するとブラウザのコンソールに”You are running a development build of Vue. Make sure to use the production build (*.prod.js) when deploying for production.”メッセージが表示されます。 Vue2の場合 <!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <title>vueを使ってaxiosを学ぶ</title> </head> <body> <div id="app"> <h1>{{ message }}</h1> </div> <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> <script s

                                          vue.jsを使ってaxiosを学ぶ | アールエフェクト
                                        • Why JavaScript Developers Should Prefer Axios Over Fetch

                                          Photo by Brixiv from PexelsIn my previous article, “Deep Insights Into JavaScript’s Fetch API”, I discussed the basics of the Fetch API. But it’s worth acknowledging that fetch() isn’t consistently an ideal solution, and there are sometimes better…

                                            Why JavaScript Developers Should Prefer Axios Over Fetch
                                          • axiosの使い方まとめ (GET/POST/例外処理)

                                            最近何かとよく使うJavaScriptでAJAX通信を行うaxiosについて、簡単に使い方をまとめました。 スポンサーリンク GETリクエストをaxiosで送る まずはGETリクエストをaxiosで送る方法です。 const res = await axios.get('/users') console.log(res.data) 分割代入の記法を使うと、以下のようにも書けます const {data} = await axios.get('/users') console.log(data) クエリパラメータ (URLパラメータ)を指定 クエリパラメータを指定する方法は2つあります。 1つ目は、axios.getに指定するURLに直接記述する方法です。 axios.get('/user?id=123') 2つめは、axios.getの第2引数に、オプション指定する方法です。 axios.

                                              axiosの使い方まとめ (GET/POST/例外処理)
                                            • 【リソース取得APIの比較】fetchとaxiosの4つの相違点

                                              fetchとaxiosはどちらも外部リソースを取得するためのライブラリーで非同期で動くためPromise型を返します。 似ているライブラリーですが、主に4つの違いがあるのでそれぞれを解説してきます。 インストール方法 HTTPメソッド通信 JSONデータの取得方法 エラーハンドリング 1.インストール方法 fetchはブラウザの標準ライブラリーでインストールせずに使うことができます。 一方、axiosはインストールが必要です。以下のコマンドで取り込むことができます。 yarn add axios npm install axios そして、モジュールのインポートも必要です。 import axios from "axios" 2.HTTPメソッド通信 HTTPメソッド通信毎の呼び出し方がfetchとaxiosで異なります。 fetchによるPOST通信 fetchでPOST通信を行う際は第

                                                【リソース取得APIの比較】fetchとaxiosの4つの相違点
                                              • あの日見たaxiosの機能を僕達はまだ知らない。

                                                あの日見たaxiosの機能を僕達はまだ知らない。 2021.08.28 axiosは、JavaScriptにおけるHTTPクライアントのデファクトスタンダードといえるでしょう。 Promiseベースで非同期通信を行えるHTTPクライアントとして、ブラウザ標準のfatchやjQuery.ajaxなどがありますが、特にaxiosがよく使われているのには豊富なオプションや設定に理由付けられるでしょう。 axiosの機能について私のように詳しくなくても直感的にHTTPリクエストを送れるのも良い点の1つですが、せっかくなのでaxiosでどのようなことができるのがを見ていきましょう。 axiosは、JavaScript における HTTP クライアントのデファクトスタンダードといえるでしょう。 Promise ベースで非同期通信を行える HTTP クライアントとして、ブラウザ標準のfatchやjQue

                                                  あの日見たaxiosの機能を僕達はまだ知らない。
                                                • [TypeScript] Axiosのtry/catchでの例外オブジェクトを型付けする | DevelopersIO

                                                  こんにちは、CX事業本部 IoT事業部の若槻です。 今回は、静的型付け言語TypeScriptでAxiosのtry/catchでの例外オブジェクトを型付けする方法を確認してみました。 Axiosのtry/catchでの例外オブジェクトで型エラーが発生する AxiosでAPIエンドポイントなどへリクエストをする際に、Try/Catch構文でエラーをキャッチしたら、ステータスコードなどに応じた処理を実装したい場合があります。 import Axios from 'axios'; export const useGetData = async () => { try { const response = await Axios.get(`path/to/data`, { headers: { 'Content-Type': 'application/json', }, }); return re

                                                    [TypeScript] Axiosのtry/catchでの例外オブジェクトを型付けする | DevelopersIO
                                                  • TypeScript × Jest で axios のモックを作りテストを実施する - Qiita

                                                    はじめに TypeScript で Jest のモック機能を使おうとしたら、ハマりました。。。 解決方法を見つけたのでメモします。 対象読者 TypeScript の知識をある程度持っている Jest を TypeScript で実行できる環境がある 環境 node.js, 8.10.x typescript, 3.2.x axios, 0.18.x jest, 23.6.x ts-jest, 23.10.x macOS X El Capitan テスト対象 ソース import axios from 'axios'; export async function main() { try { const { data } = await axios.get('{YOUR-API-ENDPOINT}'); return data; // { message: "Real response!"

                                                      TypeScript × Jest で axios のモックを作りテストを実施する - Qiita
                                                    • axiosのget,post,deleteメソッド - Qiita

                                                      はじめに Node.jsを使う際に、標準のfetch API以外、requestモジュール、axiosのモジュールはよく使います。 書き方はGithubのページに書いてありますが、よくGoogle先生に聞く場合も多いです。 やはりオフィシャルに記載した情報は一番ですね。 axios: https://github.com/axios/axios request: https://github.com/request/request axiosのget,post,deleteメソッドを簡単に説明します。 Expressのパラメータの取得方法 まずサーバ側の情報を取得する仕組みを確認します。 Express.jsのリクエストAPI:https://expressjs.com/ja/api.html#req 1. headers // access_token: xxxxxxxxxxxx con

                                                        axiosのget,post,deleteメソッド - Qiita
                                                      • axiosのerror handling - Qiita

                                                        はじめに JavaScript(Node.js)でHTTP通信をする上で便利なライブラリであるaxiosであるが、そのエラーハンドリングで躓いた。 また、axiosのエラーハンドリング(axios error handling)でググってもconsole.log()で出力させているようなものばかりで実際にプロダクトでは(個人開発のちょっとしたやつでも)使えなさそう1なものが多くヒットしたので、自身で開発する中で学んだ事を備忘録として残しておく。 ※中にはerror.resposeをすればよいというものもあり、その覚え方ではマズいのでそこもちゃんと整理したい。 ※axiosの関連ライブラリとして、request/responseのオブジェクトのキーのケース変換を行うライブラリを公開したので、そちらも見ていただけると嬉しいです。 axiosとは axiosの仕組みを少し見てみる事で、axios

                                                          axiosのerror handling - Qiita
                                                        • axiosのmaxContentLengthの脆弱性について(2019/05/31) - Qiita

                                                          先に結論 axiosを使ってる人は脆弱性があるのでv0.18.1以降に上げましょう axiosを使っていない人は関係ないのでブラウザバックして大丈夫です。 axiosはJavaScriptのメジャーな通信系のライブラリです。 xhrで実装されているため、レガシーなブラウザやマルチブラウザに対応しています。 https://github.com/axios/axios GitHub上でセキュリティアラートが・・・ GitHub上でセキュリティアラートが上がっていました。(2019/05/30確認時点) どうゆう脆弱性? Axios up to and including 0.18.0 allows attackers to cause a denial of service (application crash) by continuing to accepting content afte

                                                            axiosのmaxContentLengthの脆弱性について(2019/05/31) - Qiita
                                                          • Vue.jsとAPIサーバとのaxiosでCORSに引っかかった時のProxyを使った回避方法 - Qiita

                                                            Help us understand the problem. What are the problem?

                                                              Vue.jsとAPIサーバとのaxiosでCORSに引っかかった時のProxyを使った回避方法 - Qiita
                                                            • GitHub - simoneb/axios-hooks: 🦆 React hooks for axios

                                                              A tag already exists with the provided branch name. Many Git commands accept both tag and branch names, so creating this branch may cause unexpected behavior. Are you sure you want to create this branch?

                                                                GitHub - simoneb/axios-hooks: 🦆 React hooks for axios
                                                              • axiosでJSONを取得する[Vue.js]

                                                                HTTPクライアントであるaxiosモジュールを利用して、Vue.jsにおいてJSONデータを取得してみます。 JSONのモックデータを提供するサービスであるJSONPlaceholderを利用します。 以下リンクで取得できるデータにおいて、userIdが1のデータをGETによって取得してみます。 https://jsonplaceholder.typicode.com/todos [ { "userId": 1, "id": 1, "title": "delectus aut autem", "completed": false }, { "userId": 1, "id": 2, "title": "quis ut nam facilis et officia qui", "completed": false }, …省略

                                                                • 【CORS】クロスドメインによるエラーを解決する

                                                                  JavascriptのXMLHttpRequestを実装した時に以下のようなエラーに出くわしたことはないでしょうか。 Access to XMLHttpRequest at 'https://... ' from origin 'http://... ' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource このエラーはドメインが違うサイトにリクエストを送った時に、「あなたのサイトからのリクエストは許可していません。」とリクエストが跳ね返された時に起こります。 このエラーの原因はCORSというものなのですが、「理由はいいから、早く解決したい!」という方のために、なぜ違うサイト同士の通信ができないのかはまた後でお話します。 じゃ

                                                                    【CORS】クロスドメインによるエラーを解決する
                                                                  • Axios Wrappers in React Typescript

                                                                    So I recently had to make some changes to a React code base that was fairly unfamiliar to me. My task was to make a PUT API request to an external endpoint, in order to update a user profile upon a certain state being toggled on. It seemed like an easy enough task as I knew I could just tap into the installed axios package to make API calls... until I opened up the code repo and saw abstraction up

                                                                      Axios Wrappers in React Typescript
                                                                    • GitHub - BetterTyped/hyper-fetch: ⚡ Fetching and realtime data exchange framework.

                                                                      You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session. Dismiss alert

                                                                        GitHub - BetterTyped/hyper-fetch: ⚡ Fetching and realtime data exchange framework.
                                                                      • コールバック、Promise、async/awaitについて | Vue Metaru

                                                                        制作会社のコーダーとして働いていた頃は、非同期プログラミングを使う機会が少なく、 簡単なアニメーションであれば、setTimeout、ユーザーからのイベントでなんとかなってました。 簡単な$.ajaxか、サイト内検索にMTのAPIを使用した時に、jQueryのDeferredオブジェクトを使ったくらいですね。 おじさんが若い時はね$.ajax()のオプションでsuccessとかerrorとか指定していたんだよ(追憶) - Qiita Vue使ってプログラミングをしていると、APIからデータを持ってきたいことが多く、 このタイミングでJavaScriptの非同期をしっかり学びたいと思います。 # 非同期の定番コールバックPromiseasync/awaitasync/awaitもPromiseを利用しているため、Promise自体の理解は必須です。 Promiseもコールバックを使って非同期

                                                                        • vue.js と axios を使って Web API にアクセスする | エクセルソフト ブログ

                                                                          こんにちは。エクセルソフトの田淵です。 この前は MySQL を使った DB のコンテナーを作りました。 CData API Server を使えばすぐに MySQL から API が作れるので、今度はその API にアクセスするフロントエンドを作ってみましょう。 ただ、私は Web フロントエンドには全く詳しくないので、Vuejs-jp が日本マイクロソフトが開催した de:code 2019 のイベントで公開してくれた Vue.js 初心者向けハンズオン – Visual Studio Code, TypeScript, Element 編 をベースにやっていきたいと思います。 またきちんと理解できていないので、メモ書きになってしまっている点はご容赦ください。 vue cli を使う Lab 0 – 開発環境の準備 そのままなのですが、 npm install -g @vue/cli

                                                                          • 【Nxut.js】axiosの初期設定を行う(baseURL・browserBaseURLを解説) - 独学プログラマ

                                                                            2020.06.23に公開 Udemy 5. RailsAPI×Nuxt.js初めてのAPI通信 No.2 / 3 今回達成すること API通信をするaxios(アクシオス)モジュールの設定を行い、 Nuxt.jsのトップページにAPIリクエストを送るボタンを設置します。 完走するとhttp://localhost:8080に、このようなボタンが表示されます。 ※ この記事ではNuxt.js(frontディレクトリ内)のファイルを編集します。 axiosのインストールを確認する 手順通りに進んできた方はpackage.jsonに@nuxtjs/axiosモジュールがインストールされていると思います。 front/package.json ... "dependencies": { "nuxt": "^2.0.0", "@nuxtjs/axios": "^5.3.6" }, もし見当たらない

                                                                              【Nxut.js】axiosの初期設定を行う(baseURL・browserBaseURLを解説) - 独学プログラマ
                                                                            • Nuxt.jsにおけるaxiosライブラリ、asyncData Hookの使い方 | アールエフェクト

                                                                              Nuxt.jsでもVue.jsで同様にaxiosを利用することで外部からデータを取得することができます。外部からのデータ取得はアプリケーションを構築する上で表示に重要な部分なので本文書ではNuxt.jsにおけるaxiosの使い方とasyncDataの使い方について説明を行っています。 Nuxt.jsではサーバサイドでデータを取得する際はasyncData Hookまたはfetch Hookの中にデータを取得する処理を記述します。クライアントサイドでデータを取得する際にはmounted Hookの中にデータを取得する処理を記述します。 fetch HookはJavaScriptのfetch関数とは異なります。また本文書ではfetch Hookについての説明は行っておりません。

                                                                                Nuxt.jsにおけるaxiosライブラリ、asyncData Hookの使い方 | アールエフェクト
                                                                              • Axios

                                                                                Promise based HTTP client for the browser and node.js Axios is a simple promise based HTTP client for the browser and node.js. Axios provides a simple to use library in a small package with a very extensible interface.

                                                                                • vue.jsとJWTでスケーラブルな認証機構を実装する - Qiita

                                                                                  (2019.9.6:修正)誤解をまねく恐れがあったので、JWTを"セッショントークン"と呼んでいた箇所を"(ログイン)トークン"と置き換え 前回(vue.jsで簡便な認証を実装してみる)で vue.js を使った簡便な認証を実装した。今回は認証機構をスケーラブルに拡張する。 取り組もうとしている課題 - トークンを使用した認証サーバの負荷緩和 実際にはWebサービスを提供するサーバと認証機能を提供するサーバは異なることが一般的。以下のような構成となる。認証サーバにはMySQLなどのデータベースが用いられることが多い。 ただし、この構成ではユーザ数が大幅に増えた場合に認証サーバに負荷が集中し、応答の遅延によるUXの低下、正しいユーザ名・パスワードを入力しているにも関わらず認証以外の問題によるログイン障害などを引き起こす可能性がある。 これを解決する方策として一般的に使用されているのが「(ログ

                                                                                    vue.jsとJWTでスケーラブルな認証機構を実装する - Qiita

                                                                                  新着記事