IIS web.config でクロスドメイン アクセスを設定する方法

IIS web.config でクロスドメイン アクセスを設定する方法

要件: ページに画像を表示する必要がありますが、さまざまな理由により、画像はサーバー 2 にありますが、表示するプログラムはサーバー 1 にあります。これにより、表示時にクロスドメインの問題が発生しています。当初のアイデアは、バックグラウンドで画像パスを取得するプログラムを直接記述し、画像をダウンロードしてから、画像アドレスをサーバー 1 に返すことでした。ただし、このサイクルの不確実性とこの段階でのプロジェクトの緊急性のため、断念されました。 2 番目の方法に切り替えて、js 経由で画像をサーバーにダウンロードします。 。いろいろ情報を探したり、他の人とやり取りしたりしたのですが、実現できないことがわかりました。そこで、js+ca​​nvas を使ってローカルに保存しようと思ったのですが、どうやらローカルにしか保存できないらしいことがわかりました。すると、問題は出発点に戻りました。ウェブサイトにすでに写真がある場合、それを直接導入することは可能でしょうか? 情報を調べて慎重に分析し、テストとデバッグを行った後、写真の導入を正確に実装するという問題は解決しました。

プロセス: 画像のインポートのためのクロスドメインソリューション

結果: クロスドメイン問題を解決するためにWebconfig設定を変更する

<?xml バージョン="1.0" エンコーディング="utf-8"?>
 
<!--
  ASP.NET アプリケーションの構成方法の詳細については、http://go.microsoft.com/fwlink/?LinkId=169433 を参照してください。
  -->
 
<構成>
    <システム.web>
        <コンパイルデバッグ="true" targetFramework="4.0" />
  <customErrors mode="Off"/> ここでは、外部ネットワークのエラーログも確認できます <webServices>  
       	  <プロトコル>  
          	<名前を追加="HttpGet"/>  
          	<名前を追加="HttpPost"/>  
        	</プロトコル>  
      	</ウェブサービス>
 
    </システム.web>
  <システム.Webサーバー>  
    <httpプロトコル>   
    <カスタムヘッダー>   
      <add name="Access-Control-Allow-Methods" value="OPTIONS,POST,GET"/>   
      <add name="Access-Control-Allow-Headers" value="x-requested-with,content-type"/>   
      <add name="Access-Control-Allow-Origin" value="*, http://192.168.0.178:8068" />   
    </カスタムヘッダー>   
  </httpプロトコル>   
  
  </system.webServer>

主な問題は、上記のように設定されたクロスドメインアクセス許可の制限です。

このようにして、サーバー 1 で画像を表示するときにクロスドメインの問題を解決できます。

IIS web.config でクロスドメインを設定する方法

ウェブサイトの開発では、クロスドメインが必要になる場合がありますが、IIS はどのようにしてクロスドメインを設定するのでしょうか? web.config ファイルで直接設定することができます。設定方法は次のとおりです。

<システム.Webサーバー>
  <httpプロトコル>
    <カスタムヘッダー>
      <add name="Access-Control-Allow-Methods" value="OPTIONS,POST,GET"/>
      <add name="Access-Control-Allow-Headers" value="x-requested-with"/>
      <add name="Access-Control-Allow-Origin" value="*" />
    </カスタムヘッダー>
  </httpプロトコル>
</system.webServer>

上記の web.config を設定することで、クロスドメイン Web サイトを実現できます。

クロスドメインIIS Webconfig IIS設定方法の共有です

アクセス制御許可オリジンを設定する

IIS を開き、「HTTP 応答ヘッダー」を見つけてクリックします。

右側に「追加」があるので、次のヘッダーを追加します。

アクセス制御許可ヘッダー: コンテンツタイプ、api_key、認証

アクセス制御許可元: *

次のように

<システム.Webサーバー>
<httpプロトコル>
<カスタムヘッダー>
<add name="Access-Control-Allow-Methods" value="OPTIONS,POST,GET"/>
<add name="Access-Control-Allow-Headers" value="x-requested-with,Content-Type"/>
<add name="Access-Control-Allow-Origin" value="*" />
</カスタムヘッダー>
</httpプロトコル>
</system.webServer>

IIS web.config でクロスドメイン アクセスを設定する方法については、これで終わりです。IIS クロスドメイン アクセスの詳細については、123WORDPRESS.COM の以前の記事を検索するか、次の関連記事を引き続き参照してください。今後とも 123WORDPRESS.COM をよろしくお願いいたします。

<<:  Web デザインにおける HTML フォーマットと長いファイルに関するヒント

>>:  MySQL MVCCメカニズム原理の詳細な説明

推薦する

CSS でのシングル div 描画テクニックの実装

純粋な HTML + CSS を使ってドラえもんの絵を描くなど、CSS 描画に関する記事をよく見かけ...

JSは円形のプログレスバーのドラッグとスライドを実装します

この記事の例では、円形のプログレスバーのドラッグアンドスライドを実現するための具体的なJSコードを紹...

Windows 64 ビット版 MySQL 5.7 以降の解凍パッケージにデータディレクトリと my-default.ini がなく、サービスが起動できない問題の簡単な解決方法 (問題概要)

私は SQL の初心者で、オープンソースのインストールは非常に簡単だと思っていましたが、その過程でい...

Uniapp WeChatアプレット: キー障害の解決策

ユニアプリコード <テンプレート> <表示> <image v-for...

Tencent Cloud Serverをゼロから導入する方法

初めての投稿ですので、間違いや問題点などありましたら、コメント欄で指摘していただければ、今後改善させ...

MySQLはconnect_by_isleaf MySQLメソッドまたはストアドプロシージャに似た機能を実装します

最近、特に異常なビジネス需要があり、テーブルがあります テーブル「デモ」を作成します( `id` i...

JavaScript におけるイベント バブリング メカニズムの詳細な分析

バブリングとは何ですか? DOM イベント フローには、イベント キャプチャ ステージ、ターゲット ...

Vue3とElectronを使ったデスクトップアプリケーションの詳しい説明

目次Vue CLIはVueプロジェクトを構築しますVue プロジェクトをマークダウン エディターに変...

formData 形式タイプを使用してファイルをアップロードする Vue の例

Vue では、一般的にフロントエンドとバックエンドを分離したプロジェクトがあり、データ操作を実装する...

Centos7.3は起動時に自動的に起動または指定されたコマンドを実行します

Centos7では、/etc/rc.d/rc.localファイルの権限が削減されており、実行権限があ...

CSS に基づいて MaterialUI ボタン​​クリックアニメーションを実装し、それを React コンポーネントにカプセル化します。

序文フロントエンドフレームワークのヘビーユーザーとして、私はテクノロジーを選択する際にそのエコロジー...

CSS で 3D ブック効果を実装するためのサンプル コード

さっそく、レンダリングを見てみましょうソースコードは以下のとおりです <!DOCTYPE ht...

一般的な Linux の問題に対する解決策の概要

1. VMwareでCentos7を接続し、固定IPを設定する1) まず、仮想イメージ名を右クリック...

ul リスト タグ デザイン ウェブ ページ 複数列レイアウト

数日前、CSS で 3 列レイアウトを書いていたときに、突然この方法を思いつきました。このアイデアは...

リフレッシュリダイレクトを実現する HTML ヘッドタグメタ

コードをコピーコードは次のとおりです。 <html> <ヘッド> <m...