ホームページ ウェブフロントエンド jsチュートリアル Axios でのクロスドメイン実装の 3 つの方法は何ですか?

Axios でのクロスドメイン実装の 3 つの方法は何ですか?

Aug 20, 2020 pm 01:15 PM
axios クロスドメイン

クロスドメイン axios を実装する 3 つの方法: 1. [mian.js] で axios を参照、コードは [Vue.prototype.$axios = axios]; 2. ページで axios を参照、コードは [this.$axios.post('/api/].

Axios でのクロスドメイン実装の 3 つの方法は何ですか?

##クロスドメイン Axios を実現する 3 つの方法:

1. mian.js は axios

import axios from 'axios'
 
Vue.prototype.$axios = axios
ログイン後にコピー

2 を参照します。config/index.js

proxyTable: {
 
    '/api': {
 
         target: 'http://127.0.0.1/hyhy/',//设置你调用的接口域名和端口号 别忘了加http
 
         changeOrigin: true,
 
         pathRewrite: {
 
              '^/api': '/'//这里理解成用‘/api’代替target里面的地址,后面组件中我们掉接口时直接用api代替 比如我要调             用'http://40.00.100.100:3002/user/add',直接写‘/api/user/add’即可
 
        }
 
    }
 
}
ログイン後にコピー

3 の dev に次のコードを追加します。ページ内で引用します

this.$axios.post('/api/userlogin/login', Qs.stringify({ username: this.username, password: this.password }))
 
.then((response) => {
 
    console.log(response)
 
})
 
.catch((response) => {
 
    console.log(response)
 
})
ログイン後にコピー

関連する学習に関する推奨事項:

js ビデオ チュートリアル

以上がAxios でのクロスドメイン実装の 3 つの方法は何ですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。

ホットAIツール

Undresser.AI Undress

Undresser.AI Undress

リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover

AI Clothes Remover

写真から衣服を削除するオンライン AI ツール。

Undress AI Tool

Undress AI Tool

脱衣画像を無料で

Clothoff.io

Clothoff.io

AI衣類リムーバー

AI Hentai Generator

AI Hentai Generator

AIヘンタイを無料で生成します。

ホットツール

メモ帳++7.3.1

メモ帳++7.3.1

使いやすく無料のコードエディター

SublimeText3 中国語版

SublimeText3 中国語版

中国語版、とても使いやすい

ゼンドスタジオ 13.0.1

ゼンドスタジオ 13.0.1

強力な PHP 統合開発環境

ドリームウィーバー CS6

ドリームウィーバー CS6

ビジュアル Web 開発ツール

SublimeText3 Mac版

SublimeText3 Mac版

神レベルのコード編集ソフト(SublimeText3)

Vue アプリケーションで axios を使用しているときに「Uncaught (in Promise) Error: Request failed with status code 500」が発生した場合はどうすればよいですか? Vue アプリケーションで axios を使用しているときに「Uncaught (in Promise) Error: Request failed with status code 500」が発生した場合はどうすればよいですか? Jun 24, 2023 pm 05:33 PM

Vue アプリケーションで axios を使用するのは非常に一般的です。axios は、ブラウザーと Node.js で使用できる Promise ベースの HTTP クライアントです。開発プロセス中に、「Uncaught(inpromise)Error: Requestfailedwithstatuscode500」というエラー メッセージが表示されることがありますが、開発者にとって、このエラー メッセージは理解および解決が難しい場合があります。この記事ではこれについて説明します

Vue アプリケーションで axios を使用するときに「TypeError: Failed to fetch」が発生した場合はどうすればよいですか? Vue アプリケーションで axios を使用するときに「TypeError: Failed to fetch」が発生した場合はどうすればよいですか? Jun 24, 2023 pm 11:03 PM

最近、Vue アプリケーションの開発中に、「TypeError: Failedtofetch」エラー メッセージという一般的な問題に遭遇しました。この問題は、axios を使用して HTTP リクエストを作成し、バックエンド サーバーがリクエストに正しく応答しない場合に発生します。このエラー メッセージは通常、ネットワーク上の理由またはサーバーが応答していないことが原因で、リクエストがサーバーに到達できないことを示します。このエラーメッセージが表示された後はどうすればよいでしょうか?以下にいくつかの回避策を示します。

Vue でのデータ リクエストの選択: Axios または Fetch? Vue でのデータ リクエストの選択: Axios または Fetch? Jul 17, 2023 pm 06:30 PM

Vue でのデータ リクエストの選択: AxiosorFetch? Vue 開発では、データ リクエストの処理は非常に一般的なタスクです。データリクエストにどのツールを使用するかを選択することは、考慮する必要がある問題です。 Vue で最も一般的なツールは、Axios と Fetch の 2 つです。この記事では、両方のツールの長所と短所を比較し、選択に役立つサンプル コードをいくつか示します。 Axios は、ブラウザおよび Node.js で動作する Promise ベースの HTTP クライアントです。

Vue アプリケーションで axios を使用するときに発生する「エラー: ネットワーク エラー」の問題を解決するにはどうすればよいですか? Vue アプリケーションで axios を使用するときに発生する「エラー: ネットワーク エラー」の問題を解決するにはどうすればよいですか? Jun 25, 2023 am 08:27 AM

Vue アプリケーションで axios を使用するときに発生する「エラー: NetworkError」の問題を解決するにはどうすればよいですか? Vue アプリケーションの開発では axios を使って API リクエストをしたり、データを取得したりすることが多いのですが、axios リクエストで「Error: NetworkError」が発生することがあります。まず、「Error:NetworkError」の意味を理解する必要があります。これは通常、ネットワーク接続が切断されていることを意味します。

Vue と Axios を効率的に活用してフロントエンド データのバッチ処理を実装する Vue と Axios を効率的に活用してフロントエンド データのバッチ処理を実装する Jul 17, 2023 pm 10:43 PM

Vue と Axios を効率的に活用して、フロントエンド データのバッチ処理を実装します。フロントエンド開発ではデータ処理が一般的なタスクです。大量のデータを処理する必要がある場合、効果的な方法がなければ、データの処理は非常に煩雑で非効率的になってしまいます。 Vue は優れたフロントエンド フレームワークであり、Axios は人気のあるネットワーク リクエスト ライブラリであり、連携してフロントエンド データのバッチ処理を実装できます。この記事では、Vue と Axios を効率的に使用してデータのバッチ処理を行う方法を詳しく紹介し、関連するコード例を示します。

PHP セッションのクロスドメイン問題の解決策 PHP セッションのクロスドメイン問題の解決策 Oct 12, 2023 pm 03:00 PM

PHPSession のクロスドメイン問題の解決策 フロントエンドとバックエンドの分離の開発では、クロスドメイン要求が標準になっています。クロスドメインの問題に対処するときは、通常、セッションの使用と管理が必要になります。ただし、ブラウザーのオリジンポリシーの制限により、デフォルトではセッションをドメイン間で共有できません。この問題を解決するには、いくつかの技術と方法を使用して、セッションのクロスドメイン共有を実現する必要があります。 1. ドメイン間でセッションを共有するための Cookie の最も一般的な使用法

Vue アプリケーションで axios を使用するときに「TypeError: binding is not a function」が発生した場合はどうすればよいですか? Vue アプリケーションで axios を使用するときに「TypeError: binding is not a function」が発生した場合はどうすればよいですか? Jun 25, 2023 am 08:31 AM

Vue.js アプリケーションでは、axios を使用するのが非常に一般的です。 Axios は、非同期 HTTP リクエストを簡単に送信できる強力な HTTP リクエスト ライブラリです。ただし、axios を使用すると、いくつかのエラーが発生します。そのうちの 1 つは「TypeError:bindisnotafunction」です。このエラーは通常、axios バージョンが Vue.js と互換性がないことが原因で発生します。このエラーの解決策を見てみましょう。まず必要なのは、

Vue と Axios は非同期データリクエストの同期処理を実装します。 Vue と Axios は非同期データリクエストの同期処理を実装します。 Jul 17, 2023 am 10:13 AM

Vue と Axios は非同期データ リクエストの同期処理を実装します。 はじめに: 最新のフロントエンド開発では、ページが非同期データ リクエストを通じてデータを取得し、それを動的に表示する必要があるため、非同期処理は避けられない要件となっています。ただし、非同期データ要求によりコード ロジックが複雑になり、保守が困難になることがよくあります。 Vue フレームワークでは、Axios ライブラリを使用して非同期データ リクエストの同期処理を簡単に実装できるため、コードの可読性と保守性が向上します。 1. Vue の概要 Vue は軽量のフロントエンド フレームワークです。

See all articles