Vuejs 프록시

Question

내가 로컬 호스트 즉, URL에 webpack 템플릿을 사용 vuejs 프로젝트를 개발하고 웹팩 템플릿으로 작동하지 : localhost:8080를하지만 과거에

https://foo.bar.com에서 실행되는 급행 서버를 가지고, 내가 직접 요청을 한 CORS를 사용하지 않음으로써 익스프레스 서버로 보내지 만 지금은 프록시를 통해 요청을하려고합니다.

... 
methods: { 
    Login(){ 
    // trying 3 times with different urls 
    api.request('post', 'login', {email, password}).then().catch() 
    api.request('post', '/login', {email, password}).then().catch() 
    api.request('post', 'https://foo.bar.com/login', {email, password}).then().catch() 
    } 
} 

하지만 내가 얻을 :

이 API Proxying During Development에 따르면 나는 components/login.vue

나는 이런 식으로 뭔가를 내 config/index.js

proxyTable: { 
    // proxy all requests starting with /api to jsonplaceholder 
    '/': { 
    target: 'https://foo.bar.com', 
    changeOrigin: true, 
    pathRewrite: { 
    '^/': '' 
    } 
} 

에 그리고 내 로그인 페이지에서 다음을 추가 한 다음과 같은 오류 :

는 NPM에서 CORS 패키지를 설치합니다 다음과 같이Failed to load https://foo.bar.com/login: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:8080' is therefore not allowed access.

Answer 1

당신은

$ npm install cors 

자세한 내용은 코드

var express = require('express') 
var cors = require('cors') 
var app = express() 

app.use(cors()) 

app.get('/api/message', function (req, res, next) { 
    res.json({msg: 'This is CORS-enabled for all origins!'}) 
}) 

아래처럼 명시 응용 프로그램에서 사용하여 명시 응용 프로그램에서 CORS를 활성화해야 정보를 필요에 맞게 사용자 정의하려면 https://github.com/expressjs/cors

를 참조하십시오.