0

ノード上で実行されている ember.js を使用してアプリケーションを開発しています。

ここで、いくつかの外部 Web サービスを呼び出し、それに応じて (Web サービスの応答に基づいて) ホームページを作成する必要があります。

  • これらの Web サービスは、外部サーバー (別のドメイン) で実行されています。現在、ローカル環境から Web サイトを実行しています。
  • 認証:有効な資格情報を提供した後でのみ、ユーザーはこれらの Web サービスにアクセスできます。つまり、ブラウザからこの Web サービスにアクセスしようとすると、最初にユーザー名とパスワードの入力を求められます。これらの資格情報が有効な場合 (サーバー側の検証)、応答 json が返されます。

私のapp.jsコードは次のとおりです。

var express = require('express');
var routes = require('./routes');
var http = require('http');
var path = require('path');

var app = express();

// all environments
app.set('port', process.env.PORT || 3000);
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'ejs');
app.use(express.favicon());
app.use(express.logger('dev'));
app.use(express.bodyParser());
app.use(express.cookieParser('your secret here'));
app.use(express.session());
app.use(express.methodOverride());
app.use(app.router);
app.use(express.static(path.join(__dirname, 'public')));

// development only
if ('development' == app.get('env')) {
    app.use(express.errorHandler());
}

app.get('/', routes.index);

http.createServer(app).listen(app.get('port'), function(){
    console.log('Express server listening on port ' + app.get('port'));
});

ホームページのコード (簡単にするために、すべてのビューを削除し、ページの読み込み時に外部 Web サービスを呼び出すだけです)

<html>
<head>
    <title>Lets think..</title>
    <script src="./javascripts/libs/handlebars-1.0.0.js"></script>
    <script src="./javascripts/libs/jquery-1.9.1.js"></script>
    <script src="./javascripts/libs/ember-1.1.2.js"></script>
    <script>
        window.App = Ember.Application.create();
    </script>

    <script>
        $(window).load(function(){
            $.ajax({
                type: 'GET',
                url: 'http://vpn.domain_name.com/myServer/WebService/json/getInfo',
                data: {username: "user_name",password: "my_password"},
                success: function (data) {
                    console.log('sucess');
                },
                failure: function(error){
                    console.log('error');
                }
            });
        });
    </script>
</head>
<body>

</body>
</html>

上記のように、ブラウザーから (資格情報の検証後) 以下の Web サービス ( http://vpn.domain_name.com/myServer/WebService/json/getInfo ) に正常にアクセスできました。

ただし、コードからアクセスしようとすると、次のエラーが表示されます: Firebug によるデバッグ時:

"NetworkError: 401 Unauthorized - http://vpn.domain_name.com/myServer/WebService/json/getInfo?username=user_name&password=my_password"

Google Chromeコンソールを介したデバッグ時:

XMLHttpRequest cannot load http://vpn.domain_name.com/myServer/WebService/json/getInfo?username=user_name&password=my_password. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:3000' is therefore not allowed access.

上記のエラーがクロス ドメイン アクセスによるものなのか、http 基本認証エラーによるものなのかはわかりません。

CORS を許可する方法で提案されているソリューションを試してみました。およびhttp://nthloop.com/blog/local-dev-with-nodejs-proxy/

ただし、コードから適切な応答を取得できませんでした。誰でもこれについて私を案内してもらえますか。

ありがとうございました。

4

2 に答える 2

1

(実際の質問ではなく、コメントへの回答です)

を使用して基本認証のログイン資格情報を渡したい場合$.ajax:

$.ajax({
  type      : 'GET',
  url       : 'http://vpn.domain_name.com/myServer/WebService/json/getInfo',
  username  : 'user_name',
  password  : 'my_password',
  success   : function (data) {
    console.log('success');
  },
  failure   : function(error){
    console.log('error');
  }
});

username(とpasswordを URL パラメータとして渡す代わりにdata)。

于 2013-11-25T13:52:19.137 に答える
1

XMLHttpRequest と同じドメイン ポリシーを克服するための単純なトリックであるため、最初は JSONP を使用しました。ただし、私がアクセスしている Web サービスでは、JSONP データ型に関するいくつかの問題が発生しました (基本的な http 認証が初めて失敗し、応答で奇妙なエラーSyntaxError: missing ; before statementがスローされます)。JSONP で動作する Web サービスをあまり制御できないため、JSONP オプションを削除することを考え、クロスドメインの問題を処理するhttp-proxyメソッドの方法に進みました。

クライアント コードに次の変更を加えたところ、Web サービスに正常にアクセスできるようになりました。

(1) インストールされた http-proxy npm

(2) app.jsに以下の行を追加

var httpProxy = require('http-proxy');

var endpoint  = {
    host:   'IP_ADDRESS_OR_DOMAIN_NAME', //of webservice
    port:   80, 
    prefix: '/myServer/WebService/json'  //all my webservices are accessed through this path
}

app.use(function(req, res) {
    if (req.url.indexOf(endpoint.prefix) === 0) {
        proxy.proxyRequest(req, res, endpoint);
    }
});

(3) 私の ajax 呼び出しは次のようになります。

$(window).load(function(){
            $.ajax({
                type: 'GET',
                url: '/myServer/WebService/json/getInfo',
                username: "user_name",
                password: "password",
                success: function (data) {
                    console.log('sucess');
                    console.log(data);
                },
                failure: function(error){
                    console.log('error');
                }
            });
        });

ここで: /getInfo は Web サービスです (基本的な http 認証を使用)。

お役に立てれば!

ありがとう。

于 2013-11-25T22:16:23.697 に答える