2016-08-12 12 views
0

Expressを使用して静的資産を提供しています。フロントエンドはAngularJS 1.xで、html5modeが有効になっています。私はクロームのdevのツールで次のように気づいたところreCAPTCHAのを実装しようとすると、次のとおりです。外部リソースによる明示的および静的資産

Uncaught SyntaxError: Unexpected token <

api.js?onload=vcRecaptchaApiLoaded&render=explicit“:1

私は私が受け取るreCAPTCHAのプロセスを開始する機能をクリックすると:

Error: reCaptcha has not been loaded yet.

これまでのところ、これがあることを意味します最初のエラーが報告している文字列が、GoogleからRecaptchaを読み込むためのURLパスの一部であることに気づいたためです。

chromeツールでurl(api.js?onload = vcRecaptchaApiLoaded & render = explicit ":1)をクリックすると、index.htmlが読み込まれます。奇妙な!

これは、私の静的資産提供と関係があると考えています。私は牛が家に帰るまで、私のエクスプレスサーバーで遊んだので、救済方法を理解することはできません。

ライブの例は: http://ninjacape.herokuapp.com

ここに私のコードで、ご覧頂きありがとうございます!

index.htmlを

<script src=“https://www.google.com/recaptcha/api.js?onload=vcRecaptchaApiLoaded&render=explicit“ async defer></script> 

express.js

var express = require('express'); 
var compression = require('compression'); 
var app = module.exports.prod = exports.prod = express(); 

var devAPI = 'http://localhost:1337'; 

app.use(compression()); 

app.use(express.static('.tmp')); 

app.get('/*', function(req, res) { 
    res.sendFile(__dirname + '/.tmp/index.html'); 
}); 

var proxy = require('express-http-proxy'); 
app.use('/api', proxy(devAPI)); 

var port = process.env.PORT || 8000; 
app.listen(port); 

答えて

0

うーん...私はしかし、私はそれが動作するようになっただけで幸せです、より良い答えを持っていたいです。私が静的にファイルを提供している方法で何かがindex.htmlのURLをhttp://localhost:8000に追加しています。この問題を回避するために、Expressへの実際のリクエストを見て、URLを見つけました。その後、そのリクエストを実際のURLにリダイレクトするロジックが追加されました。詳細については、下記のコメントコードを参照してください。

// Any requests matching /* 
app.get('/*', function(req, res, next) { 

    // Log the original url express is tying to go to 
    console.log(req.url); 

    // This is the url found from the step above (Where are the extra characters coming from?!) 
    var url ='/%E2%80%9Chttps://www.google.com/recaptcha/api.js?onload=vcRecaptchaApiLoaded&render=explicit%E2%80%9C' 

    // Self explanatory 
    if (req.url === url) { 

    // Respond by redirecting the request 
    res.redirect('https://www.google.com/recaptcha/api.js?onload=vcRecaptchaApiLoaded&render=explicit') 

    //End this block and continue 
    next(); 

    } else { 

    // If it doesn't match the above url, proceed as normal 
    res.sendFile(__dirname + '/.tmp/index.html'); 
    } 

}); 
関連する問題