急行+ CORS（）が適切に

Question

私が反応するアプリケーションを構築していると私はhttps://itunes.apple.com/search?term=jack+johnson

に電話をかけるためにしようとしている動作していない私は次のようになり、ヘルパーと呼ばれるrequestHelper.jsあります

import 'whatwg-fetch'; 

function parseJSON(response) { 
    return response.json(); 
} 

function checkStatus(response) { 
    if (response.status >= 200 && response.status < 300) { 
    return response; 
    } 

    const error = new Error(response.statusText); 
    error.response = response; 
    throw error; 
} 

export default function request(url, options) { 
    return fetch(url, options) 
    .then(checkStatus) 
    .then(parseJSON); 
} 

を

は、だから私は得る：

のXMLHttpRequestが https://itunes.apple.com/search?term=jack%20johnsonをロードすることはできません。いいえ 要求された リソースに 'Access-Control-Allow-Origin'ヘッダーが存在します。したがって、オリジン 'http://localhost:3000'は許可されません。

私の急行サーバは次のようになります。

const ip = require('ip'); 
const cors = require('cors'); 
const path = require('path'); 
const express = require('express'); 
const port = process.env.PORT || 3000; 
const resolve = require('path').resolve; 
const app = express(); 

app.use(cors()); 
app.use('/', express.static(resolve(process.cwd(), 'dist'))); 

app.get('*', function(req, res) { 
    res.sendFile(path.resolve(resolve(process.cwd(), 'dist'), 'index.html')) 
}); 

// Start app 
app.listen(port, (err) => { 
    if (err) { 
    console.error(err.message); 
    return false; 
    } 

    const divider = '\n-----------------------------------'; 
    console.log('Server started ✓'); 
    console.log(`Access URLs:${divider}\n 
    Localhost: http://localhost:${port} 
     LAN: http://${ip.address()}:${port} 
    ${divider} 
    `); 
}); 

私はmode: 'no-cors'を使用して試してみましたが、応答が空であるので、私は必要なもの、実際にはありません。

この設定で何か問題がありますか？

Answer 1

Aでホストされているコードは、この場合、Aはあなたのエクスプレスのアプリであり、Bは、iTunesのではB.

への要求を行う際における同一生成元ポリシーキックが。

CORSは、BがAのコードに応答を読み取るための許可を与えるために使用されます。

CORSをAに設定しています。サイトがクライアントサイドコードに別のサイトのデータを読み取る権限を与えることができないため、これは役に立ちません。

あなたはB上にそれを設定する必要があります。おそらくあなたがアップルでは動作しないので、これはできません。アップル社のみがお客様のクライアント側コードにサーバーからデータを読み取る権限を与えることができます。

代わりにサーバーサイドコードでデータを読み取ります。